SWELLでサイドバーを表示する方法｜初心者でも5分でできるカスタマイズ入門
WordPressテーマ「SWELL」は、シンプルで高機能なデザインが魅力の人気テーマです。トップページやブログ記事の表示が美しい一方で、サイドバーの表示方法に悩む初心者の方も少なくありません。
この記事では、「SWELLでサイドバーを表示したいけれど、設定場所がわからない」「固定ページにサイドバーを出すにはどうすればいいの？」という方向けに、サイドバーの基本的な設定からページごとの表示切り替え方法までを、わかりやすく解説します。
そもそもサイドバーとは？
サイドバーとは、Webサイトの右側（または左側）に表示される補助的なエリアです。主に以下のような情報を掲載するのに使われます。
- プロフィール
- 人気記事一覧
- 検索ボックス
- カテゴリやタグのリンク
- バナーや広告
訪問者の回遊を促すための導線として、またブログやメディア型サイトでは「収益化エリア」としても活用されます。
SWELLでは、ページごとにサイドバーの表示／非表示を細かく設定できます。
SWELLでサイドバーを表示する基本設定
1. サイドバーを表示したい位置の確認
SWELLでは、以下のページでサイドバーの表示／非表示を切り替えることが可能です。
- 投稿ページ（ブログ記事）
- 固定ページ
- アーカイブページ（カテゴリ・タグ・著者など）
- トップページ
表示したいページタイプを決めたら、次のステップへ進みましょう。
2. グローバル設定でのサイドバー表示方法
サイト全体にサイドバーを表示したい場合は、カスタマイザー（外観 → カスタマイズ）を使って設定します。
手順：
- WordPress管理画面へログイン
- 「外観」→「カスタマイズ」をクリック
- 「サイト全体設定」→「サイドバー設定」を選択
- 各ページタイプに対して「表示する／しない」を選べる項目が出てきます
- 必要に応じて、「右サイドバー」または「左サイドバー」を選択
- 保存して公開をクリック
ページごとにサイドバーを表示・非表示する方法
SWELLでは、投稿や固定ページごとにサイドバーの表示／非表示を個別に設定することが可能です。
1. 投稿ページでの設定
- 投稿編集画面を開く
- 画面右側の「SWELL設定」タブをクリック
- 「レイアウト」項目を開く
- 「サイドバーの表示設定」から「表示する」「非表示」を選択
この設定により、例えば「この記事だけは集中して読ませたいから、サイドバーは非表示にしたい」といった柔軟な対応が可能になります。
サイドバーに表示する内容を設定するには？
サイドバーの中身を設定するには、「ウィジェット」機能を使用します。
ウィジェットの設定方法
- 「外観」→「ウィジェット」をクリック
- 「サイドバー」エリアに、表示したいブロックを追加
- たとえば「検索」「最新記事」「カテゴリ」「カスタムHTML」などを自由に追加
- 保存して完了
SWELLはブロックエディタに完全対応しているため、ウィジェットもブロックベースで直感的に編集できます。
固定ページでサイドバーを表示する注意点
SWELLでは、固定ページの初期設定ではサイドバーが非表示になっているケースが多いため、表示したい場合は手動で設定が必要です。
- 固定ページ編集画面を開く
- 「SWELL設定」→「レイアウト」→「サイドバー：表示する」に変更
- ページを更新して完了
なお、固定ページ用のテンプレートを使っている場合（例：「ランディングページ」など）は、もともとサイドバー非表示仕様になっていることもあります。その場合はテンプレートの変更も検討しましょう。
よくある質問
Q. トップページにだけサイドバーを出したいのですが？
→ トップページは「固定ページ」で作成している場合が多いです。そのページを開き、個別に「サイドバー表示」に設定してください。
Q. モバイルではサイドバーが出ません
→ SWELLでは、モバイル画面ではサイドバーはページ下部（コンテンツの下）に自動で表示される設計になっています。PCと同じ位置に出すことは基本的にできません。
Q. サイドバーの見た目を変えたいです
→ 「追加CSS」や「カスタムHTMLブロック」でスタイルを調整できますが、初心者の場合は必要最低限の変更に留めることをおすすめします。
まとめ｜SWELLでのサイドバー表示は「設定場所」がカギ
SWELLでは、サイト全体／個別ページ／ウィジェットなど、複数の場所でサイドバーをコントロールできます。一見わかりづらいかもしれませんが、操作自体はシンプルです。
まずは以下を明確にするのがポイントです。
- どのページにサイドバーを出したいか
- サイト全体か、ページ個別か
- 表示内容は何にするか（ウィジェット）
SWELLの機能を使いこなせば、シンプルな中にも情報設計の工夫が詰まったサイトづくりが可能になります。この記事を参考に、目的に合ったサイドバー設計を試してみてください。
