[WordPress] STINGER FANSで子テーマを作成する方法

前回の記事で、WordPressのテーマをSTINGER for FANSに変えましたが、子テーマを作っていなかったばっかりにGoogleアナリティクスのトラッキングコードがなくなってしまうという事態に陥りました。今日は今後のためにも子テーマを作っておこうと思います。

今日はそんなお話です。

スポンサーリンク




子テーマってなんぞや?

まず子テーマって何?ということですが。子がいるので親は誰ってことです。
親は当然、通常のWordPressのテーマのことですね。そこに親と同じような子供のテーマを作っておくことで親子関係ができます。子テーマでは必要なファイルだけを上書きして、残りは親のテーマを引き継ぐという形にすることできます。

特にカスタマイズをするようになると、子テーマを作成し、そこでカスタマイズをしないと、親テーマをアップデートしたときにカスタマイズが全部なくなっちゃうってことだと思います。

子テーマの作り方

では、子テーマ作成の手順を説明します。

用意するもの

事前に用意しておくものは下記の2つです。

・子テーマを入れておくフォルダ
・子テーマのstyle.cssファイル

ここでは、「STINGER for FANS」というテーマで子テーマを作ってみたいと思います。

子テーマを入れておくフォルダを作る

まず、子テーマを入れておくフォルダを作ります。フォルダの名前は何でも良いのですが、無難に私は「stinger-child」としました。
普通にデスクトップでフォルダを作って、名前をつけます。

stinger-child

style.cssファイルを作る

続いて、style.cssファイルを作ります。

テキストエディタで、名前を「style.css」にして保存。とりあえずは中身はまだ空っぽです。

style-css
私はテキストエディタは、TeraPadを使っています。Windowsに入っているメモ帳は文字化けとかしちゃうのでやめときましょう。

作成したstyle.cssファイルを開いて、以下のコードをコピペします。

/*
Theme Name: stinger-child
Template: stinger3forFANS
*/

Theme Name: には、子テーマのフォルダ名をいれます。
Template: には、親テーマのファイル名を入れます。

コードをコピペしたら保存。
先ほどの「stinger-child」フォルダにいれましょう。

FTPソフトでアップロード

続いて、「stinger-child」フォルダをFTPでアップロードします。

アップロードする場所は、テーマファイルが入っている場所の「wp-content」の「themes」の中に入れます。

wp-content-themes

子テーマを有効化

アップロードできたら、WordPressの管理画面に戻りまして、左メニューの「外観」→「テーマ」をクリックします。

するとさっき作成した子テーマが新しく追加されていますので、「有効化」します。

有効化

style.cssに追記

今の状態だとホームページが左によって崩れていますので、style.cssに追記します。
ここで方法は2つあるようですが、私は親テーマのstyle.cssを全部コピペしちゃいました。

親テーマのstyle.cssをあらかじめ全部コピーしておき、「外観」→「テーマ編集」で子テーマのstyle.cssにコピペ。

親テーマのstyle.cssを全部コピペ

トラッキングコードはheaderだった

ここではじめて気付きましたが、Googleアナリティクスのトラッキングコードは<headタグ>に入れなきゃいけないので、header.phpも子テーマに入れておかなきゃいけないんですね。

ですから、さっきのstyle.cssと同じ要領でファイルを作ります。違う点は以下の2つ。

・ファイル名は「header.php」で保存。
・中身は、親テーマのheader.phpを全部コピペ。

このファイルをFTPソフトでアップロードします。
style.cssと同じところでOK。

ようやくトラッキングコードを書き込む

はい。もう少しです。
header.phpにGoogleアナリティクスのトラッキングコードを書き込みます。

トラッキングコードをコピペ

これでOK!

Googleアナリティクスのリアルタイムで無事にトラッキングできていることを確認しました。

まとめ

今後、カスタマイズをする時は今回作成した子テーマに直接していけばいいですね。せっかくなんで少しずつカスタマイズにも挑戦しようと思います。

最後に気付きましたが、親テーマを変更した時は子テーマとか意味ないと思うので、トラッキングコードは改めて書き込まないといけないのかな?いや、やっぱりそうだろう。子テーマは、あくまで親テーマのアップデート時にカスタマイズ内容が引き継がれるという認識です。

今日はここまでです。

チャオ!

スポンサーリンク




シェアする

フォローする

スポンサーリンク