本ブログを始めるにあたって、WordPressのテーマには無料のCocoonテーマを使わせて頂いております。
Cocoonはわいひらさんという方が作成・更新しているテーマで、無料なのに超高機能かつSEO対策やレスポンシブ対応なども施された使いやすいWordPressのテーマです。
記事作成に力を注ぎたい為に、ガチガチに細かく設定を変えたり、CSSやPHPのコードを書くことはしたくないと考えており、Cocoonであればデフォルトの設定やデザインのままでもかなり有能です。
ただ、どうしても最低限弄らなければいけない部分はあります。
ここでは、自分の備忘も兼ねて、最小限やっておいたCocoonの設定や、デザインのカスタマイズを残しておきます。
今回は第一回ということで、Cocoonテーマ導入後最初にやっておいた最小限の「Cocoon設定」です。
～ 目次 ～
はじめに
この記事が役に立つのは、以下のような方かと思います。
・WordPressのテーマは無料テーマしか使ったことが無い
・Cocoonテーマを初めて使う
・設定項目が多すぎて最初に何をやっておけばいいか分からない
・そもそもWordPressの利用経験が浅い
さて、Cocoonテーマを導入したり、WordPressの管理画面上に「Cocoon設定」という項目が追加されます。
ここで様々なテーマの設定が出来るのですが、「Cocoon設定」の中には、以下のように多くの設定項目があります。
細かく設定できて便利ですが、機能が多すぎてどこから弄ったらいいのか分からなくなります。
また、デフォルトである程度最適化された設定をされているようなので、初期設定のままで十分な部分が多いです。
そこでここでは、細かいカスタマイズやデザインは後回しで、まずは最低限度これをやっておこうという、ほぼ必須の設定だけここでは書いておきます。
スキンを選ぶ
「スキン」タブから、スキンを選びましょう。
Cocoonテーマというのは、一つのデザインだけが提供されているのではなく、「スキン」を切り替えることで見た目を気軽に変えられます。
スキン一覧の隣の画像アイコンにマウスをホバーさせると、見た目のイメージが表示されるので、好きなデザインを選びましょう。
スキンは気軽に変えられるのですが、あとからCSSを弄ってデザインをカスタマイズした場合、その時点で適用しているスキン以外だと表示崩れが起こってしまうことはありますので、最初にちゃんと吟味して決めておいた方が良いと思います。
「全体」からフォント関係を指定
「全体」タブで、サイトのベースとなるフォントやキーカラーなどを設定できます。
どうもスキンを選択すると、スキンで設定されているものが優先されるようなので、あまり細かくここで弄っても適用範囲がどこまでなのかよく分かりません。
なので、よほどこだわりがある場合以外は基本的にはデフォルト設定で良いのではないかと思います。
わたしは２か所だけ変えています。
フォントは「メイリオ, ヒラギノ角ゴ」に。
サイトアイコンフォントを、「Font Awesome5」に変えてます。
サイトアイコンフォントは、デフォルトでFont Awesome4が選ばれているのですが、今後デザインのカスタマイズなど必要な時に備えて新しいバージョンを使う設定にしています。
「ヘッダー」の設定
「ヘッダー」タブから、ヘッダー部分の表示のカスタマイズを行えます。
ここもスキンを変えるとそちらに制御が優先されてしまう項目が多いのもあり、デフォルトでそれほど困らないかと思います。
わたしはヘッダー部分の背景画像だけ、ここで設定しました。
他に、ヘッダーに表示するロゴを画像にしたい場合などはここから設定しておきましょう。
（ここは設定を後まわしにしても、必要になった時に修正して問題ないかと思います）
本文中の画像に枠線を付けるように設定
「画像」タブで、画像に関する様々な設定が出来ます。
アイキャッチ画像上のカテゴリラベルの表示や、キャプション設定時の表示非表示切り替えなどが出来ますが、この辺は後から変えても手遅れになるような部分ではないと思うので、とりあえずはデフォルトで良いのではないかと思います。
ただ、記事中に画像を挿入した際の枠線だけは、すべての画像に付けるように設定しておきましょう。
「画像の囲み効果」はデフォルトで「なし」になっていますが、「ボーダー」や「シャドー」などに変えておきます。
枠線をつけておかないと、画像によっては背景と同化してしまいし、画像なのか文字なのか分かりづらくなってしまうケースがあります。
「SEO」の設定を最適なものに
SEO対策は早めにやっておきたいものです。
昔よりはSEO対策として本当に細かい部分をテクニカルな対応をすることでごまかす意味が無くなってきていて、それよりも優良な記事を書くことが優先されるべきだと思います。
また、Cocoonは初期の状態でかなりSEO的な施策は施されているようなので、あまりセンシティブにならなくて良いのかな、と。
ただ、「カテゴリ」ページや「タグ」ページをnoindexにするかどうか、といった論争はあるようですし、こだわりがある場合にはおまじない的な意味でも自分好みに設定をカスタマイズしておきましょう。
わたしは、カテゴリページはnoindexにしないようにしてあります。
SNSとの連携ボタン表示設定
最後に、SNS関係のボタン表示の設定を「SNSシェア」タブからしておきます。
ブログを人に見てもらうためにはSNSの利用は重要です。
表示したいボタンの切り替えや、ちょっとしたデザインの変更はここで出来るので、好みのデザインにしておきます。
また、このタブの下部には、Twitter連携時にデフォルトで付与されるハッシュタグの設定なども出来るようになっています。
設定項目はそれほど多くないので、自分に必要そうかだけ一通り見ておくとよいと思います。
まとめ
いかがでしたでしょうか。
ここでは、「Cocoon」設定内の、本当に最初期にやっておくべき最低限の設定をまとめておきました。
こだわりだすと色々と弄りたくなりますが、後から必要に応じて設定すればよい項目が多いと思います。
Cocoonはデフォルト設定でも十分実用性のあるテーマ設計がされているので、サイトの根幹や、SEO／集客関連、記事本文内の重要な見た目上の設定だけ変更すればOKです。
コメント