心はいつもAirPucci (空元気でもいいから)

毎日がPucciを着ているような気分

WordPress子テーマの作り方

      2013/09/30


デザイン変更したairpucci、TwentyTwelveというWordPress付属のテーマ(デザイン)に”子テーマ”という方法で変更を加え、数時間で作成したのは先日お伝えしたとおりです。

初めて子テーマ作成してみました。今まで食わず嫌いでした。便利なうえにわかりやすい(メンテしやすそう)です。

作り方は簡単、わずか3ステップです。

1.WordPressのテーマが入っているディレクトリ(/wordpressのディレクトリ/wp-content/themes/ここ)に子テーマ用のフォルダを作成します。
私は 12child にしました(/wordpressのディレクトリ/wp-content/themes/12child)。

スクリーンショット 2013-07-16 21.31.28

2.作成した子テーマ用フォルダの中に、style.cssという名のファイルを作成します。作成したstyle.cssの中身は以下のように記述します。

/*
Theme Name: 子テーマのお名前をお好きにどうぞ
Template: twentytwelve
Author: あなたのおなまえを書くとか
Description: 子テーマの説明をお好きにどうぞ
Version: おすきなバージョンを数字で
*/

@import url('../twentytwelve/style.css');

この続きに、TwentyTwelveから変更したいcssを記述します。変更がなければ以上で終了。

3.変更したいデザインがあるphpファイルをtwentytwelveから、子テーマ用のフォルダにコピーします。コピーしたファイルを好きなデザインにエディットします。ファイル全部コピーする必要はなく、変更かけたいものだけでいいので、自分がカスタマイズした部分がわかりやすくなります。
スクリーンショット 2013-07-16 21.49.03

私は、comments.phpとsidebar.phpを変更しました。どちらもバナーを設置しただけです。
それ以外のファイルは親テーマであるtwentytwelveのを読み込んでくれます。

以上、終了。
文字の色変更は、コンパネの”外観”から変更できます。

あー簡単だった。スクラッチでwordpressのテーマ作るの、もう面倒なので、子テーマはおおいにありだと思いました。

追記。
WordPress親テーマversion upに伴う、子テーマのバージョンアップ作業ってのも書きました。

 - テクニカル ,

Comment

  1. […] WordPress子テーマの作り方で書いた通り、airpucciの現在のテーマは、TwetyTwelveの子テーマとして作っています(とはいってもバナー設置しただけ)。 […]

  2. […] 僕が参考にしたのはこれらのサイトですρ(^^ )ノ ⇒心はいつもAirPucci (空元気でもいいから)  アフィリエイト作業ノート ゆとり世代のブログ運営論 […]

Message

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

  関連記事

BD再生のオープンソース

メディアはシリコンすら持ちたくない主義なのですが、どうしてもBluelay Di …

no image
Ruby 1.9系をインストールする

Rubyのバージョン管理ができるrbenvをインストールしたらいよいよRubyの …

パーフェクトRuby 2章Rubyの基礎 2-3 条件分岐と真偽値

p50 2-3 条件分岐と真偽値 falseとnil以外は全部true p51 …

no image
RailsTutorial4.0を高速で復習する。4.2章。

4.2文字列(string)とメソッド、です。 ここからはrubyの文法について …

パーフェクトRuby 3章制御構造/メソッド/組み込み関数 3-2 基本的な制御構造

p75 3-2 基本的な制御構造 条件分岐、繰り返し、ジャンプ構文について 3- …

no image
MavericksアップデートしRuby2.0+Rails4.0.2にversion upする

何を今さら感ですが、MacはAirとMiniの2台持ちです。Airのほうを人柱と …

詳解 Objective-C 2.0 第3版 CHAPTER3 継承とクラス

[]多用といいメッセージキーワードといい、やっぱObjective-Cってキモチ …

Provisioning fileが作成できない!

iPhoneアプリを公開するために、itunes connectでProvisi …

MacBookAirの容量が足りない

当ブログairpucciで人気なのがMacBookAirに関するエントリ。ありが …

no image
RailsGirlsMore!でRailsTutorialのキモチワルイところがスッキリしました

RailsGirls松江からのぉ〜東京More!*既に2回目から1ヶ月半。またま …