※モバイル機器のみ作動→PC表示に切替 モバイル表示に切替

【Volar】に搭載されてるオリジナル機能に関してはデザインモードではなくデフォルトの編集画面でのご利用を前提としてます。

特に記載がない限り、ご紹介する機能は【Volar】及び【Volarデザイン】に共通搭載となります。

モーダルウインドウ機能

キャプチャ画像

SIRIUSテンプレート【Volar】では、使い方によってはサイト訪問者により効果的な印象を与えられるモーダルウインドウを簡単な設定で表示させることができます。

 

モーダルウインドウについてはコチラ↓の記事をご覧ください。

SIRIUSにモーダルウインドウを設置するやり方

SIRIUSにモーダルウインドウを設置するやり方をご紹介します。


特長

【Volar】のモーダルウインドウ作成機能は、以下のような特長があります。

 

  • ページ表示と同時にモーダルウインドウが立ち上がるパターンと何かをクリックするとモーダルウインドウが立ち上がるパターンの2種類をご用意。
  • モーダルウインドウの幅および高さは中身の分量に応じて自動拡張
  • 横幅はPCブラウザ幅の最大50%まで拡張、スマホでは横幅80%で固定。
  • ウインドウの高さに制限はありません。(しかしながら見やすい分量でとどめておくのが望ましい)
  • テキストでも画像でも動画でも表示可能。
  • ”閉じる”ボタンをクリックしても、背景をクリックしても、どちらでもモーダルウインドウを閉じることが可能

モーダルウィンドウはデフォルトでは機能OFFになってます。

実際の表示例

(その画面を操作しない限り次の動作に移れない)モーダルウインドウは諸刃もろはつるぎとも言われています。

『諸刃の剣』とは、相手にも打撃を与えるが、こちらもそれと同じくらいの打撃を受けるおそれがあることから『大きな効果や良い結果をもたらす可能性をもつ反面、多大な危険性をも併せもつ』という意味の慣用句。

(出典:大辞林)

 

使いどころを誤ったり、閉じ方がわかりにくかったり、意図的に宣伝サイトに誘導するようなモーダルウインドウは嫌がられるだけでなく、サイトの信用性を失う恐れもあります。

 

この辺のところを充分ご理解の上、ご利用下さい。

 

コチラ↓で実際の動きがご覧になれます。

画像バージョン(ページ表示と同時

キャプチャ画像

 

画像バージョン(クリックしてから表示

キャプチャ画像

 

テキストバージョン(ページ表示と同時

キャプチャ画像

 

テキストバージョン(クリックしてから表示

キャプチャ画像

SIRIUSテンプレート【Volar】

キャプチャ画像

SIRIUS ver.1.5で大幅刷新された新テンプレートを元に、独自のカスタマイズを加えた改良型SIRIUSテンプレートが【Volar】です。

入手方法についてはコチラ↓をご覧ください。
 この記事をシェア 
キャプチャ画像