【blogger】QooQのサイドバーを追従させる設定をわかりやすく紹介!
bloggerのテーマ「QooQ」を利用していて、サイドバーを追従させることはできる?
可能です!しかも簡単にできるので、すぐにできますよ!
本当に!?
この記事ではbloggerのテーマ「QooQ」を利用していて、サイドバーを追従させる設定を紹介します。
- サイドバーを追従させる方法
【blogger】QooQのサイドバーを追従させる方法
ブログをしていて、サイドバーの右側の部分がなくて、なんかもったいない!
と感じているのではないでしょうか。
ほかの人のブログを見ていると、サイドバーがくっついてきて、おしゃれだな!
と僕も感じていました。
下にスクロールしていくと、右側が真っ白になっていく・・・。
そんな中で、どうにかbloggerのQooQでもサイドバーを追従する方法はないかと調べていました。
サイドバーを追従するにあたって、参考にしたサイトは「ふじろじっく」さんの記事を参考にしました。
くわしく知りたい人はこちらのふじろじっくさんの記事を見てくださいね。
それでは、サイドバーを追従させる方法を紹介します。
#sub-content {
display: flex;
}
#sub-content .widget:last-child {
position: sticky;
top: 0;
引用:ふじろじっく
上に書かれている文字をコピーしてください。
こちらの文字をコピーしたら、「CSSを追加」にペーストしてください。
- CSSを追加させる方法(初心者用)
-
- テーマから「カスタマイズ」を選択して、詳細設定を開く
- 「文字の変更」を選択
- 「CSSを追加する」を選択
これで、サイドバーが追従するようになります。
めちゃくちゃ簡単だね!
はい!こちらのコードを考えてくれた「ふじろじっく」を運営しているふじやんさんに感謝ですね!
さいごに
今回は、bloggerのQooQでのサイドバーの追従方法を紹介しました。
サイドバーをおしゃれにしたい!という人にはおすすめです。
CSSを追加するだけなので、ブログ初心者でもできます。
サイドバーはブログの記事を読んでもらっているときに、必ず目を通す場所です。
サイドバーをおしゃれに、実用的にしてブログ読者を増やしましょう!