インターネットでホームページを見ているとよく設定されている「スクロールするとついてくるサイドバー」があると思います。
実はこれ、WordPressのプラグインを使うことで簡単に設定できるんです。
今回はそんなサイドバースクロールの設定が簡単にできるプラグイン「Q2W3 Fixed Widget」の紹介と気をつけるべきポイントをまとめました。
◯Q2W3 Fixed Widgetのおすすめポイント
サイドバースクロールのプラグインというと一般的に「Standard Widget Extensions」が有名です。
このプラグインは「テーマ編集」の箇所からスクロールさせたい"id"を探す必要があります。
また、実際に使っていた方のブログでは「スクロールするとアイキャッチとタイトルが被ってしまった」という不具合を体験されている方もいらっしゃいました。
よって、「Standard Widget Extensions」はあまりオススメできません。
今回紹介する「Q2W3 Fixed Widget」であれば、管理画面のウィジェットからチェックボックスだけで設定を行うことができます。
ウィジェットにスクロールさせたいパーツを設定するには、そのパーツに表示されているチェックボックスにチェックを入れるだけでスクロールの設定が完了します。
それでは設定方法を見ていきましょう。
◯Q2W3 Fixed Widgetの設定方法
「Q2W3 Fixed Widget」はWordPressの公式プラグインですので、管理画面にある「プラグイン」から検索することができます。
「プラグイン」の「新規追加」を選択し、「Q2W3 Fixed Widget」を検索します。
見つかったらインストールし、有効化します。
まずはじめに設定しなければならないのは、サイドバーの項目がフッター部分まで行った際に被らないようにする設定です。
こちらの設定は「外観」の「Fixed Widget Options」からできます。ここで設定すべき項目は余白設定となります。
・Margin Top
・Margin Bottom
・Refresh Interval
・Screen Max Width
それぞれの項目を説明します。
・Margin Top
スクロールする部分トップの余白を設定します。基本的にはデフォルト設定で問題ありません。
・Margin Bottom
スクロールする部分下部の余白を設定します。
この部分の幅をフッターと被らない数字にしておくことで、サイドバーのスクロールとフッターが被ることがなくなります。
どの程度の数字にするかはフッターウィジェットを使っているかどうかなどによっても変わってきます。
・Refresh Interval
こちらはリフレッシュの間隔です。
特に設定を行う必要はありません。
・Screen Max Width
ここで設定した値よりブラウザの幅が小さい場合はスクロールしないようにする設定です。
ここの値は「1,000」前後に設定をしておくことで、スマートフォンで閲覧した際にフッターメニューと被ってしまうという不具合を防ぐことができます。
以上の設定が完了したら、「外観」から「ウィジェット」を開きます。
各パーツにチェックボックスがついていますので、自分がスクロールさせたいパーツのチェックボックスにチェックを入れれば設定完了です。
このスクロール箇所に広告を入れて、記事を読んでいる時間ずっと広告に追尾させるということも可能です。
ですが、各広告の規約によってはスクロールする箇所に設定してはいけないものもあります。
その一例として今回はGoogle Adsenseを紹介させていただきます。
・サイドバースクロールにAdsenseを設定してはいけない理由とは
Google Adsenseの「広告掲載に関するポリシー」にあります「Adsense広告コードの修正」を見ていただくと、スクロールに設定してはならない理由が書いてあります。
ここでは下記の行為が禁止されています。
禁止されているコードの改変方法
AdSense コードを以下の方法で改変することは禁止されています。
・display:none などを使用して広告ユニットを隠す（ただし、レスポンシブ広告ユニットを実装している場合を除く）
・コンテンツが隠れてしまうような方法、またはコンテンツが広告を覆い隠すような方法で AdSense 広告コードを設定する
・モバイルサイトやレスポンシブ デザインのサイトでコンテンツと広告が重なるような方法で広告ユニットを配置する
・なんらかの方法で 1 ページに 4 つ以上の AdSense 広告ユニットを表示する
・非表示キーワード、iframe、その他の方法を使用して広告のターゲット設定を操作する
・メールやソフトウェアで広告を配信する
・広告の配信方法や表示方法を操作して不当に注目を集める（画面内にスライドイン表示される広告、ズームイン / ズームアウトされる広告など）
特に最後の「不当に注目を集める」の「画面内にスライドイン表示される広告」がサイドバースクロール禁止にかかる部分となっています。
Adsenseは特に規約が厳しい広告です。
他の広告の場合でも規約を読んで、規約違反にならないように使用していきましょう。
○まとめ
以上がサイドバースクロールの設定が簡単にできるプラグインのご紹介でした。
それぞれのサイトでアピールしたいことは違うと思いますが、うまくサイドバースクロールを利用することで滞在率を上げる・SNSでの拡散を促す等の効果を得ることができます。
常に最適化することを考えながらサイト運営をしていきましょう。