WordPressでサイドバーを追加する方法を知りたいですか?
サイドバーは、読者がWordPressサイトをナビゲートしたり、ニュースレターに登録したり、ソーシャルメディアのプロフィールをフォローしたりするのに役立つ貴重なスペースです。しかし、コンテンツのニーズに合わせたサイドバーを作成するにはどうすればよいのでしょうか?
この記事では、3つの異なる方法を使ってWordPressにサイドバーを追加する方法を紹介します。
WordPressのサイドバーとは?
WordPressのサイドバーは、メインのコンテンツエリアの左側または右側にある縦長のスペースです。ウィジェット化された領域で、主要なコンテンツ領域の外側にコンテンツを表示することができます。
各ページで主要なコンテンツエリアが変わっても、サイドバーはウェブサイト全体でほとんど変わりません(複数のサイドバーを作成しない限り)。
WordPressのテーマは、デフォルトでサイドバーの見え方をコントロールします。そのため、そのまま使用すると、テーマがサイドバーの配置、一度に使用できるサイドバーの数、そもそもサイドバーがあるかどうかをコントロールします。
デフォルトのサイドバーには、あなたのビジネスニーズに合わないウィジェットが付属している可能性もあります。デフォルトのサイドバーが要件を満たさない場合、新しいカスタムサイドバーを作成する必要があるかもしれません。
WordPressのサイドバーは何に使える?
WordPressのウィジェットを使って、サイドバーにほとんどのコンテンツを追加することができます。以下はその例です:
- ナビゲーション-ナビゲーションメニューウィジェットを使って、ユーザーが関連するページを見つけやすくしたり、ブログの記事をカテゴリー別にフィルタリングするメニューを作ることができます。
- 検索- サイドバーに検索ボックスを追加することは、ユーザーが探しているものを素早く見つけるための優れた方法です。
- Eメール購読- サイドバーにオプトインのEメールフォームを追加して、Eメールアドレスを収集し、リストを増やすことができます。
- 注目のコンテンツ- サイドバーは、ユーザーにとって他の記事よりも価値のある記事を紹介するのに最適な場所です。
- ソーシャルメディア- フォロワーを増やし、ブランド認知度を高めるために、ソーシャルフォローボタンやソーシャルメディア共有ウィジェットを簡単に追加できます。
- 広告- サイドバーは、収益を上げるために広告を表示するのに最適な場所です。
- 行動喚起(CTA)- 新しいオンラインコース、製品、オファーがある場合、サイドバーにCTAを追加して読者にチェックを促すことができます。
ここまでで、サイドバーが何であるか、そしてそれがウェブサイト訪問者に価値あるコンテンツを表示する簡単な方法であることはお分かりいただけたと思います。それでは、WordPressでサイドバーを追加する方法を見ていきましょう。
以下では、WordPressのカスタマイザー、WordPressのウィジェット画面、ウェブサイト・ビルダーのプラグインを使った3種類の方法を紹介する。さらに、どの方法もコードを使う必要はありません。
SeedProdでWordPressにカスタムサイドバーを追加する方法
WordPressサイトでカスタムサイドバーを作成したり、複数のサイドバーを同時に使用したいですか?
そのためには、WordPressのプラグインか、コードを使ってゼロから新しいサイドバーを作成する知識が必要です。幸運なことに、パワフルで軽量なプラグインを使えば、WordPressのカスタムサイドバーを簡単に作成することができます:SeedProdです。

SeedProdは最高のドラッグアンドドロップWordPressウェブサイトビルダーです。コードなしでカスタムWordPressテーマやページレイアウトを作成できます。
SeedProdは、テーマのすべての部分を作成するために個々のテンプレートを使用します。これらのテンプレートの1つはサイドバーで、数回クリックするだけでサイトにカスタムサイドバーを追加することができます。
さらに、SeedProdで好きなだけサイドバーを作成し、ウェブサイトの特定のページや投稿に表示することができます。
SeedProdを使用してWordPressにサイドバーを追加するには、以下の手順に従ってください。
ステップ1.SeedProdウェブサイトビルダーをインストールする
最初のステップは、SeedProd Website Builderプラグインをインストールすることです。
注:テーマビルダー機能を使用するには、SeedProd ProまたはEliteライセンスが必要です。
このステップで助けが必要な場合は、WordPressプラグインのインストールに関するこちらのガイドに従ってください。
プラグイン.zipファイルをインストールし、有効化した後、SeedProd ≫ 設定 ページに進み、ライセンスキーの詳細を入力してください。ライセンスキーはSeedProdウェブサイトのアカウントダッシュボードで確認できます。

