Wordpressでサイト運営 コラム

WordPressテーマカスタマイズに必須の子テーマの基本

WordPressのテーマをカスタマイズするためには、子テーマが必要です。今回は、子テーマについての基本についてご紹介していきます。

WordPressテーマカスタマイズには子テーマが必須

WordPressでサイトを初めて作成した時、テーマに直接カスタマイズをしてしまい、テーマのアップデート時にカスタマイズが全て上書きされて消えてしまった残念な経験をしました。

WordPressテーマをカスタマイズするには、「子テーマ」を利用するのが主流です。子テーマを使えば、CSSファイルで見た目を整えるだけではなく、必要なプログラムを追加したり、好きな場所に広告を自動表示したり、カスタマイズの幅がぐっと広がりますし、テーマがアップデートされた時にも、カスタマイズ内容が消えてしまう心配もなくなります。

子テーマに最低限必要なファイルは、style.cssとfunctions.phpの2つだけです。この2つのファイルがあれば、WordPressで子テーマとして認識されます。

コピペで簡単!子ファイルのコードサンプル

style.cssとfunctions.phpという2つのファイルを作り、次のサンプルコードをコピペしてから、自分用に編集するだけです。

functions.phpには、サンプルコードの内容を必ず入れておきます。これで、WordPressで子テーマが読み込まれた時に、親テーマを読み込むようになり、テーマの親子関係が成立します。

style.cssファイルには、カスタマイズする親テーマの名前・子テーマの製作者・バージョンなどのテーマに関する情報を書いておきます。
個人的に利用する子テーマなら、上のように詳しく書く必要もありません。次の4行さえあれば、子テーマとして動きますので、簡単に作りたい方は、次のサンプルコードをコピペしてご利用ください。

/*
 Theme Name:   カスタマイズ対象テーマ名-child
 Template:     カスタマイズ対象テーマ名
*/

 

Theme Name

子テーマの名前です。簡単に親テーマの名前に「-child」を付けて子テーマの名前にする場合が多いです。

Template

親テーマの名前をここに書いておきます。動作がおかしい時には、親テーマのフォルダ名になっているかを確認してみてください。

子テーマの設置方法1 (FTPアプリ使用)

① FilezillaなどのFTPアプリを利用して、WordPressのテーマフォルダ内に、子テーマの名前(親テーマの名前-child)でフォルダを作成します。

② ①で作成した子テーマフォルダ内へstyle.css, functions.phpの2つのファイルをアップロードします。

③WordPressの管理画面から、子テーマを選択して表示を確認します。

子テーマの設置方法2 (圧縮ファイル使用)

① 子テーマの名前(親テーマの名前-child)でフォルダを作成し、フォルダ内へstyle.css, functions.phpの2つのファイルを保存します。

② ①で作成したフォルダごと右クリックで圧縮します。

③WordPressの管理画面「外観」→「テーマ」へ行き、新規追加をクリックします。

④ 「テーマのアップロード」をクリックし、①で作成した子テーマ圧縮ファイルをアップロードします。

⑤子テーマを選択して表示を確認します。

子テーマの設置時のポイント

WordPress子テーマに必ず必要なstyle.css, functions.phpの2つのファイルには、親テーマに追加・変更したい内容だけ記述していきます。いわば差分ファイルです。

この2つのファイル以外を子テーマに追加すると、子テーマのファイルだけを読み込むようになり親テーマ内のファイルは読み込まれません。そのため、必要な部分を全て子テーマのファイルに記述する必要があります。親テーマのファイルをコピーしてから追加・変更を加えると、カスタマイズが楽になります。

子テーマが壊れているというエラーが表示された時に確認すること

①WordPress子テーマに必ず必要なstyle.css, functions.phpの2つのファイルが存在しているか

②style.css, functions.phpの2つのファイル名に間違いがないか

③style.css, functions.phpの2つのファイルの中身に間違いがないか(子テーマ・親テーマの名前をチェック)

1つ1つの手順をきっちりおさえていくと、子テーマを利用したWordPressテーマカスタマイズは難しくありません。テーマカスタマイズで、お気に入りのテーマをさらに自分好みに変えてしまいましょう。

困った時には、いつでもご相談くださいね。

この記事がお役に立てたら
いいね ! で最新情報を手に入れましょう

Previous Post Next Post

Related Posts