スクロールしてもサイドバーを固定して表示する方法

子テーマのCSSか、追加CSSに以下を追記します。

#secondary {
  position: sticky;
}

コンテンツが十分にあって、左カラムが右カラムより長い時に、短い右カラムがスクロールについてきます。コンテンツが短くて、左カラムが右カラムより短いと、単純に全体がスクロールするだけで、特に変化が無いように見えます。

以下のようなことができます。

  • サイドバーで常に検索窓を表示しておきたい
  • サイドバーで常に最新の記事一覧を表示して他のページにも誘導したい
  • サイドバーで常にカテゴリの一覧を表示しておきたい

なお、広告などをサイドバーに表示している場合、Google AdSenseなど表示している広告のルールによってはスティッキーな広告表示が禁止されていることがあるので、要注意です。

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です