WordPress、無料テーマ「Cocoon」のサイドバー設定方法

2019年2月5日2020年10月15日

人気無料テーマ「Cocoon」を利用してブログのサイドバーをカスタマイズします。Cocoonには既存でサイドバー用のパーツを作成するウイジェットが用意されています、これを利用して、驚くほど簡単な操作で「最新記事一覧」や「人気記事一覧」の作成ができます。また、サイドバーに欠かせないプロフィールヤSNSボタンの設定も紹介しています。あなたのブログのサイドバーが生まれ変わります(^▽^)

ブログのサイドバーとは、メイン記事の右側（または左側）に設置する領域のことです。このサイドバーにどんな内容を設定するかはとても重要です。「どんな人がこのブログを運営しているのか」、「ブログの運営目的は何か」、「どんな内容の記事が主なのか」が読者にストレスなく伝わることが大事です。そしてサイドバーはクリックしようと思ってもらえることが第一条件です。

読者にとって関心のある項目が「記事一覧」に並んでいると、別の記事も読んでもらえます。またTwitterやInstagramのリンクがあればあなたのことを知ってもらえるチャンスになります。

どのようなコンテンツ（項目）を置くかは悩むところですが、ブログを構築したばかりの初心者向けに設置して欲しいオススメのコンテンツ（項目）とその設定方法について解説します。

＊今回の設定は人気無料テーマ「Cocoon」を利用しています、設定画面は利用するテーマによって異なります。

＊無料テーマ「Luxeritas（ルクセリタス）」を利用した設定画面（Luxeritasに特化していない設定もあります。基本部分はその他のテーマを利用の場合でも参考にしていただけます）は以下を参照ください
↓↓↓↓↓↓↓
■WordPress（ワードプレス）のサイドバー設定方法[初心者向け]、SNSフォローと新着記事とウイジェット設定

サイドバーに表示したい項目

サイドバーに設置するべきおすすめの項目は以下です。

• プロフィール
• SNSフォローボタン
• 検索用ウィンドウ
• 最新記事一覧
• 人気記事一覧
• カテゴリー

この他にも「メルマガ登録用のバナー（メルマガフォームへのリンク）」や、「おすすめ企画へのバナー（アフィリエイトしたい商材のLPへのリンク）」などの配置が必要になってきます。
今回はブログを構築したばかりの段階を想定しての設定なので、上記の「基本５項目＋SNSフォローボタン」の設定方法を紹介します、今後のビジネスの発展に伴い随時追加していっていただければと思います。

ウィジェット設定

まずウィジェットとは、パソコンのデスクトップやWebページなどで動作する小さなアプリケーションのことです。ウィジェットを利用することであらかじめ用意されている機能を色々組み込むことができます。

ウィジェットには、
・もともとWordPrssのデフォルト機能として含まれているもの
・プラグインで追加するもの
・テーマ（サンプルで使用しているのは＊無料テーマ「Cocoon」）に付随しているもの
等があります。
利用できるウィジェットは「利用できるウィジェット一覧」の画面で確認できます。

ウィジェット設定画面

ダシュボードの左メニューで、[外観]>>[ウィジェット]をクリックします。

ウィジェットの一覧画面がでます、内容は使用するテーマによって異なります。
＊無料テーマ「Cocoon」のウィジェット画面です。
＊デフォルト＝初期設定の状態

現状（変更前のデフォルト）のブログのサイドバーの表示です。

不要な項目の削除

まず、今回表示をしないことにする項目を非表示（削除します）
表示しない項目は
■アーカイブ
■メタ情報
です。

メタ情報の削除

「メタ情報」は本体の機能とは別の付加的な機能にあたる項目です。ここには、ダッシュボード（管理画面）を表示するための「ログイン」画面の表示などがありますが、読者は利用しないので一覧から削除します。
＊ログイン画面はブラウザのお気に入りに登録しておきましょう。

①メタ情報の右端にある▼をクリックすると▲（上むき三角）になります。
②内容が表示されるので[削除]をクリックします。

メタ情報が削除されました。

アーカイブの削除

アーカイブは月ごとの記事をまとめて表示してくれる機能です。
＊自分がブログを探す際には利用する可能性はありますが、読者側の立場ではほぼ利用しません。いつからブログ記事を書いているかを知らせることはできますが、ビジネスとしてブログを運営する上でアピールポイントとしてのメリットは少ないと思われます。りんごの個人的な意見ですが、削除したほうがよいと思います。
＊個人的な考えもあるかと思います、表示or非表示の判断は自身で決めてください。必要であればまた表示できます。

