プラグイン

ワードプレスのサイドバーを固定・追従させる方法は?プラグインで解決!

将軍
将軍
こんにちは!将軍です!

ワードプレスのブログやサイトで記事を書いている際に、文字数が思った以上に多くなってサイドバーが寂しい・サイドバーに何も表示されていないなんてことがないでしょうか。

ワン太郎
ワン太郎
こんな感じだね。

この何もないサイドバーの空間に、新しく投稿した記事やその記事の目次、自分のお気に入り・見てほしい記事などを、固定・追従させることで、訪問してくれた方にアピールすることができます。



この記事では、サイドバーに指定したものを簡単に固定・追従させることができるプラグイン『Q2W3 Fixed Widget』の使い方を図解解説をしています。

『Q2W3 Fixed Widget』のインストール・有効化

まずは『Q2W3 Fixed Widget』のインストール・有効化作業を行います。プラグインは下の画像のものになります。

WordPress管理画面→プラグイン→新規追加→右上に『Q2W3 Fixed Widget』を入力→今すぐインストール→有効化の順で進めていきましょう。

『Q2W3 Fixed Widget』を使うと?

『Q2W3 Fixed Widget』を使う前は何もない空間が記事の下まで続きますが..



設定後はこのように固定・追従させることができます。

私のブログでは新しい投稿を固定・追従させていますが、読んでもらいたい記事や目次などを表示させるのも効果的だと思います。

皆さんのブログ、サイトに合ったものを選んでカスタマイズしてみてくださいね。

『Q2W3 Fixed Widget』の設定

『Q2W3 Fixed Widget』での固定方法はとても簡単です。

管理画面の外観から『ウィジェット』にむかったら、固定させたいものを開いて、下の画像で言う『Fixed widget』にチェックをいれるだけで完了になります。

とても簡単なのですが、気をつけなけらばならない点がカスタマイズをしているサイドバーの項目の一番下のウィジェットを固定させないと、他のサイドバーに設置をしているウィジェットに重なってしまう点です。



もう1つ気をつけたい点は、複数のウィジェットを固定させる・大きなサイズのウィジェットを固定させる場合です。そのウィジェットの大きさによっては、固定させても画面にうまく入りきらない場合があります。

将軍
将軍
確認をしながら設定をしてみてくださいね。
  • サイドバーの項目の一番下のウィジェットを固定させないと重なってしまう
  • 複数のウィジェットを固定させる・大きなサイズのウィジェットを固定させる場合は、画面にうまく入りきらない場合がある

『Q2W3 Fixed Widget』の調整

続いて『Q2W3 Fixed Widget』の調整を行います。

固定されているか確認をしてみると、その固定させたウィジェットが画面上の方で見切れていたり、そのままスクロールさせていくとフッター(サイトの下部分)』に重なってしまう状態になると思います。

ワン太郎
ワン太郎
ほんとうだ!どうやって調整をするの?

『Q2W3 Fixed Widget』の調整は、管理画面の外観から『Fixed Widget設定』にある『一般設定』から行うことができます。

この画面にある上・下マージンの項目に『100px』のように値を入れて調整をします。

『上マージン』は、固定させたウィジェットの上部の間(余白)を調節します。参考までにこのブログの上マージンは『15px』に設定をしています。

同じように『下マージン』は、固定させたウィジェットがフッターに重ならないように(余白を)調節します。『100px~200px』あたりで調節をしてみえばうまいところで調節ができると思います。

『Q2W3 Fixed Widget』の他の調整

『Q2W3 Fixed Widget』の他の設定についても見ていきます。

上マージン 固定させたウィジェットの上部分の余白を調節します。
下マージン 固定させたウィジェットの下部分の余白を調節します
停止ID 下マージンの設定を『px』ではなく、『ID』で指定をして調節をします。例えば、フッターのIDを入力することで、フッターには重ならないように設定ができます。調べ方は、トップページを開いて右クリックをして『ページのソースを表示』をクリック後に、検索ボックスに『footer』と入力をします。そこに記されている『footer id』がフッターのIDになります。場所が少し分かりづらいかもしれませんが、『id=””』の部分がおそらくIDだと思います。
更新間隔 そのままで大丈夫です。
幅を無効化 モバイル端末で見る場合にプラグインを無効にする機能です。ブラウザの画面幅が指定された値より小さい場合にもプラグインは無効になります。設定では横幅のサイズはスマートフォン対応の『750px』に設定をしておきましょう。
高さを無効化 上のものの『高さ』での設定になります。

まとめ

『Q2W3 Fixed Widget』は簡単にサイドバーにあるウィジェットを固定させることができるので、CSSでの編集ができなくても、設定ができるのでとても便利ですね。

ただ、サイドバーの項目の一番下のウィジェットを固定させないと重なってしまう点や、複数のウィジェットを固定させる・大きなサイズのウィジェットを固定させる場合は、画面にうまく入りきらない点は気をつけてくださいね。画面を確認しながら設定をしていきましょう。

  • サイドバーの項目の一番下のウィジェットを固定させないと重なってしまう
  • 複数のウィジェットを固定させる・大きなサイズのウィジェットを固定させる場合は、画面にうまく入りきらない場合がある