ヘッダー、サイドバーの変更をしてきましたが、今回は私がその他に気になった箇所をカスタマイズしていきたいと思います。
1.サイトアイコンの変更
2.ホームイメージの変更
3.関連記事の変更
4.ページ送りナビ設定の変更
5.フッターの変更
以上の3点の変更を行いましたので、そちらをご紹介させていただきたいと思います。
サイトアイコンの変更
まずはアイコン画像を用意しましょう。何でも大丈夫です!
変更しない場合はテーマで設定されているアイコンがそのまま表示されるので注意してください。
![](https://i0.wp.com/kmnmc.com/wp-content/uploads/2022/01/ep09_05.png?resize=1024%2C344&ssl=1)
ダッシュボードの外観 > カスタマイズをクリック。
![](https://i0.wp.com/kmnmc.com/wp-content/uploads/2022/01/ep09_02.jpg?resize=1024%2C351&ssl=1)
サイドメニューより「サイト基本情報」をクリックし、「サイトアイコンを選択」をクリックし用意したアイコン画像を選択します。
![](https://i0.wp.com/kmnmc.com/wp-content/uploads/2022/01/ep09_03.jpg?resize=300%2C587&ssl=1)
![](https://i0.wp.com/kmnmc.com/wp-content/uploads/2022/01/ep09_04.jpg?resize=300%2C587&ssl=1)
![](https://i0.wp.com/kmnmc.com/wp-content/uploads/2022/01/ep09_06.jpg?resize=300%2C587&ssl=1)
![](https://i0.wp.com/kmnmc.com/wp-content/uploads/2022/01/ep09_07.png?resize=1024%2C36&ssl=1)
アイコン選択後、プレビューが表示されるので、問題なければ「公開」をクリックして作業終了になります。
ホームイメージの変更
Cocoonはデフォルトで画像が入っておりますので、こちらもサイトアイコン同様に公開前に好きな画像や自分のサイトとわかるような画像(スクリーンショット)などを用意し変更しましょう。
![](https://i0.wp.com/kmnmc.com/wp-content/uploads/2022/01/screenshot-1.jpg?resize=300%2C225&ssl=1)
ホームイメージ
ダッシュボード > Cocoon設定 > (タブ)OGP をクリック
![](https://i0.wp.com/kmnmc.com/wp-content/uploads/2022/01/ep09_08.jpg?resize=1024%2C248&ssl=1)
下の「ホームイメージ」までスクロールし、画像のアップロードの「選択」をクリックし用意した画像を選択(またはアップロード)
![](https://i0.wp.com/kmnmc.com/wp-content/uploads/2022/01/ep09_09.jpg?resize=1024%2C465&ssl=1)
ホームイメージを選択後に画面下の「変更をまとめて保存」をクリックすれば作業完了になります。
![](https://i0.wp.com/kmnmc.com/wp-content/uploads/2022/01/ep09_10.jpg?resize=1024%2C517&ssl=1)
ホームイメージとは、TwitterやFacebookでトップページを共有した際に表示されるサムネイル画像の事です。
関連記事の変更
投稿記事の下にある関連記事なんですが、私個人としましては4つくらいあれば十分かな?と思ったので今回は掲載数を減らしたので、そちらの紹介になります。
![](https://i0.wp.com/kmnmc.com/wp-content/uploads/2022/01/ep09_15.jpg?resize=1024%2C1000&ssl=1)
ダッシュボード Cocoon設定 > 投稿
![](https://i0.wp.com/kmnmc.com/wp-content/uploads/2022/01/ep09_14.jpg?resize=1024%2C432&ssl=1)
「関連記事設定」の「表示数」を6から4へ変更し保存すると変更した表示数で掲載されるようになります。
![](https://i0.wp.com/kmnmc.com/wp-content/uploads/2022/01/ep09_16.jpg?resize=774%2C1280&ssl=1)
関連記事はデフォルトでは「カテゴリー」の設定になっております。タグでの関連付けをしたい場合は「関連性」をカテゴリーからタグへ変更してください。
ページ送りナビ設定の変更
![](https://i0.wp.com/kmnmc.com/wp-content/uploads/2022/01/ep09_17.jpg?resize=900%2C205&ssl=1)
ページ下部に掲載されている、次の記事や前の記事を紹介しているページ送りですが、こちらも少し野暮ったく感じたので、少しカスタマイズしてみました。
先程紹介した関連記事設定と同じタブになるので、気になった方はまとめて作業してもOKです!
ダッシュボード Cocoon設定 > 投稿
![](https://i0.wp.com/kmnmc.com/wp-content/uploads/2022/01/ep09_14.jpg?resize=1024%2C432&ssl=1)
「ページ送りナビ設定」までスクロール。
![](https://i0.wp.com/kmnmc.com/wp-content/uploads/2022/01/ep09_18.jpg?resize=912%2C1024&ssl=1)
たくさんありますが、今回私が設定したのは「表示タイプ」をデフォルトからサムネイル正方形に変更したのみでございます。
![](https://i0.wp.com/kmnmc.com/wp-content/uploads/2022/01/ep09_19.jpg?resize=1024%2C101&ssl=1)
こちらを変更すると、デフォルトの時は2行だったページ送りが1行になりスッキリした印象になります。
![](https://i0.wp.com/kmnmc.com/wp-content/uploads/2022/01/ep09_20.jpg?resize=900%2C170&ssl=1)
ページ送りは「表示位置」を変更したり、同一カテゴリーをページ送りに設定する機能などもありますので、ご自分の運営スタイルに合わせてお選びください。
フッターの変更
フッターの背景色と配置しているロゴの色が合っていないのか、見辛いと思ったのでフッターの背景色を変更しました。
![](https://i0.wp.com/kmnmc.com/wp-content/uploads/2022/01/ep09_11.jpg?resize=1024%2C352&ssl=1)
ダッシュボード Cocoon設定 > (タブ)フッター をクリック
フッター色
![](https://i0.wp.com/kmnmc.com/wp-content/uploads/2022/01/ep09_12.jpg?resize=1024%2C248&ssl=1)
「フッター色」から「フッター背景色」をクリックし表示されたカラーパレットからお好みのカラーを設定します。背景色を薄くしたので、それに合わせて「フッター文字色」は濃い色になるように設定しました。
フッターの背景色を変えた場合、フッターの文字色が見えづらくなる可能性があるので一度確認し場合によってはフッターの文字色を調整するようにしましょう。
文字が見えづらいとユーザービリティにも問題がありますので確認は必須です。
おまけ
投稿したに掲載されています「コメント」に関してですが、私は現在表示させて無い設定にしております。ちなみにですがコメント非表示の設定も同タブ内にあります「コメント設定」で表示/非表示の設定が出来ますので、興味のある方は覗いてみてください。
表示しない理由に関してですが、前にも少しお話しました海外からのコメント問題があったので非表示にしております。
こちらすでに対策はしておりますが、セキュリティプラグインや、Google reCAPTCHAなどの設定が終わってから再検討したいと思います。
▼お時間ありましたらこちらも御覧ください
最後に
今回は私が対応した5つのカスタマイズを紹介してきました。
他にも色々と気になる部分があるんですが、記事数も10個を超えましたので、いよいよサイトを公開させていただきたいと思います!
おっとその前に、Google AnalyticsやSearch Consoleの設定もしておいた方が良いですね!
というわけで、次回はGoogle AnalyticsやSearch Consoleの設定方法をご紹介したいと思います。
まだGoogleのアカウント(hogehoge@gmail.com)を取得していない方は、アカウントの取得は無料ですのでこれを機会に取得してみてください!
それでは次回! お疲れさまでした。