ステップ2.WordPressテーマ・テンプレートを作成する
SeedProdでカスタムサイドバーを作成するには、まずテーマの様々なパーツを作成する必要があります。テンプレートファイルを直接編集する必要はありません。
まず、SeedProd " Theme Builderページにアクセスしてください。このページには、現在のSeedProdテーマのテンプレート一覧が表示されます。
まだ始めていないので、グローバルCSSテンプレートしかない。
始めるには、2つの選択肢がある。
- 既製のSeedProdテーマのいずれかを出発点として使用します。
- テーマテンプレートをゼロから手動で作成
テーマテンプレートから始めることをお勧めします。これにより、SeedProdがすべてのテンプレートファイルを自動的に生成し、あなたの要求に合わせてテンプレートを編集するためのスタートを切ることができます。

テーマテンプレートを選択するには、テーマボタンをクリックし、利用可能なテーマのいずれかを選択します。ウェブサイトによってテーマが異なりますので、ニーズに合ったものをお選びください。

テーマを選択すると、SeedProdは自動的にすべてのテーマテンプレートを作成します。その結果、ビジュアルドラッグアンドドロップエディタで各テンプレートを個別に編集できるようになりました。

ステップ3.WordPressサイドバーをカスタマイズする
SeedProdでサイドバーをカスタマイズするには、サイドバーテンプレートを見つけ、デザイン編集リンクをクリックしてください。

そうすると、SeedProdのドラッグ&ドロップビルダーでサイドバーが起動します。右カラムにサイドバーテンプレートのライブプレビューが表示され、左カラムに編集パネルが表示されます。

サイドバーの項目を変更するには、指をさしてクリックするだけです。例えば、ゴミ箱のアイコンをクリックしてブロックを削除することができます。

また、任意のブロックをクリックすると、左のパネルでそのブロックの設定を見ることができます。

SeedProdのテーマブロックを使って、サイドバーに様々なコンテンツを追加することができます。左からブロックをドラッグしてサイドバーの所定の位置にドロップするだけです。

選べるブロックには以下のようなものがある:
- Template Tags- ブログ記事、コメント、フィーチャー画像など、WordPressから動的なコンテンツを追加できるブロック。動的なサイドバーを作成するのに最適な方法です。
- 標準ブロック- 画像、ボタン、テキスト、動画など、ほとんどのウェブサイトで使用されている一般的なウェブデザイン要素です。
- 高度なブロック-コンタクトフォーム、ソーシャルプロフィール、共有ボタン、オプトインフォーム、Googleマップなどの高度なリード生成機能。
- WooCommerce- オンラインストアを運営している場合、サイドバーに人気商品、ショッピングカート、その他のストア機能を表示するためにWooCommerceブロックを使用することができます。
サイドバーにコンテンツを追加するだけでなく、SeedProdではサイドバーの色、フォント、間隔、ボーダーなどをカスタマイズすることができます。
例えば、セクションの設定アイコンをクリックすると、背景色の変更、背景画像のアップロード、幅の変更などのオプションが表示されます。さらに、「詳細設定」タブでは、ボーダーやスペーシングなどをコントロールすることができます。

新しいサイドバーに満足したら、画面右上の緑色の保存 ボタンをクリックします。
テーマの他のテンプレートについても、このプロセスを繰り返す:
その結果、すべてのビジネスニーズに合ったカスタムWordPressテーマを作成することができます。
ステップ4.WordPressでカスタムサイドバーを公開する
カスタムWordPressサイドバーに満足したら、最後のステップはWordPressサイトでそれを有効にすることです。
SeedProdでは、簡単なスイッチでWordPressのカスタムサイドバーを適用することができます。
SeedProd " Theme Builderページに行き、'Enable SeedProd Theme'オプションの横のスイッチを'Yes'に切り替えるだけです。

SeedProdは、既存のデザインを新しいWordPressテーマとサイドバーに置き換えます。
これで、あなたのウェブサイトを訪問して、カスタムWordPressサイドバーが動いているのを見ることができます。

SeedProdでWordPressに複数のサイドバーを追加する方法
カスタムサイドバーができたので、いつでも好きな時にデザインを編集することができます。しかし、複数のサイドバーが必要で、ウェブサイトの異なるセクションに表示したい場合はどうすればいいでしょうか?
例えば、ブログのサイドバーとは異なるページ用のサイドバーを作成したい場合があります。SeedProdのグローバルテンプレートパーツを使えば、それが可能です。
テーマ・ビルダー・チュートリアルの第13回は、グローバル・パーツがどのように機能するかを紹介します:
または、以下の指示に従ってください。
まず、SeedProd " Theme Builderページに行き、Add New Theme Templateボタンをクリックします。

そこで、グローバル・パート・オプションを選択し、「保存」をクリックする。

これで、前のステップと同じようにカスタムサイドバーを構築することができます。
新しいサイドバーを作成したら、SeedProdのドラッグアンドドロップエディタでシングルページテンプレートを開きます。

サイドバーのスペースを確保するには、既存のレイアウトを2カラムのセクションに置き換える必要があります。

