ワードプレスの「子テーマ」とは?【誰でもできる作り方まとめたよ!!!】

こんばんは。

 

子どもっておはなし好きですよね。

我が子も絵本の読み聞かせ、大好きです。寝かしつけの時に、息子2人と一緒に、3人仰向けに並んで読みます。

実は最近、「読み聞かせをする時は同時にどこか鍛える」ことを、自分の日課にしています。

足とか頭とかお尻とかをちょっとだけ上げたまま、絵本を読み聞かせてます。

 

ゼーハーー(;´Д`)

 

 

Mです。

 

今回は、エックスサーバー上での子テーマの作成方法を書いてます。他社サーバーをお使いの場合、後半はご期待に沿えないと思います。ごめんなさい。でも前半は読んでね。

ワードプレスの子テーマとは何ぞや

まず、そもそもワードプレスの「子テーマ」とは何か。

親がいるのか。

子テーマが何なのかさっぱり分からないのに、親御さんは何をしているのか。

親御さんは忙しいようなので、ちょっと説明してみる。

 

 

いや待って。

偉そうに「説明してみる」とか言ったわりに良く分からないや!

 

ググってくる!!

 

 

 

ただいま!

 

説明しよう!!(`・ω・´)

 

「テーマ」というのは、テンプレートのこと。ワードプレスの見た目を整える型のこと。

「親テーマ」というは、そのテーマの作成者によって公表・配布されている、テンプレートそのもののこと。

 

だから、「テーマ=親テーマ」である。

 

 

じゃあ、「子テーマ」は???

「親テーマの見た目をそっくり引き継ぎつつ、

ピアス開けたり髪染めたりコスプレしたりできる、カスタマイズ用のテーマのこと」

 

 

もしかして「子テーマ」はヤンキーなのかな?

いや、ヤンキーではない。

いい子である。

 

ワードプレスの人気テーマを使うとどうなる?

ワードプレスの魅力は、無数にあるテーマだ。

オシャレで目うつりしそうなテーマが、世界中にある。

 

 

なのにどうして、子テーマなんていうややこしい不良娘の存在が出てくるのか。

いや不良ではない。

いい子である。←え、しつこい?

 

 

 

ワードプレスには、人気テーマがいくつもある。

人気テーマは使いやすく、かっこよく、使っている人の事例や体験談も見つけやすい。

ワードプレスを始めたばかりなら、人気テーマが断然おススメ。

 

 

そんな人気テーマを選んだはずなのに!

 

 

ワードプレスでサイトを運営していると、

絶対!100%!と言っていいほど、

見た目をいじりたくなる。

 

 

 

時間をかけてコツコツ、せっせと作り上げた自分のサイトは、言わばわが子。

わが子同然。

愛着もひとしお。

本気で言っている。

 

 

 

そんなわが子同然のサイトが、もし、他の子と見分けが付かなかったら??

 

「かわいいわが子なのに、パッと見よその子とおんなじやんけ!!」

ってなる。

 

 

「個性は?個性がないやんけ!!!」

と。

 

 

デザイン的に完成されたテーマを使っていても、他のサイトとの差別化を図りたくなるのが普通だ。

 

 

ワードプレスを使うと、皆一度は通る葛藤なんじゃないかな。

 

 

 

使い慣れない人ほど、使いやすく情報の多い、人気テーマを使ったほうがいい。

でも、人気テーマを選ぶと、サイトの見た目がみんな似かよってしまう。

 

親テーマのカスタマイズはお勧めしない

だったらテーマをちょこっといじったらええやん!と思った、知識をお持ちのあなた。

ピアスつけて、髪染めて、ちょっとコスプレとかしたらええやん?というあなた。

 

 

結論から言うと、親テーマは、親のままいじらない方がいい。

いじる?どこをどう??????と思ったあなたも、分からなくて良いからついてきてね。

 

親テーマを触らないほうがいいたった1つの理由

テーマのバージョンアップのたびに、カスタマイズが水の泡になるから。

これだけ。

 

 

テーマは、製作者さんが必要と感じたタイミングで適宜バージョンアップしてくれる。

このバージョンアップは、無視するべきものじゃなくて、その都度した方が使い勝手・セキュリティ面ともに良い。これは間違いない。

そして、きちんとしたテーマの製作者さんほど、バージョンアップもこまめだ。

 

 

バージョンアップの時に、親テーマの情報は書き換えられる。

 

カスタマイズした部分も、すべて新しく書き換えられる。

 

 

カスタマイズに費やした時間と労力が無駄でしょ。

親テーマのカスタマイズなんて、無意味なものに時間と労力を費やしちゃだめだよ。

 

 

そこで「子テーマ」の出番だ。

子テーマは「カスタマイズ用のコピー」

