てがろぐ
期間限定の第2試験版
No.53
画像の拡大表示に使われるスクリプトをLightbox以外に設定できるようになった Ver 3.2.4（β版）の動作テスト。ここではFancyboxで表示される設定にしてあります。
必要な設定箇所は、以下の3点。
➊管理画面の[設定]→[システム設定]→【画像拡大スクリプトの選択】→『他のスクリプトを使う』をONにした上で、読み込むJavaScriptとCSSを入力。
➋管理画面の[設定]→[ページの表示]→【投稿本文の表示／画像】→『画像リンクにLightbox用の属性を付加する』欄または『img要素に独自のclass属性値を追加する』欄にスクリプト側が要求する記述方法を加える。
➌管理画面の[設定]→[ページの表示]→【投稿本文内のURL処理】→「▼URL自動リンクの特殊表示化」→『画像リンクにLightbox用の属性を付加する』欄または『img要素に独自のclass属性値を追加する』欄にも同様の記述を加える。
※FancyboxはLightboxと同じように、data-属性を使って「data-fancybox="gallery"」と加える仕様なので、『画像リンクにLightbox用の属性を付加する』欄を使います。(上図の黄色矢印部分)
※Fuwaimgのようにclass属性に指定のclass名が必要なスクリプトの場合は、『img要素に独自のclass属性値を追加する』欄の方に入力します。(上図の緑色矢印部分)
なお、FancyboxはCDNで提供されているので、自サイトにスクリプトを設置する必要はなく、以下のURLをそのまま入力欄に入れれば使えます。
●JavaScript： https://cdnjs.cloudflare.com/ajax/libs/f...
●CSS： https://cdnjs.cloudflare.com/ajax/libs/f...
以上。
畳む
必要な設定箇所は、以下の3点。
➊管理画面の[設定]→[システム設定]→【画像拡大スクリプトの選択】→『他のスクリプトを使う』をONにした上で、読み込むJavaScriptとCSSを入力。
➋管理画面の[設定]→[ページの表示]→【投稿本文の表示／画像】→『画像リンクにLightbox用の属性を付加する』欄または『img要素に独自のclass属性値を追加する』欄にスクリプト側が要求する記述方法を加える。
➌管理画面の[設定]→[ページの表示]→【投稿本文内のURL処理】→「▼URL自動リンクの特殊表示化」→『画像リンクにLightbox用の属性を付加する』欄または『img要素に独自のclass属性値を追加する』欄にも同様の記述を加える。
※FancyboxはLightboxと同じように、data-属性を使って「data-fancybox="gallery"」と加える仕様なので、『画像リンクにLightbox用の属性を付加する』欄を使います。(上図の黄色矢印部分)
※Fuwaimgのようにclass属性に指定のclass名が必要なスクリプトの場合は、『img要素に独自のclass属性値を追加する』欄の方に入力します。(上図の緑色矢印部分)
なお、FancyboxはCDNで提供されているので、自サイトにスクリプトを設置する必要はなく、以下のURLをそのまま入力欄に入れれば使えます。
●JavaScript： https://cdnjs.cloudflare.com/ajax/libs/f...
●CSS： https://cdnjs.cloudflare.com/ajax/libs/f...
以上。
畳む