サイドバーには、ブログの重要なコンテンツ紹介や商品の紹介など、アフィリエイトの肝になる場所です。
サイドバーをうまく利用することで、訪問者がさらに興味を持ちブログの中を見て回ってくれるようになります。
でも、長い記事をスクロールすると、サイドバーがスクロールに合わせ上に上がっていき、やがてサイドバーが見えなくなってしまいますよね?
言葉だけでは分かりづらいので下の画像を見てみてください↓
このようにスクロールに引っ張られてサイドバーがすぐに上がってしうと、せっかく作ったサイドバーを訪問者が見てくれる時間が減ってしまいます。
そうなるとサイドバーもなくただの空白になってしまいもったいないので、今回は下の画像のように少しでも目に留まる時間を作って無駄なくブログの情報を提供するようにしてみます。
スクロールにサイドバーがついてくるようにする方法
Simplicityにはこのような設定方法がありません。
なのでこの方法を行うには、「Standard Widget Extensions」というプラグインをインストールします。
Standard Widget Extensionsのインストール
「プラグイン」→「新規追加」と進み、「キーワード」に「Standard Widget Extensions」と入力します。
表示された中から、こちらのプラグインをインストールします。
インストールしたら、有効化しておきましょう。
Standard Widget Extensionsの使い方
「設定」の中に「Standard WE」という項目が増えていると思います。
これをクリックしてページに移動しましょう。
Simplicityのテーマを使用している場合は上の画像を参考にメインカラムのIDに「main」、サイドバーのIDに「sidebar」と記述しましょう。
「Sticky Sidebar機能を有効にする」を有効にすることで、サイドバーを追尾するようなります。
「Simplicity」以外のテーマを使用している場合、上の設定では出来ない場合があります。
メインカラムのID、サイドバーのIDを適用されているIDで設定する必要があります。
調べ方は、Chrome、FireFoxなどでブログを開き「F12キー」を押します。
分かりにくいかもしれませんが、メインカラムをクリックすることで生成しているHTMLコードを確認することが出来ます。
ここのIDを確認し、「メインカラムのID」に入力します。
サイドバーも同様です。
ここまで設定したら、プレビューで確認してみましょう。
上で紹介したように、ブログのスクロールに追尾してくるようになっています。
注意点
追尾するスクロールを使う上で注意点があります。
それは、Googleアドセンスを使用している場合、アドセンスの広告をスクロールとともに追尾するようにすることはポリシー違反になります。
なので、スクロールしてもとどまらない範囲にアドセンス広告を貼るようにしましょう。
また、アドセンス以外の他の広告であればOKです。
まとめ
以上がスクロールにサイドバーが追尾する方法でした。
プラグインを導入するだけで簡単に実装できるので、試してみてください!