無料でありながら多機能な”WordPress”のテーマ”Cocoon”はホームページにマニュアルがあり、使っている人たちの相談に乗るなど、フォーラムがあります。
“WordPress”そのものも知らなかった私がサイトを立ち上げられたのも、このマニュアルとフォーラムのおかげです。最初に立ち上げたサイトが、20記事程度の投稿で”Google AdSense”の審査に1回で通過したのもテーマが優秀である事を物語っています。
テーマ”Cocoon”ホームページ↓↓
ホームページから「マニュアル」をクリックすると、サイト作成準備を初め詳細な設定が記載されているので、読むだけでも知識が深まります。
初期設定
テーマ”Cocoon”は自由度が高く高機能です。使う用途によって思い通りのサイトが作れます。また、これは使う人によって設定も違ってくることでもあり、万人受けの設定はありません。
今回、私好みの設定を紹介しますが、初期設定だけでサイトが完成しない事を念頭に参考にして下さい。サイトは育てるもので進化に終わりはありません。
設定の基本
管理画面から「Cocoon設定」を選択すると下の画面が表示されます。赤枠の部分がそれぞれの設定になります。
赤枠の中から目的の「タブ」を選択して、表示される設定画面で設定し、最後に「変更をまとめて保存」をクリックすることで設定が完了します。
スキン設定
「Cocoon設定」スキン設定を選択すると下図(左)が表示され、写真のアイコンの上にホバーするとプレビュー下図(右)が表示されます。
「コクーン設定」のスキンではあらかじめ数種類のスキンが用意されていて、何れかを選択して保存するだけで概ねの初期設定は完了するので、すぐに記事を書き進める事が出来ます。
私は、自分の好みで作りたいので「なし」を選択します。
全体設定
全体設定では、サイト全体の色と配置を設定します。
今回設定するのは、「サイトフォント」と「サイドバー」だけで、その他はデフォルトのままにします。
サイトフォント
2017年より「Google Chrome」のフォントが「メイリオ」に変更されています。そしてGoogleが提唱しているフォントサイズは16pxです。
これらを踏まえ、デフォルトの「游ゴシック体、ヒラギノ角ゴ」のままにしておきます。
フォントサイズ
デフォルトでは、PC・タブレットでは18px、モバイルでは16pxになっています。これをGoogleが提唱するサイズに合わせます。
変更が出来たら、「変更をまとめて保存」をクリックします。
サイドバー
「サイドバー」の設定は、サイドバーを表示位置(メインカラムの右か左)と、サイドバーを表示するページを指定できます。
サイバーが左側に設置しているサイトは余り見かけないので、違和感のないように右側に設置した方が無難です。
「プロフィール」や「お問い合わせ」などの固定ページに「サイドバー」は表示させない方がスッキリとするので、固定ページで非表示に設定します。
ヘッダー設定
ヘッダー設定では、サイトのヘッダー部分を設定します。
今回設定するのは、ヘッダーとグローバルナビの背景色、及びキャッチフレーズの配置です。
ヘッダーの詳細な設定は【“Cocoon”ヘッダーのタイトルをカスタマイズ】で解説しています。
ヘッダーとグローバルナビの背景色
ヘッダーとグローバルナビは上下に並んで配置されているので、同色にするために「ヘッダー全体色」の色を「#ddaa5d」にしました。
キャッチフレーズの配置
初期設定の一般設定の際に、SEO上好ましくない事からキャッチフレーズの欄を空白にしているので、ここでの設定は意味がないのですが、「表示しない」にしました。
SEO設定
headタグ設定では、HTMLコード上のheadタグの中に追加するlinkタグを設定します。
ここでは、投稿記事ではない「カテゴリー」「タグ」「アーカイブ」「添付ファイルページ」をインデックス(検索エンジン)に認識させるか、させないかを設定します。
デフォルトで問題はなさそうですが「カテゴリー」と「タグ」をインデックスさせる事には、それぞれ意見が分かれているようです。
私は下記の設定にします。
インデックス設定
インデックス設定は、前回の記事【ホームページを作成する】で設定済みです。
投稿設定・固定ページ設定
投稿ページ設定では、「関連記事」と「ページナビ」を設定します。
「コメント」と「パンくずリスト」は投稿ページと固定ページの両方に設定するところがあります。
関連記事
「関連記事」を「投稿記事」の下に表示させたいので、以下の表示設定を行います。
ページナビ
続きに読んでもらいたい記事は独自に設定したいので、ページ送りナビを非表示にします。
「コメント」と「パンくずリスト」
「投稿ページ」と「固定ページ」のコメントは非表示にします。
「パンくずリスト」はSEO対策とサイトマップに重要な役割を果たすので「メインカラムのボトム」(デフォルト)にしておきます。なお、記事タイトルは「パンくずリスト」に含めません。
目次設定
目次設定は「個別ページ」の作成画面で表示と非表示の切り替えができるので、すべて表示できる設定にしておきます。
その他はデフォルトのままで、今後の様子を見ながら変更します。
画像設定
画像設定では、「アイキャッチ」を投稿・固定ページの先頭に表示する設定と、「サムネイル画像」の表示設定及び「Retinaディスプレイ」の対応を設定します。
ブログカード設定
ブログカード設定では「内部ブログカード」と「外部ブログカード」の表示を設定します。
グログカードは「内部」と「外部」の両方とも表示するに設定しますが、「外部ブログカード」は新しいタブで開くように設定します。
内部ブログカード
外部ブログカード