SWELLサイドバーのカスタマイズ設定｜表示・非表示の切り替えもできる！

「サイドバーにプロフィールやカテゴリーを設置したい…」

「サイドバーに広告を表示できる？」

「サイドバーを非表示にするには？」

この記事ではそんな方に向けて、SWELLでサイドバーをカスタイマイズ設定する方法を解説します。

この記事を読めば、あなたも簡単に

• 好きな順番でコンテンツをサイドバーに配置できる

ようになります。

私もあなたと同じことに悩んでたのですが、本記事の方法でサクッと解決でき、サイトの回遊率やユーザーの利便性を高めることができました。

どこよりも分かりやすく書いている自信がありますので、あなたもパパッと解決してみてください！

＼SWELL購入を検討中の人はこちらもご覧ください！／

SWELLでカスタマイズ設定できるサイドバーは4種類ある

SWELLでカスタマイズ設定できるサイドバーは4種類あります。

各サイドバーにウィジェットを追加した場合の表示の有無を、以下の表にまとめました。

種類	デバイス別での表示・非表示			ページ別での表示・非表示
	PC	スマホ	タブレット	トップページ	固定ページ	カテゴリー・ タグページ
共通サイドバー
共通サイドバー 【スマホ版】
トップページ専用 サイドバー
追尾サイドバー

※〇：表示される、×：表示されない、△：共通サイドバー【スマホ版】にウィジェットを追加していない場合は表示される

共通サイドバーは、ほぼ全てのデバイスとページに表示されることが分かりますね。

また、全種類のサイドバーにウィジェットを追加した場合、以下のような順番で上から並びます。

デバイス画面	上からの並び順
	1番目	2番目	3番目
PC	トップページ専用サイドバー	共通サイドバー	追尾サイドバー
スマホ	トップページ専用サイドバー	共通サイドバー or 共通サイドバー【スマホ版】	追尾サイドバー
タブレット	トップページ専用サイドバー	共通サイドバー	追尾サイドバー

各サイドバーの並び順とデバイス・ページ別での表示の有無が分かったところで、これからサイドバーに設置したいウィジェットを紹介します。

【基礎編】SWELLサイドバーのカスタマイズ設定7つ

SWELLでサイドバーをカスタマイズ設定する方法を紹介します。

設定方法は、WordPress管理画面で外観⇒ウィジェットの順にクリックして表示されるページで行ってください。

今回は以下7つのウィジェットをサイドバーに設置していきます。

どの種類のサイドバーに任意のウィジェットを追加したほうがいいのかを〇×で紹介します。

プロフィールを設置する

サイドバーにプロフィールを設置していきます。

設定方法は、「利用できるウィジェット」で[SWELL]プロフィールをプルダウンしてください。

設置したい種類のサイドバーを選択し、ウィジェットを追加をクリックしましょう。

プロフィールを設置したほうがいいサイドバー

トップページ専用サイドバー	共通サイドバー	共通サイドバー【スマホ版】	追尾サイドバー

サイドバーに追加されたプロフィールウィジェットで以下の設定を行い、保存をクリックしてください。

これでサイドバーにプロフィールを設定できます。

カテゴリーリストを設置する

サイドバーにカテゴリーリストを設置していきます。

設定方法は、「利用できるウィジェット」でカテゴリーをプルダウンしてください。

設置したい種類のサイドバーを選択し、ウィジェットを追加をクリックしましょう。

カテゴリーリストを設置したほうがいいサイドバー

トップページ専用サイドバー	共通サイドバー	共通サイドバー【スマホ版】	追尾サイドバー

サイドバーに追加されたカテゴリーウィジェットで以下の設定を行い、保存をクリックしてください。

これでサイドバーにカテゴリーリストを設置できます。

サイト内検索フォームを設置する

サイドバーにサイト内検索フォームを設置していきます。

設定方法は、「利用できるウィジェット」で検索をプルダウンしてください。

設置したい種類のサイドバーを選択し、ウィジェットを追加をクリックしましょう。

サイト内検索フォームを設置したほうがいいサイドバー

トップページ専用サイドバー	共通サイドバー	共通サイドバー【スマホ版】	追尾サイドバー

サイドバーに追加された検索ウィジェットで以下の設定を行い、保存をクリックしてください。

これでサイドバーにサイト内検索フォームを設置できます。

投稿の月別アーカイブを設置する

サイドバーに投稿の月別アーカイブを設置していきます。

設定方法は、「利用できるウィジェット」でアーカイブをプルダウンしてください。

