parachute-i

前作のテーマでは、このスクロール追尾型のタブをjavaScriptを読み込んでごにょこにょして設置していました。

ただ、全力レスポンシブデザインに今回変更した為、スクロール追尾型のタブはやめたのですが、このプラグインは

なんと!!

レスポンシブWebデザインに対応しているのです!!

Standard Widget Extensions

Standard WE

『Standard Widget Extensions』の導入

  • プラグイン検索で Standard Widget Extensionsと入力すると表示されるので、インストールして有効化する。

『Standard Widget Extensions』の使い方

プラグインをインストール後、有効化されると管理画面左側のメニュー内[設定]にStandard WEと表示されますので、そこをクリックして進み変更を加えます。

設定

Sticky Sidebar (スクロールが止まるサイドバー)を使う場合は、変更を加えるのは3つ。

Standard WE-2
  • 1.メインカラムの ID:スクロールさせる範囲のIDを入力します。

例えばこのブログではmainの中にサイドバーがあり、mainの中でスクロールさせたいのでmainと入力。

Scope
  • 2.サイドバーの ID:スクロールさせたい部分のIDを入力します。

サイドバー全体をスクロールさせたければそのIDを、一部のコンテンツだけを動かしたいのであればそのコンテンツのIDを入力します。

このブログのサイドバー最後にあるタブ部分のみをスクロールさせるのであれば、タブのID:secondaryを入力となります。

Standard WE-3
  • 3.Sticky Sidebar 機能を有効にする:有効にします。

レスポンシブ Web デザイン対応!

ウィンドウ幅が指定された値より小さくなると機能が無効化されます。

左上にあるボタンShow Expert Optionsを押します。

Standard WE-1

すると、次の幅以下で無効化という項目が表示されるのでそこへ数値をいれます。

Standard WE-4

最後にSaveChangesを押して完了です。

この他にも、Accordion Widget (開閉するウィジェット)という機能がありますが、このブログにウィジェット機能をつけていなのでメンド。。試すことができません。。

詳細などプラグインの作者さんのブログへ。(作成者さんは日本の方です。)

簡単な設定できれいにサイドバーについてくるようになるので、スクロール追尾型コンテンツを設置したいと思っている方はぜひ試してみてください。

ADVERTISEMENT

Author:

follow FacebookPage

当ブログがお気に召しましたら是非いいね!をお願いします!

Follow Me

閲覧頂きありがとうございました:)

Message

トップへ戻る