AT HOME GEEK

sponsored link

ライトにカスタマイズする方にオススメなWordPress子テーマの作り方

time 2016/07/07

ライトにカスタマイズする方にオススメなWordPress子テーマの作り方
この記事の所要時間: 57

WordPressをカスタマイズするときに直接テーマファイルを編集してしまうと、もしコードがひとつでも間違えていただけで真っ白な画面とご対面。

その後、どこが原因なのかを探すのにも大変で、復旧するまで結構時間かかったりと何かとめんどくさい。

じゃぁバックアップを取ったり、テスト環境を作ったらええやんといろいろ言いたいと思いますが、HTMLやCSSの知識がなくそこまでがっつりカスタマイズしないライトな層にはそこまでの環境は求めていないはず。

そんなときに役に立つのが「子テーマ

あなたがHTMLやCSSは苦手だけど、ちょっとだけカスタマイズしたいなと思っているならば必ず導入しておくべきもののひとつですよ。

sponsored link

子テーマを作成するメリットとは

子テーマとは、かんたんにいうとこんな感じです。かならず親テーマとセットで使用します。

・親テーマ:いわゆるテーマ(Wordpress公式のTwenty Sixteenとか)

・子テーマ:親テーマの機能とスタイルを継承したテーマ。カスタマイズ専用

また子テーマを使用するメリットとしては、以下があげられます。

・テーマを直接変更した場合、そのテーマがアップデートされると変更が失われるかもしれません。

・子テーマを使用すればテーマの変更は確実に保持されます。 子テーマを使用することで開発時間を短縮できます。

・子テーマの使用することでWordPressのテーマの開発を良い形で学べます。

子テーマ – WordPress Codex 日本語版

子テーマを使用して1番ええなと思うのは、親テーマがアップデートしてもカスタマイズした内容はそのまま引き継がれるってことです。これが1番重要。

たとえばがっつり親テーマをいじったとしてもアップデートしてしまったら、またイチからコーディングしていかないといけません。それはほんまにめんどくさい。

そういうのを防ぐために、子テーマが存在しているんです。

初心者でもできる!子テーマの作成方法

子テーマを作る流れはざっとこんな感じ。

  1. 子テーマ用のフォルダを作る
  2. フォルダに収納する「style.css」と「function.php」を作成する
  3. 子テーマフォルダをサーバーにアップロードする

では、まずは子テーマ用のフォルダを作りましょう。

子テーマ用のフォルダを作る

フォルダを作って、名前を付けます。ただそれだけです。
160706-1

僕は、「JustWrite」というテーマを使っているので、子テーマの名前は「JustWrite child」にしました。フォルダの名前はなんでもいいので、好きに付けてください。

フォルダに収納するふたつのファイルを作成する

今回は、ここが山場といえるくらい重要です。

まずは、「style.css」から作成していきましょう。

「style.css」の作り方

テキストエディタ(Windowsmならメモ帳、Macならメモなど)を開いて、下記のコードを記入します。

Wordpresの公式オンラインマニュアルの「WordPress Codex」の子テーマのページでは、上記コード以外にも、DescriptionとかLicenseとかいろいろ記入しないといけないみたいなんですけど、ふたつの項目さえあれば子テーマとしては十分なので今回はこれだけ記入しておきます。

ちなみに今回の場合は、

  • Theme Name = 子テーマフォルダ名(今回は、JustWrite Child)
  • Template = 親テーマフォルダ名(今回は、justwrite)

もちろん大文字、小文字やスペースなども完全一致しないと作動しません。僕がやったときは、フォルダ名が一致していなくうまく動かず、ちょっとつまづきました。

「function.php」の作り方

同じくテキストエディタ(Windowsmならメモ帳、Macならメモなど)を開いて、下記のコードを記入します。こっちはそのままコピペでOKですよ。

上記ふたつのファイルを先ほど作成した子テーマフォルダに保存します。
160706-2

子テーマフォルダをサーバーにアップロードする

最後に、小テーマフォルダをサーバーにアップロードします。

ブラウザから、お使いのサーバーにアクセスしてもいいですけど、アヒルでお馴染みのFTPクライアントソフト「Cyberduck」を使って、アップロードするのがオススメです!

アップロードする場所は、wp-content/themesです。
160706-3

ちなみに「Cyberduck」ですが、Macの場合、App Storeからもダウンロード出来ますが、2,900円と少し高価な部類に入るアプリです。

ただし、公式ウェブサイトからダウンロードすると、なんと無料でダウンロードできちゃうというカラクリが!

ダウンロードはこちらからできますのでお好みの方法でどうぞ!

参考 Cyberduckを公式ウェブサイトよりダウンロードする(Mac、Windowsともに可。しかも無料) 
参考 CyberduckをApp Storeからダウンロードする(Macのみ) 

Cyberduck

2,900円
(2016.07.06時点)

App Store

posted with ポチレバ

あとは子テーマを有効化するだけです。

これで子テーマを作って、カスタマイズできる環境が整いましたね。

今後、長期でウェブサイト運営していく上でぜったい必要になってくると思うので、もしあなたが使っているテーマに子テーマが付属していなければ、この方法で作ってみてください。

ではまた!

この記事が気に入ったら
いいね!しよう

Twitter で

sponsored link

次回の記事はおそらく 鹿児島旅行記「特急 指宿のたまて箱」 になるでしょう。
更新を逃さない!便利なRSS登録はこちらから

・アットホームギークBASEショップ出来ました!
その他音源レビューやオモロイことなら何でもやりまっせ!


まだ日本で消耗してるの?海外に出てのびのび自由に生活しません?

・【2015年度完全版】ワーキングホリデービザで滞在できる国まとめ
・ワーホリ・留学準備で誰しもが絶対悩むお金の持っていき方について
・32歳でもワーキングホリデー行けるってホント?オーストラリア行ってきます! ・英語でシェアハウスの探し方シチュエーション別まとめ


ワーホリ後も安心!帰国してからはこのサービスを使おう!

・ワーホリ後の転職のときに大活躍するサービスまとめ
・わがままでも自分勝手でも自分に合った求人を紹介してくれる転職サイト


旅行のお供にいかがですか?GoPro記事まとめ

・GoProを購入したら最初にやるべきWiFi名とパスワードの設定方法
・GoProアクセサリーレビュー記事まとめ


down

コメントする




sponsored link

ABOUT

マツモトユウキ

マツモトユウキ


「私が気になることは世界の誰かが気になること」をモットーに、記事書いています。
Apple、ガジェット、Webサービス、肉の中だったら鳥が好き。 ガジェットやWebサービスなどのレビュー書きます。 お仕事の依頼はこちらから→レビュー承ります!

2014年:カナダへ留学
2015年:オーストラリアへ留学
2016年:帰国して東京にいます。
そして、レーベルのしゃっちょさんになりました。グッズなどここから買えます!
AHGRオンラインショップ

もうひとつウェブサイト作りました!海外パンクロック紹介中!
AT HOME GEEK Records

その他、詳しいプロフィールはこちら [詳細]

ツイートもチェック!