webコンテンツを徹底強化!WordPressサイト制作とプラグイン&テーマ情報・メンテ/エラー対応から、PHP/CSS/javascript、動画・音・イラスト等制作まで扱うコラム
マルチメディアコンテンツ制作読んどけ☆コラム

【WPカスタマイズ】子テーマさえ入れとけば大丈夫・・とならない事例(親テーマに手を入れるorファイルコピー適応必要)

      2021/02/27

今回は、推奨されてるWPの子テーマについてですが、『結局親テーマいじる羽目になるじゃん』という話題です。 管理人はほぼ自作状態になっててアップデート来ない(だから子テーマ要らない)んですけど、子テーマがなぜ必要かや、親をやらないとどうにかならん(または親からコピーしてくる)場合を見ていきます。

なぜ子テーマを作ってカスタマイズする必要があるか?

例えば、子テーマ無しで親テーマ(子がないのに親といわないけど笑)のheader.phpやCSSをガッツリ調整してカスタマイズしていたとします。

wordpressテーマには、配布元がアップデート版を出すところも多く、『このアップデート版をインストールすると、調整した部分が上書きされて初期化(つまり、バックアップしてなければカスタマイズが水の泡)』という状態になります。

そこで、子テーマを入れてそっちでCSSなどを調整することにより、親テーマがアップデートされても、変更内容が上書きされないようにする事が推奨されていました(なぜ過去形だ笑)

子テーマだけでなく、親も調整する羽目になった例

とりあえず一緒に子テーマもついてくるテーマがありましたが、実は子テーマのCSS調整だけでは、不十分なケースがありました。ここでは、管理人がフリー曲素材サイトをカスタマイズしたときに発生した事例を紹介します。ちなみに使ってみたのは『Clarina(子)』で、これは先日このぶろぐで紹介した『Llorix One Lite』親テーマにあたります。

例1:phpで出力しているが、その部分に該当するファイルが子に無い

管理人が作ったフリー楽曲素材サイトです。 とくにコメントは必要なかったので、コメントリンクを消そうと思っています。個別のブログ記事なので、『single.phpみたいなファイルを調整すればいいか』って思うじゃないですか。

でも・・・ 子テーマのClarinaには、『single.php』ないんですよね。この状態になると親も気にしなくてはいけません。

なので、親テーマである『Llorix One Lite』の個別記事を出力しているファイルから、コメントリンクの部分をカットします。

親に手を入れる羽目になりましたが、こちんとコメントリンクは消えました。youtubeにも載せているから、コメントとかでの交流はそっちで間に合ってるんですよね(笑)

例2:オーディオプレイヤーに色がついてるが元に戻したい・しかしその色を指定したCSSクラスが子には無い、わからない

このように、HTML5オーディオプレイヤーに、なぜかオレンジ色がついています。管理人的には黒の方が良いですね~。 しかし、『この色を指定している部分』が、子テーマ内にはありません

この場合は、『親テーマのCSSを調べて、指定しているクラスを書き換える』、『指定しているクラス部分を子テーマCSSにコピペして、色の記述を変える』という対応をしました(#f16c20というのが、コントローラーをオレンジ色にしているカラーコードです)。

なお、子テーマにコピペすると、『親CSSが読み込んだあとに、書き換えた子CSSが新たに適応される』という処理になります。CSSではあとから読み込んだものが優先的に適応されます。

親テーマをどうしても変更したくない時~

変更するPHPファイルを子テーマ内にコピーして読み込ませる

phpファイルを書き換えカスタマイズする時、どうしても親テーマを変更したくない場合は、『子テーマのフォルダ内に、カスタマイズしたいファイルをコピー(例えば、ここではheader.php)』するとOKです。 スクリプトエディタとかにコピーした親テーマのheader.phpを、子テーマのフォルダ内に、FFFTPで送りました。

最初はheader.phpが子にはなかったんですが、このように、子テーマでheader.phpをカスタマイズできるようになりました

CSSの場合は、カスタムCSSなどで、変えたい親のクラスを上書きする

CSSの場合は、『親を直接更新する(もうアップデートしないで、ゴリゴリオリジナルにカスタマイズする場合)』『子にCSSをコピペしてプロパティ変える』のほかに、カスタムCSSを使って、親テーマのクラスを上書きすればokです。

あとがき・まとめ

どうやら、『推奨されているからといって、単純に子テーマ入っていればOK』、ということにはならなかったようです(親をカスタマイズする形で、第三者が最小限の子テーマを用意していたため)。管理人も、編集したいファイルが入っていない子テーマに何回かあたりました。

『どの部分が親テーマが効いているか?』『アップデートがないなら、直接親カスタマイズ大丈夫か?』『子テーマにどのファイルをコピーすれば、希望した仕上がりになるか?』を気にしながら進めていくと良いでしょう。 (多少wordpressの構成に関する知識が必要になります)

とりあえず『単純に、子テーマいれて、そっちを調整すればok』とならないことがある点はおさえておきましょう。


【カテゴリ】 - wordpressテーマ情報
【タグ】 -

  関連記事

【WordPress】コーポレート&ブログ併設向きの、固定ページ1カラム・投稿2カラムレイアウトを切り替えるテーマ

今回は、このサイト(マルチメディアコンテンツ制作 読んどけコラム ...

Twenty Twenty-Oneの表示のしかた・速度・機能・カスタマイズ方法などを徹底チェック【WordPress5.6テーマ】

今回は、2020年12月8日にWordPressが5.6にアップ ...

【お洒落1ページ型無料WPテーマ】onepressを使ってみてレビュー・特徴やカスタマイズ時のポイント

今回は、WPテーマを調査していて見つけた、良い感じの1ページ型テ ...

WordPress 5.3からついてくる2020基本テーマ『Twenty Twenty』、表示の仕方・速度・カスタマイズ方法などを徹底チェック

今回は、2019年11月12日にリリースされたWordPress ...

【WordPress2019公式テーマ】Twenty Nineteenってどう?→文字デカすぎ&PCも1カラムは難点・ブロックエディタとの親和性はok

今回は、WordPressバージョン5以上に更新したら勝手につい ...

WordPressでヒーローヘッダーを実装できる、カッコいいテーマ・Exoplanet(無料版・有料pro版あり)レビュー・カスタマイザー設定のしかた

今回は、テーマを使って、WordPressでヒーローヘッダーを取 ...

【おすすめWordPressテーマ】Maxwell~シンプル・洗練されたブログメディア向きテーマ・スライダーやレイアウト変更も簡単

今回は、管理人も別サイトで使ってみた、無料WordPressテー ...