設置したい種類のサイドバーを選択し、ウィジェットを追加をクリックしましょう。

投稿の月別アーカイブを設置したほうがいいサイドバー

トップページ専用サイドバー	共通サイドバー	共通サイドバー【スマホ版】	追尾サイドバー

サイドバーに追加されたアーカイブウィジェットで以下の設定を行い、保存をクリックしてください。

これでサイドバーに投稿の月別アーカイブを設置できます。

広告を設置する

サイドバーに広告を設置していきます。

設定方法は、「利用できるウィジェット」で[SWELL]広告コードをプルダウンしてください。

設置したい種類のサイドバーを選択し、ウィジェットを追加をクリックしましょう。

広告を設置したほうがいいサイドバー

トップページ専用サイドバー	共通サイドバー	共通サイドバー【スマホ版】	追尾サイドバー

サイドバーに追加された広告コードウィジェットの「広告タグ」にASPやGoogleアドセンスなどの広告コードを貼り付け、保存をクリックしてください。

これでサイドバーに広告を設置できます。

目次を設置する

サイドバーに目次を設置していきます。

設定方法は、「利用できるウィジェット」で[SWELL]目次をプルダウンしてください。

設置したい種類のサイドバーを選択し、ウィジェットを追加をクリックしましょう。

目次を設置したほうがいいサイドバー

トップページ専用サイドバー	共通サイドバー	共通サイドバー【スマホ版】	追尾サイドバー

サイドバーに追加された目次ウィジェットで以下の設定を行い、保存をクリックしてください。

これでサイドバーに目次を設置できます。

人気記事・新着記事を設置する

サイドバーに人気記事・新着記事を設置していきます。

設定方法は、「利用できるウィジェット」で[SWELL]新着記事 or [SWELL]人気記事をプルダウンしてください。

設置したい種類のサイドバーを選択し、ウィジェットを追加をクリックしましょう。

人気記事・新着記事を設置したほうがいいサイドバー

トップページ専用サイドバー	共通サイドバー	共通サイドバー【スマホ版】	追尾サイドバー

サイドバーに追加された人気記事・新着記事ウィジェットで以下の設定を行い、保存をクリックしてください。

これでサイドバーに人気記事・新着記事を設置できます。

【応用編】SWELLサイドバーのカスタマイズ設定3つ

SWELLではカスタムHTMLウィジェットとブログパーツ機能を組み合わせて使うことで、オリジナルコンテンツをサイドバーに表示させることができます。

今回は以下3つのオリジナルコンテンツをサイドバーに設置していきます。

設定方法は以下の3ステップです。

では実際に、オリジナルコンテンツを作成していきましょう。

アフィリエイト広告+レビュー記事

サイドバーに設置するコンテンツ「アフィリエイト広告+レビュー記事」を作成していきます。

設定方法【STEP1】に戻り、残りの【STEP2】~【STEP3】を行ってください。

おすすめ記事【カテゴリー別】

サイドバーに設置するコンテンツ「おすすめ記事【カテゴリー別】」を作成していきます。

設定方法【STEP1】に戻り、残りの【STEP2】~【STEP3】を行ってください。

ボックス型アイコン+テキストリンク

サイドバーに設置するコンテンツ「ボックス型アイコン+テキストリンク」は、ボックスメニューブロックを使って作成できます。

作成方法やボックスメニューブロックの使い方については、下の記事にまとめてますのでご覧ください。

「ボックス型アイコン+テキストリンク」を作成できたら設定方法【STEP1】に戻り、残りの【STEP2】~【STEP3】を行いましょう。

SWELLサイドバーの表示・非表示を切り替える方法

さて、SWELLではページごとにサイドバーの表示・非表示設定ができます。

ここでは以下の3タイプに分けて、サイドバーの表示・非表示を切り替える方法を紹介します。

ページ種別で設定する

サイドバーの表示・非表示の切り替えを以下4つで設定できます。

設定方法は以下のとおりです。

投稿(固定)ページごとで設定する

サイドバーの表示・非表示の切り替えを投稿ページごと、固定ページごとで設定できます。

設定方法は以下のとおりです。

カテゴリー・タグページごとで設定する

サイドバーの表示・非表示の切り替えをカテゴリーページごと、タグページごとで設定できます。

設定方法は以下のとおりです。

まとめ：SWELLサイドバーを設定して必要な情報を並べよう

今回は、SWELLでサイドバーをカスタイマイズ設定する方法を紹介しました。

当ブログではSWELLに関する記事をいくつか書いてます。

下のページにまとめていますので、のぞいてみてください。