次に、テンプレート・パート・ブロックを新しいセクションの2列目にドラッグします。

そこから、ドロップダウンメニューから新しく作ったサイドバーを選ぶことができます。

保存をクリックして変更を保存すると、ページに移動したときに新しいカスタムサイドバーが自動的に表示され、ブログの投稿には最初のサイドバーが表示されます。

カスタマイザーでWordPressにサイドバーを追加する方法
組み込みのWordPressカスタマイザーを使用すると、WordPressサイトにカスタムサイドバーを簡単に追加できます。カスタマイザーは、デフォルトのWordPressテーマ設定を使用して、サイドバーのレイアウト、コンテンツ、配置を制御します。
この方法を使うには、サイドバー・ウィジェット・エリアを含むWordPressテーマが必要です。まだテーマを持っていない場合は、中小企業向けの最も人気のあるWordPressテーマをご覧ください。
このガイドでは、Astra WordPress Themeを使用します。
ステップ1:WordPressのサイドバーレイアウトを追加する
テーマをインストールしたら、「外観」≫「テーマ」で青い「カスタマイズ」ボタンをクリックします。

WordPressのカスタマイザーページが表示され、テーマのレイアウトやデザインを編集することができます。このページに表示される設定はテーマによって異なりますが、Astraテーマを使ってサイドバーを追加する方法を紹介しますので、何をすればいいのか見当がつくと思います。
カスタマイザー内の左側のパネルを見て、「サイドバー」の見出しを見つけてください。その見出しをクリックすると、サイドバーのカスタマイズオプションが開きます。

次の画面では、以下のサイドバーオプションから選択できます:
- デフォルトレイアウト- サイドバーなし、右サイドバー、左サイドバー。
- Pages- 単一ページでサイドバーを表示する場所。
- Posts- 単一の投稿にサイドバーを表示する場所。
- アーカイブ-ブログページのようなアーカイブページでサイドバーをどのように表示するか。

同じページでサイドバーの幅も選択できます。サイドバーのレイアウトに満足したら、「公開」ボタンをクリックします。
ステップ2.カスタマイザーでサイドバーにウィジェットを追加する
サイドバー・レイアウトを選んだら、ウィジェットを追加しましょう。そのためには、WordPressのカスタマイザーメニューで「ウィジェット」の見出しを見つけ、クリックして設定を開きます。

次の画面では、その特定のページで現在利用可能なサイドバーのリストが表示されますので、カスタマイズしたいサイドバーをクリックしてください。

サイドバー・ビルダーが表示され、選択したウィジェットを表示する準備ができました。プラス (+) アイコンをクリックして、サイドバーに表示したいブロックやウィジェットを検索します。

ブロックをクリックすると、自動的にサイドバーに追加されます。
お好みの形になるまで、サイドバーにウィジェットを追加し続けてください。そして、「公開」ボタンをクリックして変更を保存します。
これで、あなたのページにアクセスすると、カスタムWordPressサイドバーが表示されます。

ウィジェット画面を使ってWordPressにサイドバーを追加する方法
次の方法は、WordPressのウィジェット画面を使ってWordPressにサイドバーを追加する方法です。前の方法と似ていますが、サイドバーの配置を変更できる代わりに、サイドバーにウィジェットを追加できるだけです。
この方法を使うには、WordPressのダッシュボードから「外観」≫「ウィジェット」と進んでください。この画面で、テーマが現在サポートしているすべてのサイドバーを見ることができます。

私たちのケースでは、テーマにはカスタマイズ可能な4つのサイドバーエリアが含まれています:
- メイン・サイドバー
- ヘッダー
- フッターバー・セクション1
- フッターバー・セクション2
サイドバーにウィジェットを追加する方法は、前のステップと同様です。プラスアイコンをクリックして、サイドバーに追加したいウィジェットを検索するだけです。

サイドバーの作成が完了したら、更新ボタンをクリックしてください。これであなたのサイトにアクセスして、新しいサイドバーを見ることができます。

今はここまでだ!
この記事が、WordPressでサイドバーを簡単に追加する方法を学ぶのにお役に立てば幸いです。
サイドバーを完全にコントロールする最も簡単な方法はSeedProdです。ビジュアルでドラッグアンドドロップのビルダーを提供し、コードやテーマファイルを直接編集する必要がなく、WordPressダッシュボードの中からサイドバーをカスタマイズすることができます。
あなたのリストを増やすための最高のリードマグネットの例に関するこの投稿も気に入るかもしれない。さらにサイドバーをカスタマイズしたい場合は、WordPressでページごとに異なるサイドバーを追加する方法をご覧ください。
お読みいただきありがとうございました!ご質問やご意見がありましたら、お気軽にコメントをお寄せください。
また、YouTube、X(旧Twitter)、Facebookでも、ビジネスの発展に役立つコンテンツを配信しています。