SWELLでサイドバーを設定する方法【ウィジェットの追加から非表示まで】

ブログのサイドバーは、読者が関連記事や情報を見つけやすくするための重要なエリアです。

SWELLではサイドバーのコンテンツをウィジェットで自由にカスタマイズできます。

プロフィール・カテゴリー・人気記事など、読者に役立つ情報を配置することで、ブログ内の回遊率を高められます。

この記事では、SWELLのサイドバー設定方法を解説します。

サイドバーとは

サイドバーとはブログの記事本文の横に表示されるエリアのことをいいます。

PCでは右側または左側に表示され、スマホでは記事の下部に表示されることが多いです。

サイドバーの設定場所

SWELLのサイドバー設定は2箇所から行います。

① ウィジェットの設定（サイドバーの中身を設定） WordPress管理画面の「外観」→「ウィジェット」

② カスタマイズの設定（サイドバーの表示・非表示やレイアウトを設定） WordPress管理画面の「外観」→「カスタマイズ」→「サイドバー」

ウィジェットでサイドバーの中身を設定する

ステップ1　ウィジェット画面を開く

WordPress管理画面の「外観」→「ウィジェット」をクリックします。

左側に追加できるウィジェットの一覧、右側にサイドバーのエリアが表示されます。

ステップ2　ウィジェットを追加する

追加したいウィジェットの「+」ボタンをクリックするか、ドラッグしてサイドバーエリアに追加します。

おすすめのウィジェット構成

① プロフィール（最上部） 読者が「誰が書いているのか」を確認できるよう、プロフィールを最上部に設置します。SWELLには専用のプロフィールウィジェットが用意されています。

② 人気記事（プロフィールの下） よく読まれている記事を表示することで、新しく来た読者が他の記事に回遊しやすくなります。

③ カテゴリー一覧 ブログのカテゴリー構成を見せることで、読者が目的のカテゴリーに移動しやすくなります。

④ 広告バナー アフィリエイトリンクや自分のサービスへのリンクをバナー形式で設置できます。

⑤ 最新記事 最新の記事を表示することで、定期的に訪れる読者に新着情報を伝えられます。

ステップ3　ウィジェットの順番を調整する

ウィジェットはドラッグして順番を変えられます。

読者に最初に見せたいものを上に配置しましょう。

SWELLのサイドバー専用ウィジェット

SWELLにはオリジナルのウィジェットがいくつか用意されています。

SWELL：プロフィール アイコン画像・名前・自己紹介文・SNSリンクをまとめて表示できるプロフィールウィジェットです。通常のWordPressのプロフィールより見た目がきれいに仕上がります。

SWELL：目次 記事の目次をサイドバーに表示できます。長い記事で読者が目的のセクションにジャンプしやすくなります。

SWELL：人気記事 アクセス数をもとに人気記事を自動で表示するウィジェットです。

サイドバーの表示・非表示を設定する

ページごとにサイドバーを設定する

カスタマイズ→「サイドバー」を開くと、以下のページごとにサイドバーの表示・非表示を設定できます。

記事ページはサイドバーありにして、固定ページ（プロフィール・お問い合わせなど）はサイドバーなしにするのが一般的です。

サイドバーの位置を設定する

カスタマイズ→「サイドバー」→「サイドバーの位置」から右側・左側を選べます。

一般的なブログは右側にサイドバーを配置することが多いです。

サイドバーを固定表示にする

カスタマイズ→「サイドバー」→「サイドバーをスクロールに追従させる」をオンにすると、読者がスクロールしてもサイドバーが追従して表示されます。

プロフィールや広告を常に見えるようにしたい場合に便利です。

記事ごとにサイドバーを非表示にする

特定の記事だけサイドバーを非表示にしたい場合は、記事編集画面から設定できます。

ランディングページ的に使いたい記事や、横幅を広く使いたい記事に活用できます。

スマホでのサイドバー表示

SWELLのサイドバーはスマホでは記事本文の下部に表示されます。

スマホではサイドバーが画面下に来るため、重要なコンテンツは記事本文内に入れることが大切です。

サイドバーの広告やプロフィールはスマホ読者には見られにくいことを念頭においておきましょう。

よくある質問

Q. サイドバーに画像を表示するにはどうすればいいですか？ 「画像」ウィジェットを追加することで画像を表示できます。アフィリエイトのバナー画像を貼り付ける際によく使われます。

Q. サイドバーのウィジェットが表示されません。なぜですか？ カスタマイズ→「サイドバー」で該当ページのサイドバーが「表示する」になっているか確認してください。設定はされていても非表示になっているケースがあります。

Q. サイドバーの幅を変更できますか？ カスタマイズ→「サイドバー」→「サイドバーの幅」から変更できます。デフォルトは300px程度ですが、広告バナーのサイズに合わせて調整しましょう。

まとめ

SWELLのサイドバー設定方法をまとめます。

サイドバーは読者の回遊率を高める重要なエリアです。

プロフィールで信頼感を与え、人気記事で他の記事への誘導を作ることで、読者がブログに長く滞在してくれるようになります。

SWELLの他の設定についてはSWELLの初期設定完全ガイドも合わせて確認してみてください。