【Cocoonカスタマイズ】CSSの編集を管理画面上で行なう

Cocoonカスタマイズ
スポンサーリンク

WordPressでブログを作ろう日記にて、WordPressでブログを作ろう!というのをやりました。

ブログを作ろう日記
「ブログを作ろう日記」の記事一覧です。

無料WordPressテーマ「Cocoon」のおかげで、特に難しい設定をすることもなくちゃんと記事が書ける状態にはなります。

特に問題はないのですが、そのうちちょっと思い始めちゃうんです。ここんとこ、もうちょっとこうがいいなぁ…とか。
別に書く分には問題ないし、見る分にも問題ないし、そここだわるより中身にこだわれ!ってのも分かるんですが、結局やっぱり好きで書くならよりデザインも好きな感じに近付けたいじゃないですか。お仕事でプロブロガーを目指す人なら違うんでしょうけど、そもそもそういう人はわたしのブログなんか見てないと思うし。

なので、ちょっとブログのデザインをいじっちゃおう!という、そういうのをやっていきたいと思います。

ぱぷれさん
ぱぷれさん
意外とブログ書く上で「デザインが気に入ってる」って大きいと思うの。
続くかどうかのモチベーション的に。

はじめに

テーマをカスタマイズするには、テーマの骨組み自体をカスタマイズする方法と、テーマの装飾をカスタマイズする方法とあります。
今回は、テーマの装飾をカスタマイズする方法でいろいろとご紹介していきます。

テーマの骨組み自体をカスタマイズするには、多くの知識が必要になります。
WordPressのテーマが何がどうなってるのか理解していないと、カスタマイズしようとしても上手くいかないどころかテーマ自体が崩壊しかねません。

テーマの装飾をカスタマイズする方法は、CSSのみをカスタマイズします。
CSSの基本を分かっていると結構自在にカスタマイズ出来るようになりますので、CSSはちょっとずつでも覚えてって損はないと思います♪

ぱぷれさん
ぱぷれさん
サルワカさんの解説記事が、分かりやすいと思うー。
初心者向けCSS(スタイルシート)入門:基本的な書き方を総まとめ!
初心者でも理解できるよう0からCSSについて解説します。CSSとは何か?からCSSの書き方まで丁寧に図解していきます。

CSSの編集を管理画面上で行なう方法

Cocoonの子テーマの確認

まずは、CSSの編集ってどうやるの?ってところからですが、その前にひとつ確認しておきましょう。
Cocoonのテーマは、親テーマと子テーマとあります。編集するのであれば子テーマでなければなりません。

最初のインストール時点で子テーマが手順にも明記されていますし推奨もされていますので、たぶん子テーマにはなっているかと思うのですが、念の為確認しておきましょう。親テーマを編集してしまうと、テーマのアップデートなどで変更がクリアされ、初期化されてしまう可能性があります。

外観→テーマを選択して、テーマの管理画面を開きます。

有効になっているのがCocoon Childであることを確認してください。
もし、Cocoonの親テーマになっている場合は子テーマに切り替えなければなりませんが、今までの設定もパァになります。その場合は、一旦Cocoonの設定をバックアップして、子テーマに切り替えたあと、子テーマの方でリストアするようにしましょう。

テーマ設定のバックアップ方法
「Cocoon設定」にあるテーマ設定をテキストファイルに書き出してバックアップする方法の紹介です。
ぱぷれさん
ぱぷれさん
何から何まで親切だよね…Cocoonって。

CSS編集画面を開く

子テーマであることを確認したら、CSSの編集をしましょう。

ぱぷれさん
ぱぷれさん
スキンをどうしようか迷いましたが、まぁいいやで進めます。←

外観メニューの中に「CSSの編集」という項目があります。
ここからCSSの編集が出来ます。

開いてみると、こんな感じ。
追加CSSのどーたらこーたら書いてある文言の下にあるスペースにCSSを書き込むと、その設定が反映されてデザインが変更されます。

とりあえずやってみよう

とりあえず、試してみましょう。

ぱぷれさん
ぱぷれさん
習うより慣れろ。百聞は一見にしかず。

デフォルトリンクのカラーを変更する

デフォルトの文字リンクの色を変更してみましょう。

初期設定だと、文字リンクの色はこんな感じです。

これを変更するために、CSSの入力欄にコードを入力します。

入力して公開ボタンを押し、ブログを再読み込みすると色が変わっているのが確認できます。

リンクカラーに関してはCocoonの設定から色を指定する形で実際は出来ますが、設定項目にはない、それだけでは上手くいかない箇所に関してもこうやってカスタマイズしていくことが出来ます。

まとめ

ブログのデザインは、徐々に自分のやりたいことに合わせてカスタマイズしていくといいと思います。
最初っから理想の形を決め打ちしちゃうよりは、少しずつ「こっちの方がいいかなー?」「もうちょっとこうしたいなー」を重ねていった方が、最終的には自分が気に入るブログになると思いますので。

もちろん、読んでくださる人の立場になって考えるのも大事だとは思うのですが、結局日々長文を書くなんて好きじゃなきゃやれないんですよ。

勉強するとき、お気に入りのノートにお気に入りのシャーペンだと、とりあえずやる気は出るじゃないですか。そんなかんじ。

ぱぷれさん
ぱぷれさん
集中出来るかとか、結果が出るかとかに関しては、たぶん別枠の問題だとは思ってるけども。

コメント

タイトルとURLをコピーしました