Q2W3 Fixed Widgetの設定方法|WordPressサイドバーを追尾させる3ステップ

サイドバーのウィジェットをページスクロールに合わせて追尾させたいなら、「Q2W3 Fixed Widget」プラグインが最もシンプルな解決策です。設定ステップが少なく、WordPressに慣れていない方でもすぐに導入できます。

Q2W3 Fixed Widgetのインストール手順

管理画面の「プラグイン > 新規追加」を開き、検索欄に「Q2W3 Fixed Widget」と入力します。表示されたプラグインを「今すぐインストール」でインストールし、続けて「有効化」ボタンを押して完了です。

Q2W3 Fixed Widgetのプラグイン検索画面

サイドバーウィジェットに追尾を設定する

有効化が終わったら「外観 > ウィジェット」に進んでください。サイドバーに配置済みのウィジェットを開くと、設定項目の末尾に「Fixed Widget」というチェックボックスが追加されています。チェックを入れて「保存」すると、そのウィジェットがスクロールに連動して追尾するようになります。

ウィジェット設定画面のFixed Widgetチェックボックス

フッターと重なるときの対処法

テーマの構造によっては、スクロール中のウィジェットがフッター上に重なって表示されることがあります。「外観 > Fixed Widget 設定」を開き、「一般設定」内の「下マージン」フィールドにフッターの高さをピクセル単位で入力すると、ウィジェットがフッター手前で停止するようになります。

フッターにウィジェットが重なっている状態の例
Fixed Widget設定の下マージン入力欄

フッターの高さをChromeで確認する方法

フッターの高さが不明な場合は、ChromeのデベロッパーツールをF12キーで開くと便利です。ツールを開いた状態でブラウザウィンドウの高さを上下に変化させると、右上にリアルタイムで縦横サイズが表示されます。フッターの上端に画面下端を合わせた時点の数値がそのままフッター高さの目安になります。

Chromeデベロッパーツールでブラウザサイズをリアルタイムで確認している画面

IDを指定してフッター手前で追尾を止める方法

「Fixed Widget 設定」の「停止ID」欄に、フッター要素のHTML IDを入力する方法もあります。たとえばフッタータグに id="footer" が設定されているなら「footer」と入力するだけです。ピクセル指定よりも精度が高く、テーマのHTMLにIDが割り当てられている場合はこちらを優先的に使うとよいでしょう。

スマホでデザインが崩れないようにする設定

レスポンシブテーマでは、スマホ表示の際に追尾ウィジェットがレイアウトを崩してしまうことがあります。「Fixed Widget 設定」の「幅を無効化」欄に、PCとスマホの切り替えが発生するブレークポイントの幅を入力すると、その幅以下の画面では追尾が自動的に無効化されます。

ブレークポイントの確認にも前述のChromeデベロッパーツールが使えます。ウィンドウ幅を徐々に狭めていき、レイアウトがスマホ向けに切り替わった瞬間の幅を読み取って入力してください。

スマホ表示でウィジェットが崩れている例

AdSense広告への適用は禁止

Google AdSenseのポリシー上、広告ユニットをページに固定してスクロールに追尾させることは原則として禁止されています。サイドバーにAdSenseウィジェットを配置している場合は、そこに「Fixed Widget」を適用しないよう注意が必要です。違反が検知された場合、広告の配信停止やアカウント停止につながるリスクがあります。

まとめ:3ステップで完了するサイドバー追尾設定

Q2W3 Fixed Widgetは、プラグインのインストール・ウィジェットへのチェック・フッター対策の3ステップで設定が完了します。プロフィールや人気記事一覧など、読者にずっと見ていてほしいコンテンツを追尾させることで、サイドバーの活用度を高められます。スマホ対応とAdSenseへの非適用だけ意識しておけば、安定して運用できるプラグインです。

このテーマの関連記事はこちら