- ページ毎にサイドバーの内容を変更することができる。
例えば、特定のカテゴリー別に個別の内容をサイドバーに表示できる。 - 表示する内容までは指定できない（例えば、特定のカテゴリーのメニューを指定するとかはできない）
目次
ウィジェットで指定できるページの例
- トップページ
- 検索結果ページ
- 404ページ
- 全ての投稿（Post）
- 個別の投稿（Post）
- 全ての固定ページ（Page）
- 個別の固定ページ（Page）
- メディアライブラリ
- 全ての投稿者ページ
- 個別の投稿者ページ
- 全てのテンプレート
- 個別のテンプレート
- 全てのカテゴリ
- 個別のカテゴリ
- 全てのタグ
- 個別のタグ
Content Aware Sidebarsプラグインのインストール
Content Aware Sidebarsをインストールする。
「新規追加」から始める
Content Awareから新規追加
このタイトルを入れる。最初説明のときは入れる事ができないが後でも入れることができる。
最初に説明から始める場合
このプラグインの使い方を簡単に説明されている。
Choose from the extensive Display Conditions with built-in support for other plugins. You will never be asked to enter widget logic PHP code!
Select anything to continue the tour. You can change it later.
他のプラグインのサポートが組み込まれた広範な表示条件から選択します。 ウィジェット ロジックの PHP コードの入力を求められることはありません。ツアーを続行するには、何かを選択してください。 後で変更できます。
左のNew condition groupからカテゴリーを選択。今回はカテゴリー別にカスタマイズしたいので「カテゴリー」を選択します。
ここではどのようなページを設定するのかを決定する。
Click on the input field and select the content you want – just type to search. Changes are saved automatically!
You can add multiple content types to the same group. Try e.g. “All Posts” and an Author to display on all posts written by that author.
Learn more about AND vs OR conditions
入力フィールドをクリックして必要なコンテンツを選択し、入力するだけで検索できます。 変更は自動的に保存されます。
複数のコンテンツ タイプを同じグループに追加できます。 たとえば、試してみてください。 「すべての投稿」とその作成者によって書かれたすべての投稿に表示される作成者。
AND 条件と OR 条件の詳細については、こちらをご覧ください。
カテゴリーの中から「FlyWithLua」を選択。
選択が完了した画面。
Actionの説明。そのまま「次へ」をクリック。
Replace any sidebar or widget area in your theme, or add widgets by merging with them.
You can also use the shortcode to display widgets inside a page or post.
テーマ内のサイドバーまたはウィジェット領域を置き換えたり、ウィジェットをマージしてウィジェットを追加したりできます。
ショートコードを使用して、ページまたは投稿内にウィジェットを表示することもできます。
Designの説明。そのまま「次へ」をクリック。
Personalize the styling without writing any code!
You can modify the HTML and CSS classes of the widget area itself, each widget, as well as widget titles.
コードを書かずにスタイルをカスタマイズしましょう!
ウィジェット領域自体、各ウィジェット、およびウィジェットのタイトルの HTML および CSS クラスを変更できます。
Schedule（スケジュール）の説明。そのまま「次へ」をクリック。
Create a widget area and manage its widgets today, then publish it when you are ready.
To schedule automatic activation or deactivation, just pick a date and time!
By default, new widget areas will be activated when created.
今すぐウィジェット領域を作成して管理し、準備ができたら公開します。
自動アクティブ化または非アクティブ化をスケジュールするには、日付と時刻を選択するだけです。
デフォルトでは、新しいウィジェット領域は作成時にアクティブになります。
「Finish Tour」をクリック。「閉じる」を最後にクリック。
Hit the Create button to save your first custom widget area.
If you need more help, check out the links below.
「作成」ボタンを押して、最初のカスタム ウィジェット領域を保存します。
さらにヘルプが必要な場合は、以下のリンクを参照してください。
すべて完了したら「生成」をクリック。
選択したカテゴリーのサイドバーのみに表示するウィジェットの作成
すでにConditionsではカテゴリーからFlyWithLuaを選択している。
Actionでは「結合」を選択。
Action
- 置換: サイドバーを置換。
- 結合: すでにあるサイドバーに結合。（検索と最近のコメントが表示されなくなった。何か間違っているかも）
- 強制置換: すでに置換しているサイドバーを強制的に置換。
- Shortcode: ショートコードの生成。
Target Sidebar
どのサイドバーを目標にするか指定。
結合位置
Actionを結合に指定した場合の結合位置を指定できる。
最後は上部を選択。
ここまでいったら「生成」をクリック。下部となっているが、この後でも生成し直すことができる。
ウィジェットの設定
ウィジェットで簡単に設定できます。画像はテキストを追加しました。
外観→ウィジェット
ウィジェットに 「Content Aware」で設定した「FlyWitLuaカテゴリーメニュー」 ができています。
試しにカレンダーを入れて見る。右上の「更新」をクリック。
これで、カテゴリー「FlyWithLua」の 右のサイドバーだけの上に表示される。指定したカテゴリーに関するページにはすべて表示される。
他のページには表示されていないことを確認してみる。
Designeタブ
説明：https://dev.institute/wordpress-sidebars/features/custom-markup-css-styles/
コンテンツ認識サイドバーを使用すると、コーディングなしでウィジェットやウィジェットタイトルのマークアップとCSSクラスを簡単に変更できます。作成したサイドバーやウィジェット領域にラッパー要素を追加することもできます。
この機能は非常に強力で、テーマサイドバーのデザインを完全に制御して上書きすることができます。テーマのCSSスタイルを活用して、ウィジェットエリアを完璧に際立たせましょう。
ウィジェットのマークアップをdivからsectionに変更し、ウィジェットのタイトルのh2、h3、またはh4から選択します。ラッパー要素を追加し、テーマからCSSクラスを与えて、モバイルデバイスのサイドバーを非表示にします!
ネストされたウィジェットエリアのウィジェットスタイリング
コンテンツアウェアサイドバーでは、テーマサイドバーを置き換えるだけでなく、テーマサイドバーを置き換えるサイドバーを置き換えることもできます。混乱しているように聞こえますか?それは実際には非常に簡単です:あなたは条件付きで任意のウィジェット領域を置き換えることができます、また、プラグインで作成したものも!
これはネストされたウィジェットエリアまたはサイドバーと呼ばれ、カスタムウィジェットマークアップ機能と組み合わせることができます。
特定のウィジェット領域に設定したマークアップとスタイルは、置き換えるウィジェット領域に自動的に適用されます。したがって、ネストされたサイドバーを備えた複雑な設定がある場合は、スタイルを一度設定するだけで済みます。
このウィジェットのマークアップ機能は強力だと言いましたか?
以下はデフォルトのサイドバーに入れたDesigneタブを何も設定していない状態。
asideタグは HTML の要素で、文書のメインコンテンツと間接的な関係しか持っていない文書の部分を表現します。サイドバーやコールアウトボックスなどを表現するためによく使われます。
class＝”%2$s”でウィジェット名（既定）が入る、これは決まり事に成る。
上の設定だタグ名が変更される。これでこのサイドバー特有のスタイルを設定できる。
しかし、上のデフォルトの設定でCSSを変更してもいいのかなとも思う。
このStyleの下にもDesignがあるがこれは有料版になる。