wordpressでのスマホ対応webサイト制作・wpプラグイン・SNS活用・ 動画・bgmやテーマ曲アレンジまで考えるコラム!

   

wordpress屋のマルチメディアコンテンツ制作読んどけ☆コラム

【WPカスタマイズ】子テーマさえ入れとけば大丈夫?なわけねーだろ!(親テーマに手を入れる・ファイルコピー適応させる羽目になる事例)

   

こんにちは、管理人@SS_mshpです。

今回は、推奨されてる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を調べて、指定しているクラスを書き換える』、『指定しているクラス部分を子テーマにコピペして、色の記述を変える』という対応をしました(#f16c20というのが、コントローラーをオレンジ色にしているカラーコードです)。

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

親テーマをどうしても変更したくない時~変更するファイルを子テーマ内にコピーして読み込ませる

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

スクリプトエディタとかにコピーした親テーマのheader.phpを、子テーマのフォルダ内に、FFFTPで送りました。


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

あとがき・まとめ

どうやら、『推奨されているからといって、単純に子テーマ入れとけばOK』、ということにはならなかったようです。

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

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

*アトリエSS・web関連サービスページに移動します。

【カテゴリ】 - webサイト制作 【タグ】 -

Message

メールアドレスが公開されることはありません。

  関連記事

(ヘッダーとか見出しの要素を)片方だけ丸い・台形・矢印などおしゃれデザインにできるCSSやってみた

今回はWebサイトでよくある『ガチガチ長方形とか正方形みたいな要素』では …

【WPの仕組み】スマホとかに対応するレスポンシブ化(デバイスに応じてレイアウト変動)ってどうなってるの?

今回は、よくある疑問『wordpressのスマホ対応とかレスポンシブの仕 …

ワードプレス・手動インストールってどうやるの?(自動インストールがない、あるいはエラーの場合)

今回は、サーバーの簡単インストールなどで、エラーになって入らない場合の対 …

ワードプレス・ブログメディアで、ヘッダー画像を変える2通りの方法【phpモバイル非表示有】

今回は、ワードプレス・ブログメディアのサイトを作ったときに、ヘッダー(上 …

音声セミナー・講座・音楽視聴をサイトに実装できる、HTML5 audio要素を使いこなそう

今回は、管理人もこのサイトやお仕事受付サイトで使用している、便利なHTM …

【ワードプレステーマカスタマイズ】勝手にヘッダーの追加CSSで入ってくるマージンを消したいんですけど

今回は、ワードプレスのテーマカスタマイズしてオリジナルデザインにするとき …

ワードプレスの子テーマって、なぜ必要なの?

今回は、ワードプレスサイトを作るときにたまに話題になる『子テーマ』につい …

webサイトがカッコ良くなるCSS~RGBAカラーやグラデーションで微妙な色合いも表現

今回は、webサイトをカッコ良く見せるために必要な基本技術・CSS(スタ …

fc2ブログでSSL対応開始!設定方法や注意点をチェック!

今回は、管理人も使っている大手ブログサービス(fc2)で、ブログ本体もS …

bootstrapのcolクラスをとphp関数を使って、3列レイアウトとブログ2カラムを切り替える

今回は、1ドメイン・1サイトで『トップページやコーポレート部分は1カラム …