モッピー!お金がたまるポイントサイト

WordPressテーマ「Stinger5」に子テーマを導入する方法

2021/06/21

WordPressテーマ「Stinger5」に子テーマを導入する方法

親テーマのアップデート時などに非常に便利な子テーマを導入

子テーマって何??と云う方は、去年の2月17日に書かせて頂いたこちらの記事、

[adsense]

を読んで頂けたら助かります。簡単に説明するとブログのデザインを決める「スタイルシート(style.css)」と云うファイルが各テーマの中にはあるのですが、アップデートなどでスタイルシートが変更されてしまったとき、それまで自分が変更していた設定(数値)も一緒に変更されてしまうため、別にファイル(子テーマ)を作って、そこに自分のカスタマイズしたい項目だけを記載して、データが消えないようにする為の便利な方法です。

「なぜデフォルトでそうなっていないのか?」 

とか思った人は私も知りたいのでググってみてください(笑)あと、前回の記事に自分の知識の無さで修正点など多々ありますが、ここに修正点も記載して行こうかと思います。こちらの記事はWordPressを始めたばかりの初心者さん向けの記事となっております。よろしくお願いいたします。

Stinger3からStinger5へ移行

ENJIさんが開発者のSEOに非常に有利だと言われているこの「Stinger」シリーズですが、先日、(と言っても結構前ですが、、、)レスポンシブル対応となるテーマ「Stinger5」を配布しはじめました。

レスポンシブWebデザイン(Responsive Web Design)は、PC、タブレット、スマートフォンなど、あらゆるデバイスに最適化したWebサイトを、単一のHTMLで実現する制作手法です。 ブラウザーのスクリーンサイズを基準にCSSでレイアウトを調整することで、デバイスごとに専用サイトを用意することなく、マルチスクリーンに対応したWebサイトを制作できます。

Googleさんより

Stinger5になってスタイルシートの変更点も多かったので、そのまま親テーマだけ変更するということは出来ませんでした。その辺の記事も今後書いて行こうかなと模索しております。

[adsense]

最新版 Stinger5をダウンロード

まだ最新版のStinger5をダウンロードしていない方は下記のページからどうぞ!

Stinger5の子テーマを作成します

stinger5_childと名付けた新規フォルダを作成

お使いのFTPアプリケーションでテーマが入っているフォルダにアクセスします。URL/wp-content/themes/の中にStinger5が入っていますが、そこと同じ階層に新たに「stinger5_child」と名付けた新規フォルダを作成します。

WordPressテーマ「Stinger5」に子テーマを導入する方法

子テーマの中に新規でstyel.cssを作る

次に、新規でstyel.cssを作り(テキストか何かでsytleと書いたファイルを作って拡張しを.cssに変更)そして先程作った子テーマの中に入れる。

次に子テーマの中に親テーマに関する記述を記載します。下記をコピペしてお使いください。

/*
Theme Name: stinger5_child
Template: stinger5ver20141227
*/
 
@import url('../stinger5ver20141227/style.css');

注意点としては親テーマのバージョンによっては子テーマの日付も変更が必要となります。自分の場合、親テーマのバージョンは「20141227」となっているので下のTemplate: の所も「stinger5ver20141227」になっています。

WordPressテーマ「Stinger5」に子テーマを導入する方法

これでとりあえず子テーマの設置は完了です。

[adsense]

親テーマのフォルダに入っている、他のファイルはどうしたらよい?

このテーマの親子関係ですが、WordPressは子テーマに書いてあることを優先して読み込みその後足りない情報を親テーマから引っ張ってくる仕組みになっているらしいです。なので変更したいファイルがあれば親テーマからコピーして変更を加えるのが良いかもしれません。

これだけは注意「functions.php」

「functions.php」も他のファイルと同じように親テーマからコピーして使おうとするとブログが真っ白になって焦ります。自分も過去に何度かやってしまいました、、、Stinger3の時は親テーマの「functions.php」を変更して使っていましたが、先程、新規でスタイルシートを作った時と同じように「functions.php」と云うなのファイルを作って一行目に

<?php

と記述して(<は半角でお願いいたします。)その後二行目から追加の文章を記載すれば子テーマとして機能するようです。

WordPressのダッシュボードから子テーマを適用

WordPressのダッシュボードから子テーマを適用します。ダッシュボード → 外観 → テーマ → 「stinger5_child」を選択してブログを確認します。問題なく設定が出来ていれば無事Stinge5が表示されます。

最後に

いかがでしたでしょうか?今後はStinger5のカスタマイズ情報なども少しずつアップして行けたらと考えています。読んで頂いてありがとうございました。

この記事を書いた人

ディーエムガジェット 

非IT系エンジニア。日々の出来事や自分の好きな物などの紹介をメインに色々発信していきます。2012 年から禁煙を開始して68キロぐらいだった体重が2012年6月には75キロまで増加。ヤバい!と感じてダイエットを開始。一回65キロまで落としましたが、2018年8月現在また72キロまで増加。こんな身体でもトライアスロンに出場予定「プロフィールはこちら

このエントリーをはてなブックマークに追加

WORDPRESS

Posted by dmgadget