かんぺき!画面のスクロールに付いてくるサイドバーならStandard Widget Extensionsが最高だった件

多くのオサレブログで採用されている画面のスクロールに付いてくるサイドバー。

長いエントリーなどの場合一定のところまで画面をスクロールするとサイドバーが固定されて追随するようにしたかったの。

そこで、以前まではStrx Floating Sidebar Settingsってプラグインを使ってました。

WordPressで画面のスクロールに追随するサイドバー(ウィジェット)を実現するプラグイン

Strx Floating Sidebar Settingsもそれなりに満足して使ってたんだけど、時々アニメーションの動きがおかしかったり、スクロールに追随はするものの要素が画面外に飛び出してしまったりと若干の挙動に不満があったんですよね・・・

そこで見つけたのがStandard Widget Extensionsです!


         ____
        /⌒  ⌒\
      / (⌒) (⌒)\   納得だおww
     /  ::⌒(__人__)⌒::: \
     |       |::::::|   ,—、
     \       `ー’   しE |
     /           l、E ノ
   /            | |
   (   丶- 、       ヽ_/
    `ー、_ノ

このStandard Widget Extensionsってプラグインはサイドバーをエレベーターのようにスクロールに追随させるだけじゃなくて、サイドバーの要素を折りたたんだりすることもできるんだけど、とりあえず私は折り畳みは不要なので、エレベーターだけ使っています。

Standard Widget Extensionsの設定

インストール~有効化に関しては、Wordpress管理画面の「プラグイン」>>「新規追加」でプラグインの検索窓に【Standard Widget Extensions】で検索すればOKです。

もしもダウンロードしてFTPでアップしたいのなら下のリンクからどうぞ。

Standard Widget Extensions « WordPress Plugins

インストール~有効化後にWordpressの管理画面に「設定」>>「Standard WE」をクリックすると下記のような設定画面になります。

Standard WE

ここでイロイロ設定項目があるんですけど、Wordpressのデフォルトテーマである「Twenty Twelve」「Twenty Eleven」などを使っている場合は殆ど設定する必要がありません。

まずはじめに「General」の部分を設定していきましょう。

3か所入力窓がありますけど、今回はアコーデオンは使わないので「ID of Your Main Column」と「ID of Your Sidebar」だけ入力すればOKです。

General

殆ど設定項目はStrx Floating Sidebar Settingsと同じなんですけど、「ID of Your Main Column」には今現在使用しているWordpressテーマのメインカラムがどんなCSSのIDで囲まれているのかを入力します。

同じく「ID of Your Sidebar」にはサイドバー全体を囲むCSS IDが何なのかを入力します。

3つ目の窓に「Class of Widgets」がありますけど、アコーデオンを使わないのなら入力は不要ですし、使うのであれば個々のサイドバーウィジェットを囲むCSSのクラスを入力しておきます。

次に「Accordion Widgets」の設定項目です。

Accordion Widgets

ココはアコーデオンを使うのであればAccordion Widgetsの設定を「Enable」にしますが、今回私はアコーデオンを使わないので「Disable」を選択します。

次に「Sticky Sidebar」の設定項目です。

ココは当然「Enable」のままにしておきます。

Sticky Sidebar

ここでの設定項目にはEnableとDisableの選択以外に「Disable if the window width is less than」というデフォルトで「620」と入力された窓がありますけど、これはブラウザのウインドウサイズの横幅が指定された数値以下になった場合に効化をキャンセルさせるためのものです。

以上の設定項目を入力出来たら【Save Change】をクリックして出来上がりです!

最後に・・・

とても素晴らしいプラグインを作ってくださった作者様に感謝するばかりです!!

WordPress 用プラグイン Standard Widget Extensions を公開しました | Hetarena.com


            ___
          / ⌒  ⌒\   __
        / (⌒)  (⌒) \〈〈〈 ヽ うはww
      /   ///(__人__)/// 〈⊃  }
      |   u.   `Y⌒y’´     |   |
     \       ゙ー ′   ,/   /
     /⌒ヽ   ー‐    ィ     /
     / rー’ゝ           /
    /,ノヾ ,>         /
     | ヽ〆         |

ありがとうございます!!



いいよね?

最後まで私の拙いエントリーを読んでいただいてありがとうございます!
もしもこの記事が少しでもあなたのお役に立てたなら、ぜひ「いいね!」していってください。
また何か新しい発見をお届けできるかもしれません。

何か見つかるかもね

関連記事

コメント

※コメントは承認制ですので、表示されるまで時間がかかる場合があります。

  1. ご紹介ありがとうございます。私の力不足でなかなか宣伝できていないので、こうして取り上げていただけるととても嬉しいです。ご要望なども気軽にどうぞ。

    リビジョン管理のためのプラグインもつくってますので、もし興味があればチェックしてみてください。 http://hetarena.com/archives/1595

    • まったり
      • まったり
      • 2013年 2月 05日


      blogger323さん、コメントありがとうございます!!

      ご本人様からコメントを頂けるとは思っていなかったので感激です!
      blogger323さんの記事でも少し書かれていましたけど、スクロール関連のプラグインってなかなか思うように出会えないんですよね・・・

      でも、おかげさまで満足な挙動をするようになりました!

      また今回のコメントでご紹介していただいているリビジョン系プラグインもチェックしますね。


  2. 記事を参考にプラグインを追加しました。
    分りやすい記事ありがとうございます+.゚(*´∀`)b゚+.゚

    • まったり
      • まったり
      • 2013年 3月 01日


      ども、コメントありがとうございます!

      私の拙いブログなどでお役にたてれば幸いです~

*

オススメ鯖


高速かつ高機能で、しかも安定性抜群!!
私も利用させていただいてますわ

My Tumblr

    http://deltablog01.tumblr.com/post/77273138691http://deltablog01.tumblr.com/post/76325997079http://deltablog01.tumblr.com/post/75899137417http://deltablog01.tumblr.com/post/75253777050

BlogParts

あわせて読みたい

Share Me! Please!!!

このエントリーをはてなブックマークに追加
ページ上部へ戻る