親とか子とか言っているから、親子のイメージがあるけど、子テーマは言うなれば、「カスタマイズ用のコピー」だ。

 

親テーマが持つのが、「こんな見た目に整えてね」という役割。

それに対して子テーマは、「ここだけ着替えて、ネイルもしようか」っていう見た目の指定をしてもいい、親テーマのコピー。

 

とても助かることに、子テーマ上でしたカスタマイズは、親テーマをバージョンアップしても変わらない。

 

 

では、誰でもできる子テーマの作り方、いってみよう。

子テーマの作り方(エックスサーバー編)

まず、サーバーのファイルをいじるので、慎重かつ丁寧な作業が必要。そこを踏まえれば初心者でも大丈夫。

  • 子テーマを作る前に、必ずサイトデータのバックアップをとるべし。
  • サイトが表示されない事態(まっしろ、どこまでも広がる白)になっていないか、1つ進むたびに確認するくらいの気持ちで良し。
  • ちょっとでも「マズイ」「自信なし」と思ったら、その作業をやめて1つ前の段階に戻るべし。
  • ここで扱ったテーマ「Giraffe」はちゃんと製作者によって子テーマが配布されています。子テーマがあるなら最初からそちらを使うべし。
  • 作業はすべて自己責任でお願いします。

 

サーバーの該当箇所まで

まず、エックスサーバーにログインする。IDとパスワードを入力し、ログイン。

 

契約しているサーバーの「ファイルマネージャ」にログイン。

 

こんな画面が開くから、まず右下。

ファイル名の文字コードを「UTF-8」にしよう。

 

そうしたら、子テーマを作りたいサイトのドメインをクリック。

 

続いて、public_htmlwp-contentをクリック。

 

ようやくたどり着いた themes をクリック。

 

子テーマを作る手順

では子テーマ作り。

何度も言うけれど、これらは要確認。最重要事項。

  • 子テーマを作る前に、必ずサイトデータのバックアップをとるべし。
  • サイトが表示されない事態(まっしろ、どこまでも広がる白)になっていないか、1つ進むたびに確認するくらいの気持ちで良し。
  • ちょっとでも「マズイ」「自信なし」と思ったら、その作業をやめて1つ前の段階に戻って確認するべし。
  • ここで扱ったテーマ「Giraffe」はちゃんと製作者によって子テーマが配布されています。子テーマがあるなら最初からそちらを使うべし。
  • 作業はすべて自己責任でお願いします。

子テーマを作りたい親テーマ(ここではgiraffe)の子テーマだと分かるような名前を入力して(giraffe-child)、フォルダ作成。

 

そうすると子テーマのフォルダができる。

その子テーマフォルダをクリック。

 

子テーマの中は当然からっぽなので、「作成」欄で style.cssと入力してファイル作成。

フォルダファイルがあるので混同しないように確認しながら進めてね。

 

次に、今作った style.css の左のボックスにチェックを入れて、編集をクリック。

 

下の画像の赤枠内のように記入し、保存しよう。

 

この時に、

画像でgiraffeとなっているところは、作りたいテーマの親テーマの名前にすること。

大文字を使わず全て小文字にすること。

下の保存文字コードを忘れずUTF-8にすること。

ができれば大丈夫。

 

コードはこんな感じなのでコピペも可能。

 

/*
Theme Name: 親テーマ名child
Template: 親テーマ名
*/
@import url('../親テーマ名/style.css');

 

もういっちょ!

「作成」欄で、functions.php と入力して、ファイル作成。

 

そうしたらさっきと同じように、functions.php の左のボックスにチェックして、編集をクリック。

 

赤枠のように記入して、同じく保存文字コードUTF-8で編集。

 

コピペはこちらから。

<?php add_action( 'wp_enqueue_scripts', 'theme_enqueue_styles' ); 
    function theme_enqueue_styles() 
    { wp_enqueue_style( 'parent-style', get_template_directory_uri() . '/style.css' ); 
} ?>

 

できた!

そうしたら、ダッシュボードから 外観→テーマと進んで見てみよう。

今作ったばかりの子テーマがあれば成功!!

 

テーマ?あるっぽいけど「壊れています」表示が出ている時は、半角スペースが抜けた、大文字使っちゃったなどの些細なミスが原因のことが多いので、もう一度見直してみよう。

子テーマで広がるカスタマイズの世界

子テーマを使うと、「これ少し大きくしたい」「ここに線つけたい」なんていうカスタマイズが楽にできる。

そして子テーマは、自作できる。

 

必要なのは、一つ進めるごとにサイトが表示されるか確認する慎重さだけ。

 

 

ワードプレスのカスタマイズは楽しい。

記事書く方が大事だけどね。

人気テーマの恩恵はちゃっかり受けつつ、皆にカスタマイズへの道が開かれるといいなと思いながら、今日はおしまい!