サイドバーがついてくる - Standard Widget Extensions -

スクロールとともにサイドバーがついてくる – Standard Widget Extensions 使い方

Standard Widget Extensions

Pocket

Standard Widget Extensionsとは

Standard Widget Extensionsとはページの下部へ画面をスクロールしても、サイドバーがついてくるように設定できるプラグインです。サイドコンテンツを充実させると滞在時間が長くなるといわれていますが、サイドバーが短いと記事を読み終わった時にサイドバーが隠れて見ることができません。
そんなときに、見てほしいサイドコンテンツが定位置で止まってくれれば最後まで表示することが可能です。

Standard Widget Extensions をインストール

プラグインのインストール画面に移動

プラグインのインストール画面に移動

WordPressの管理画面・ダッシュボードを表示します。左側のメニューの一覧から プラグイン > 新規追加 を選びプラグインのインストール画面に移動します。

Standard Widget Extensions を検索する

Standard Widget Extensions を検索する

プラグインのインストール画面に移動したら、検索窓に「Standard Widget Extensions」と入力し プラグインの検索 をクリックします。WordPress プラグインディレクトリ からプラグイン「Standard Widget Extensions」を自動的にインストールできます。

Standard Widget Extensionsのインストール

Standard Widget Extensionsのインストール

プラグインのインストール画面で検索結果が表示されます。検索結果の一覧の中から「Standard Widget Extensions」を探し、 いますぐインストール をクリックします。現在の最新バージョンは Standard Widget Extensions バージョン 1.7.4 です。

プラグイン:Standard Widget Extensionsの有効化

プラグイン:Standard Widget Extensionsの有効化

プラグイン Standard Widget Extensions のインストールが完了しました。インストール完了時に表示された画面の プラグインを有効化 をクリックし、プラグイン:Standard Widget Extensions を有効にします。


プラグイン:Standard Widget Extensions が有効化されました

プラグイン:Standard Widget Extensions が有効化されました。有効化をクリックするとプラグイン:Standard Widget Extensions が有効化され、「インストール済みプラグイン」の画面が表示されます。プラグイン:Standard Widget Extensions が有効化された状態で表示されています。

Standard Widget Extensions の基本設定

Standard Widget Extensions の設定画面へ移動

Standard Widget Extensions の設定画面へ移動

WordPressの管理画面・ダッシュボードを表示します。左側のメニューの一覧から 設定 > Standard WE を選び Standard Widget Extensions の設定画面に移動します。

Standard Widget Extensions の一般設定

Standard Widget Extensions の一般設定

メインカラムのID

ブラウザでソースコードを表示するかテンプレートファイルからメインカラム(記事が表示されている部分)のIDを調べて入力します。Twentyfourteen では初期値のまま primary を入力します。

サイドバーのID

ブラウザでソースコードを表示するかテンプレートファイルからサイドバーのIDを調べて入力します。Twentyfourteen では初期値のまま secondary を入力すると、左側のサイドバーが追尾します。右側のサイドバーのみ追尾させたい場合は content-sidebar と入力します。

ウィジェットのクラス名

ウィジェットのクラス名は初期値のままで問題ありませんが、任意のウィジェットの場所で停止させたい場合はウィジェットのクラス名を調べて入力します。

Accordion Widget 機能を有効にする

有効にするとウィジェットが閉じた状態で表示されます。ウィジェットのタイトルをクリックするとアコーディオンのようにウィジェットが開きます。最初から表示させたい場合は 無効 にします。

Sticky Slidebar 機能を有効にする

サイドバーの追尾機能を有効にする場合は 有効 を選びます。

Quick Switchback 機能を有効にする

コンテンツのスクロールを戻した場合にサイドバーが一番上に戻る機能(Quick Switchback)を有効にする場合は 有効 を選びます。

Standard Widget Extensions の詳細オプションを表示

Standard Widget Extensions の詳細オプション

詳細オプションを表示 をクリックすると詳細オプションが表示されます。

Standard Widget Extensions の詳細オプション – According Widget

Standard Widget Extensions の詳細オプション - According Widget

デフォルト CSS を生成する

開閉ボタンを指定したときはデフォルトでCSSが生成されます。テーマのstyle.cssで指定したい場合は 無効 にしますが、通常は 有効 でいいでしょう。ただし、カスタムウィジェットセレクターを用いたときは生成さません。テーマのstyle.cssで指定してください。

同時に一つのウィジェットだけ伸ばす

これを有効にすると、一つのウィジェットを開けたら他の開いているウィジェットが閉じます。

伸縮時間 (ms)

ウィジェットアコーディオン開閉時のアニメーション時間をミリ秒単位で指定します。

見出し用セレクター

開閉動作をさせるためにクリックするウィジェットクラス内の要素を指定します。 この要素をクリックするとその次の要素が開閉します。

次の ID を持つウィジェットエリアのみで有効

サイドバーのIDではなく、各ウィジェットのIDを直接指定してアコーディオンで開閉するウィジェットを設定します。

カスタムウィジェットセレクター

カスタムウィジェットセレクターはIDおよびclassを直接入力します。 これを入力すると規定のセレクターはキャンセルされ、この欄に入力したセレクターのみが有効となります。

Standard Widget Extensions の詳細オプション – Sticky Sidebar

Standard Widget Extensions の詳細オプション - Sticky Sidebar

Sticky Slidebar機能とはスクロールにあわせて、サイドコンテンツが追尾してきてくれる機能をさします。
Quick Switchback機能とはスクロールを中止し、逆戻りした際に、追尾してきていたサイドコンテンツを含むサイドバーがトップに戻る機能をさします。

再計算タイマー (単位:秒、0=無効)

コンテンツサイズの再計算のタイミングを指定します。このオプションを指定することで、他ライブラリの終了を見計らって指定秒後から再計算を始めます。通常はDefault値の5秒を設定します。

フッターを無視 (無限スクロール時)

フッターが来たら再度スクロールし始める動作を無効化します。無限スクロール時は 有効 にしましょう。

幅のパーセント指定 (CSS と合わせる。固定は 0)

レスポンシブなWデザインを採用している場合で、サイドバーの幅をCSSファイル内で で指定されているときに、そのパーセント値をここに入れてください。ブラウザのリサイズ時も期待通りのサイドバー幅となります。

次の幅以下で無効化

レスポンシブなWデザインを採用している場合、横幅が小さくなったときにサイドバーの位置が変化することが多いと思います。ここで指定された幅以下で Standard Widget Extension の Sticky Sidebar機能を無効化することができます。Sticky Sidebar機能を無効にしたくない場合は を入れておいてください。Twentyfourteen では 1008 に設定すると良いでしょう。

第二サイドバーの ID

サイドバーが2つあって、その2つともSticky Sidebar機能を有効化する場合に二番目のサイドバーのIDを入力します。Twentyfourteen では content-sidebar を入力すると、右側のサイドバーが追尾します。

第二サイドバー幅のパーセント指定

特に指定せず初期値のままで構いません。

第二サイドバーを次の幅以下で無効化

特に指定せず初期値のままで構いません。特定の幅以下になったらSticky Sidebar機能を無効化させたい場合には、幅のピクセル数を入力します。