WordPressでサイドバーを編集する方法
公開: 2020-02-25WordPressでサイドバーを編集するには、いくつかの方法があります。ウィジェットオプション、テーマオプション、カスタマイザーを使用して、コードを直接編集できます。 WordPressでサイドバーを編集するこれらの各方法は、WordPressサイトのアクティブなテーマによって異なります。 WordPressテーマの大部分には、サイドバーを編集するためのテーマオプションの方法があるか、サイドバーを編集するためのカスタマイザーオプションがサポートされています。
このチュートリアルでは、WordPressでサイドバーを編集するために使用できるこれらの各方法を強調し、これらの各方法の長所と短所を強調します。 WordPressのブログやサイトでサイドバーを編集するための最良の方法を探しているなら、この投稿はあなたが始めるのに最適な場所であるはずです。
サイドバーとは何ですか?
サイドバーにはユーザーごとに異なる定義がある可能性があるため、この質問に答えることから始めると役立ちます。
基本的に、WordPressコンテキストのサイドバーは、メインコンテンツとは異なる追加コンテンツ用に予約されているWebサイト上の領域です。 設計上、ほとんどのWordPressサイドバーは左側または右側に配置されています。 WordPressでは、コンテンツ領域の下にサイドバーを配置することもできます。
一般的なサイドバーのレイアウト
サイドバーのレイアウトはテーマごとに異なりますが、すべてのテーマで人気のある標準のレイアウトは次のとおりです。
- 左側のサイドバーのレイアウト
- 右側のサイドバーのレイアウト
- 左右両方のサイドバーレイアウト
WordPressのサイドバーに関するもう1つの重要な点は、ドラッグアンドドロップブロックであるため使いやすいウィジェットを使用してサイドバーにコンテンツを追加できることです。
WordPressでサイドバーを作成する方法は?
WordPressのサイドバーは、WordPressテーマまたはプラグインのいずれかによって作成されます。 WordPressにサイドバーを追加するコードはfunctions.phpファイルに追加され、サイドバー登録関数と、WordPressサイドバーを登録するために使用されるいくつかの引数で構成されます。
WordPressでサイドバーを作成する方法について詳しく知りたい場合は、ここに包括的なガイドを作成しました。WordPressでサイドバーを追加する方法と、WordPressでサイドバーを登録する方法とWordPressでサイドバーを削除する方法です。
以下は、functions.phpファイルに追加してWordPressサイトにカスタムサイドバーを追加できる最も簡単なコードです。
関数my_custom_sidebar(){ register_sidebar( 配列 ( 'name' => __( 'Custom'、 'your-theme-domain')、 'id' => 'カスタムサイドバー'、 'description' => __( 'カスタムサイドバー'、 'your-theme-domain')、 'before_widget' => '<div class = "widget-content">'、 'after_widget' => "</ div>"、 'before_title' => '<h3 class = "widget-title">'、 'after_title' => '</ h3>'、 )。 ); } add_action( 'widgets_init'、 'my_custom_sidebar');
以下は、上記の手順で追加したカスタムサイドバーを表示するために使用できるコードです。
<?php if(is_active_sidebar( 'custom-side-bar')):?> <?php dynamic_sidebar( 'custom-side-bar'); ?> <?php endif; ?>
ページテンプレートや、WordPressサイドバーを表示するヘッダーやフッターなどの他のテーマファイルで使用できます。 WordPressサイドバーに関する基本的な情報を強調したので、WordPressでサイドバーを編集する方法を見てみましょう。
#1)ウィジェットを使用してWordPressでサイドバーを編集する
WordPressテーマのウィジェットオプションを使用すると、ドラッグアンドドロップを使用してWordPressサイドバーに新しい機能を追加できます。 ドラッグアンドドロップ方式で追加できるこれらの小さなブロックは、WordPressウィジェットと呼ばれます。
WordPressサイドバーの機能を強化するために使用できるウィジェットは数千あります。 これらのウィジェットにはテーマが付属している場合もあれば、WordPressプラグインによって追加される場合もあります。 特定のニーズを満たすために、独自のカスタムウィジェットを作成することもできます。
また、WebまたはWordPressリポジトリを検索して、WordPressサイドバーに特定の機能を追加できる無料またはプレミアムウィジェットプラグインを探すこともできます。 これらのプラグインのほとんどは、プラグインをアクティブ化するとウィジェットセクションで自動的に使用可能になるウィジェットを作成するだけです。
WordPressサイドバーに追加できるウィジェットプラグインにはいくつかの種類があります。 以下は、WordPressサイドバーに追加できる最も一般的なウィジェットのWordPressプラグインのリストです。
- ソーシャルメディアウィジェットプラグイン
- ログインおよび登録ウィジェットプラグイン
- 人気の投稿と最近の投稿ウィジェットプラグイン
- ショートコードウィジェットプラグイン
- メディアギャラリーとビデオウィジェットプラグイン
- 著者ウィジェットプラグイン
- 検索ウィジェットプラグイン
- eコマースウィジェットプラグイン
- 広告管理ウィジェットプラグイン
- カスタムコードウィジェットプラグイン
WordPressに付属しているデフォルトのウィジェットもあり、WordPressサイドバーに一般的な機能を追加するときに重要な役割を果たします。
例ソーシャルアイコンを追加してWordPressサイドバーを編集する
WordPressサイドバーにソーシャルアイコンを追加する場合、ソーシャルメディアアイコンを追加する最も簡単な方法は、ウィジェットオプションを使用することです。 実行する必要のある手順は次のとおりです。
- 良いソーシャルメディアアイコンウィジェットプラグインを探す
- ソーシャルメディアアイコンプラグインをインストールしてアクティブ化する
- [外観]メニュー> [ウィジェット]セクションに移動し、特定のソーシャルメディアプラグインウィジェットをサイドバーにドラッグして表示します。
- ソーシャルメディアリンクの追加などの設定を構成し、設定を保存します。
最高のサイドバーソーシャルメディアウィジェットプラグインの1つを追加して、実際の例を見ていきましょう。
最高のソーシャルメディアウィジェットプラグインを検索する
WordPressサイドバーを編集してソーシャルメディアアイコンを追加する最初のステップは、最高のソーシャルメディアアイコンプラグインを入手することです。
無料のSimpleSocial Iconsと呼ばれるこのプラグインを使用します。これは、WordPressリポジトリからダウンロードするか、WordPressプラグインのダッシュボードページに直接インストールできます。
ソーシャルメディアウィジェットプラグインをインストールしてアクティブ化する
プラグインをダウンロードしてプラグインディレクトリにアップロードするか、上の画像に示すようにダッシュボードページに直接インストールします。
インストールすると、アクティブ化ボタンをクリックすると、プラグインがアクティブ化され、ソーシャルメディアウィジェットをサイドバーに追加できるようになります。
ソーシャルメディアアイコンウィジェットをサイドバーに追加
ソーシャルメディアウィジェットをサイドバーに追加するには、下の画像に示すように、ウィジェットをサイドバーにドラッグアンドドロップするだけです。
そこにドラッグすると、下矢印を使用して開き、ウィジェットがサイドバーに表示される方法の構成を開始できます。
設定を構成し、変更を保存します
以下に示すように、カラー設定リンクと、サイドバーウィジェットプラグインごとに異なるさまざまな設定を構成できます。
変更を保存した後、フロントエンドにアクセスしてサイドバーに変更を表示すると、WordPressサイドバーの最初の編集が成功します。
これで、下の画像に示すように、ソーシャルアイコンが前面に表示されます。
#2)テーマオプションでWordPressサイドバーを編集する
WordPressサイドバーを編集する2つ目の方法は、テーマオプションを使用することです。 これは、プレミアムテーマのWordPressでサイドバーを編集する一般的な方法です。
現在インストールされているWordPressテーマに、テーマオプションからサイドバーを編集するオプションがあるかどうかを確認する必要があります。
ほとんどの場合、テーマオプションを使用すると、ユーザーはサイドバーのレイアウト表示を設定したり、カスタムウィジェットやコードを追加したりできます。
#3)カスタマイザーでWordPressサイドバーを編集する
WordPressでサイドバーを編集する3番目の方法は、デフォルトのテーマカスタマイザーを使用することです。 カスタマイザーは、以下に示すようにウィジェットを追加するオプションを提供する場合があります。
WooCoomerceのデフォルトテーマであるStorefrontの場合のように、サイドバーのレイアウトを設定するオプションもあります。
#4)コードでWordPressサイドバーを編集する
これは、WordPressサイドバーを編集する4番目の方法であり、複数のカスタムサイドバーの作成から、WordPressでのサイドバーの追加または削除、WooCommerce製品ページでのサイドバーの削除までの範囲のいくつかのカスタムオプションが含まれる場合があります。
結論
この記事では、最も単純なものから最も高度なものまで、WordPressサイドバーを編集するためのすべての可能な方法の概要を説明しました。 これは、WordPressサイドバーの編集を開始するための最良のガイドになるはずです。