【WordPress】LION MEDIAカスタマイズ！子テーマの活用

WordPressは好きなテーマを選んで運営されていることでしょう。
しかし、WordPressのテーマもバージョンアップされます。LION MEDIAのテーマも2017年10月27日にリリースされて4ヶ月の2018年2月15日にはバージョン2.0.0になりました。
このようにWordPressのテーマがバージョンアップされると、折角、カスタマイズしていたCSS設定もやり直しになります。
親テーマがバージョンアップされても、CSSでカスタマイズした設定をそのまま引き継げるように子テーマを使います。

なんと、LION MEDIAやLION BLOGには「子テーマ」も配布されていますので、子テーマの活用方法をご紹介致します。

http://fit-jp.com/theme/theme_download/　こちらのサイトからLION MEDIAをダウンロードできます。

[adcode]

LION MEDIAの子テーマの活用

今回のように、親のテーマがバージョンアップされた場合でも、設定をそのまま引き継げるように子テーマを活用しましょう。

Mikikko

テーマがバージョンアップしたら設定がリセットされるの？

Mutakko

そうだよ。CSSでタイトルや見出しをカスタマイズしていても全てリセットされるよ

Mikikko

バージョンアップされる度に再設定するのは面倒だね〜

Mutakko

そうなのよ！だから子テーマにCSSを記述しておくと便利なんだ

今回は、LION MEDIAの子テーマを活用する方法を解説します。

子テーマをインストールする方法は、以下の記事を参考にしてください。

参考　LION MEDIAに子テーマをインストールする方法！子テーマの活用

子テーマを有効化する

　手順1：テーマ設定へ行く

WordPressのダッシュボードから

ダッシュボード　　外観　　テーマ　を選択する。

　手順2：Childを有効にする

LION MEDIAの「Child」を有効にする。有効にすると、上記のようにChildが有効になります。

子テーマを有効にすることになります。

　手順3：テーマの編集をクリック

WordPressのダッシュボードから

ダッシュボード　　外観　　テーマの編集　を選択する。

　手順4：LION MEDIA Childを選択

編集するテーマを選択から「LION MEDIA Child」を選んで「選択」をクリック。

　手順5：style.cssをクリック

LION MEDIA Childになったら、スタイルシート（ style.css）を選択する。

@charset "UTF-8";

LION MEDIAの子テーマに何も設定していなければ、上記のようにカスタマイズエリアは空白の状態と思います。

このユーザーカスタマイズエリアの下に追加していきます。

見出し２と見出し３のCSSを追加

以下のような「見出し２」と「見出し３」を設定してみます。

おしゃれな見出しを設定されたい方は、以下の見出しサンプル集をご覧ください。

参考　おしゃれな見出し用CSSデザイン集！WordPressブログにコピペするだけ！

.content h2{
padding: 0.4em 0.5em;color: #494949;
background: #c8e1fb;
border-left: solid 7px #295dd3;
border-bottom: solid 3px #6591be;
}
.content h3 {
position: relative;background: #f1f8ff;
padding: 0.25em 0.5em;border-left: solid 2em #5c9ee7;
}

LION MEDIA Childのスタイルシート（style.css）に上記のCSSを追加して下さい。（子テーマに追加です）

コピーして貼り付けるだけです。

追加したら「ファイルを更新」を行う。

参考　LION MEDIAに子テーマをインストールする方法！子テーマの活用

投稿　　新規追加　で、段落を「見出し２」「見出し３」で試してみて下さい。