【wordpress】colormagのカスタマイズ

colormag

ワードプレスのメディア型テンプレートとして人気のあるcolormagについてのカスタマイズを備忘録として残しておきます。

子テーマを作っておくことをおすすめします。

子テーマを作る

これはcolormagに限ったことではないですが、子テーマに最低必要な、スタイルシートのファイル:style.cssと関数ファイル:function.phpをまず作ります。

まず、colormag-childという名前で自分のパソコンにフォルダを作っておきます。

テキストエディターで、下記の内容を打ち込み、style.css という名前で上記のフォルダに保存します。文字コードはUTF-8にします。

/*
Theme Name: colormag-child
Template: colormag
*/
@import url('../colormag/style.css');

同様に、下記の内容をfunction.php という名前で上記のフォルダに保存します。


2つのファイルが入ったフォルダをZIP形式で圧縮して、colormag-child.zip という名前のファイルを作ります。(このファイル名は任意)

ワードプレスの、外観⇒テーマ⇒新規追加 で、作成したcolormag-child.zipをアップロードして、インストールし有効化すれば子テーマが適用されます。

CSSファイルのカスタマイズ

上記で有効にした、子テーマのスタイルシートを編集していきましょう。

ワードプレスの外観⇒テーマの編集 で開かれる画面で、style.cssが表示されていて、編集するテーマがcolormag-childになっていることを確認してから作業します。

フォントの変更、見出し(h2,h3・・・)などのカスタマイズは他のテンプレートと同様ですので、お好みの内容を記述してください。
ここではどうしても変更が必要な、記事中の画像表示について追加します。
デフォルトでは、記事の最上部にサムネイル画像が表示されてしまい、カスタマイズでも非表示にする方法が見当たりませんでした。

この方法は、下記の記述を追加することで可能です。

.single .featured-image {
display: none;
}

フッターのコピーライトを消す

デフォルトでは、
Copyright © 2016 サイト名. All rights reserved.
Theme: ColorMag by ThemeGrill. Powered by WordPress.

と表示されます。テーマ名の表示はかっこわるいのでサクッと消してしまいましょう。

削除するには、fotter.phpの

の部分を

のように変更することで実現できます。(改行しない場合は1行で書いてください)
ブログ名は自動で入り、年号も自動で更新されます。

この他にカスタマイズした内容は順次追加していきます。

コメント