メタ情報と同じ操作で、「アーカイブ」を削除します、

追加するウィジェット

追加するウイジェットは以下です
■プロフィール
■SNSフォロー
■新着記事　（＊最近の投稿と入れ替えます）
■人気記事

プロフィール

設定方法は以下の記事でご紹介しています。
↓↓↓↓↓↓↓
■WordPress、[Cocoon]サイドバーに「プロフィール」と「SNSフォロー」をウィジェットで簡単に設定

SNSフォロー

＊＊＊上記と同じ記事に記載しています。＊＊＊
↓↓↓↓↓↓↓
■WordPress、[Cocoon]サイドバーに「プロフィール」と「SNSフォロー」をウィジェットで簡単に設定

新着記事

新着記事一覧を追加します。
ウィジェット一覧から「[C]新着記事」をクリックします。
＊[C]と先頭に付いているのはテーマ「Cocoon」専用に用意されたウイジェットです。
＊ウイジェットは、利用するテーマにより異なります。

開いたウィンドウから表示位置を選択します、
デフォルトで[サイドバー]が選ばれています、このまま[ウイジェットを追加]をクリックします。

ウイジェット一蘭に追加され、詳細を確認します。
そのままで問題なければ「完了」をクリックします。
＊内容を変更した場合は[保存]をクリックします。

元々設置されていた[最近の投稿]　は新着記事と同じ項目なので削除します。

ブログの表示状態を確認します。
サムネイルも設定された新着記事一覧が表示されています。

人気記事

人気記事一覧とは、読者による閲覧数を計測して、閲覧数の多い記事を一覧表示してくれる機能です。
Cocoonには人気記事一覧も簡単な設定で設置できるウィジェットが用意されています。

ウイジェット一覧から「[C]人気記事」をクリックします。

開いたウィンドウから表示位置を選択します、
デフォルトで[サイドバー]が選ばれています、このまま[ウイジェットを追加]をクリックします。

「人気記事」の項目がサイドバー一覧に追加され、詳細設定の内容が表示されます。内容を確認して[完了]　をクリックします。
＊基本デフォルトのままでOKです
＊表示モードや表示数が設定できます
＊集計期間は直近の30日間に設定されています（その他の期間設定もできます、おススメは30日間です）
＊内容を変更した場合は[保存]をクリックします

＜参照＞モバイル設定の内容は以下のまま、特に変更しなくても大丈夫です

ブログの表示状態を確認します。
新着記事一覧と同様にサムネイルが設定された一覧が表示されています。
＊人気記事一覧は設定後、表示されるまでに数日かかる場合があります

サイドバー項目の並び順変更

設定したサイドバーは、好みの順番に並べることができます。

サイドバーの設定画面で、移動したい項目の領域をドラッグし、移動したい位置に持って行きます。ドラッグ後に「保存」や「更新作業」は不要です、即座に反映されています。
実際のブログ表示を確認しながら、位置調整をしてください。

以下が、順番を入れ替え完了後の位置です。
＊プロフィールやSNSの項目も設定完了した状態です。
＊プロフィールは最上位がお勧めです。

いかがですが、サイドバーがあっという間に華やかになりましたね（^^）

サンプルサイトはこちら
↓↓↓↓↓↓↓
https://applired.xsrv.jp/cocoon/

サンプル画面では、表示形式をデフォルトに設定していますが、その他の設定も実際に表示して試してみることをおススメします。

では、ひきつづきもうひと頑張りという方は以下をどうぞ！
↓↓↓↓↓↓↓
■WordPress、[Cocoon]サイドバーに「プロフィール」と「SNSフォロー」をウィジェットで簡単に設定

SNSフォローボタン設置したいけど、
そもそもSNS（TwitterやFacebook ）をもってないよ〜という方は以下で順番に作成方法をご案内しています。
↓↓↓↓↓↓↓
SNS活用  https://applired.net/sns/

お願い記事内の不具合や間違い等をお知らせください。 （キャプチャーの違い、古くなった情報、誤字脱字等些細なことでもかまいません）
↓↓↓↓↓↓↓↓
＊お知らせいただいた方にはりんごからささやかなお礼を送らせていただきます。