クリエイティブライフハック

ストックフォト写真販売で副業収入を得るクリエイティブライフハック。写真とオンラインメディア(インスタグラム、WordPressブログ、ハンドメイドマーケット)の話。

WordPressでブログ集客する方法

WordPressを子テーマでカスタマイズする方法。

投稿日:2014/05/08 更新日:

WordPress デフォルトテーマ Twenty Fourteen の子テーマを作る。

WordPress のテーマに変更を加えようと思った時どうしてます?
直接テーマを触ってしまいます?

テーマがアップデートされた時にまた同じ修正を加えなければならなくて困ったことはありませんか?
どこをどう修正したか覚えてなくて困ったことはありませんか?

スポンサーリンク

テーマを直接修正するのではなく、子テーマを作ってそちらを修正したり追記することで、アップデートしても再修正しなくて済みます。

今回は、WordPressのデフォルト公式テーマ「Twenty Fourteen」のcssを子テーマで変える方法で解説していきます。
もちろん、他のテーマを使ってる人も同じようにすれば、子テーマを作ることができます。

Home画面。

Twenty Fourteen HOME画面

何か気付きませんか?
英文字が何カ所か大文字になってるんです。

これはデフォルトのテーマ Twenty Fourteen の CSS でそうなってるからなんです。

これを解除するためにはテーマファイルのスタイルシートを少し修正することになります。

但し、Twenty Fourteen を直接修正してしまうと Twenty Fourteen がアップグレードしたときに、また同じ修正をしなければならなくなります。
それは面倒であるし、ミスも起こりやすい。

ということで、WordPress は子テーマでのカスタマイズを推奨しているようです。

子テーマの作り方は、WordPress Codex 日本語版(子テーマ)にも書かれていますし、難しいことはありません。

子テーマの作り方

Twenty Fourteen と同じディレクトリに任意の名前で新しくフォルダを作ります。(例:kid)
その中に子テーマ用のスタイルシート style.css を作成します。
子テーマに最低限必要なのは、このフォルダ1つとファイル1つだけです。

/wp-content/themes/kid/style.css

style.css の書き方のルール

  1. Theme Name (必須) 子テーマ名
  2. Theme URI (任意) 子テーマのウェブページ
  3. Description (任意) テーマの説明。例: わたしの最初の子テーマ。
  4. Author URI (任意) 作者のウェブページ
  5. Author (任意) 作者の名前
  6. Template (必須) 親テーマのディレクトリ名, 大文字小文字を区別します
  7. Version (任意) 子テーマのバージョン。例: 0.1, 1.0, etc

これだけの要素が必要になります。

参考までに style.css の書き出しを載せておきますので参考にしてください。

@charset "UTF-8";
/*
Theme Name:     tf-photo
Theme URI:      http: //hatamoto.biz/photo/
Description:    写真を編むのための Twenty Fourteen 子テーマ
Author:         aoneko
Author URI:     http: //hatamoto.biz
Template:       twentyfourteen
Version:        1.0
*/

@import url("../twentyfourteen/style.css");

この後にスタイルを追加修正していきます。

英文字の大文字を解除するスタイル

Twenty Fourteen の style.css を検索してみると
text-transform: uppercase;
がたくさん見つかります。
それを text-transform:none;
にしたものを子テーマの style.css に追加します。

Twenty Fourteen の style.css を修正するのではなく、
子テーマの style.css に追加します。

管理画面>外観>テーマ
を開くと Twenty Fourteen の右横に子テーマができています。
子テーマを有効化すると適用されます。

英文字の大文字が解除されました

英文字の大文字が解除されました。

今日も元気に楽しく♪

 

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

最新情報をお届けします

Twitter で畑本伸一|CreativeLifeHackをフォローしよう!

-WordPressでブログ集客する方法
-, ,

運営者プロフィール

畑本伸一

icon-maleSINTO Hatamoto (畑本伸一)
1969年 大阪市生まれ 京都市在住。
写真作家、ストックフォトクリエイター、ハンドメイド作家向け販促ツール制作販売、ハンドメイド作家向けの写真&オンラインメディア活用アドバイザー、セミナー講師。
1990年代:グラフィックデザイナー。新聞・雑誌の広告デザイン制作。写真を活かしたデザインを得意とし新聞広告、TVCM、ポスター各部門で広告賞金賞。「SINTO」という名前で写真・オブジェ・インスタレーションなど作家活動開始。2000年代:Webサイト制作の個人事業開始、グラフィック社発行「Web年鑑」掲載。2010年代:海外で流行の写真SNS「ピンタレスト」にいち早く関心を持ち“写真の今”を研究。「Pinterestビジネス講座(翔泳社出版)」共著。
icon-arrow-circle-right 詳しいプロフィール

共著

Facebookページ「Creative Life Hack」TwitterGoogle+ページ「自分メディアの育て方」instagramPinterestFeedly RSS

Copyright© クリエイティブライフハック , 2017 AllRights Reserved.