【Volar2】ではサイズ違いのオリジナルのバナーデザイン機能を搭載してます。
主に1カラム（ワイド）での利用を想定してデザインしてます。
また画像自体はあなたご自身でご用意していただく必要があります。
横幅短めの簡易バナー
主にフッター周りで使えそうなバナーデザインになります。
サンプルがこちら。
- 2～5個まで設置可能。画像幅及び画像間の余白は個数に応じて自動調整。（PC）
画像を暗くするオプション付き。 - バナーにマウスオーバーすると画像が少し大きくなる演出付き。（※PCのみ）
- スマホでは1列縦表示。
- テキストカラーは白固定。（変更も一応可能）
このページでご紹介する3タイプのバナーすべて、基本的にはこちらで用意している専用のHTMLコードをコピー＆ペーストしたあと画像とテキストを差し替えるという若干の手間は生じます。
（当該HTMLコードはマニュアルに記載してます）
画像に関してはSIRIUS2の画像挿入機能を使えば当該箇所に自動的に画像用コードが挿入されます。
テキストは当該箇所にお好きなテキストを記入します。
その後SIRIUS2のリンク機能を使ってリンクURLを差し替えていただくだけでデザイン済みのバナー画像として表示できる仕様です。
余白なしのバナー
少し大きめのバナーデザインになります。
サンプルがこちら。
- 2～5個まで設置可。画像幅は個数に応じて自動調整。（PC）
画像を暗くするオプション付き。 - 画像は余白なしの接着表示。
- バナーにマウスオーバーすると画像が少し大きくなる演出付き。（※PCのみ）
- タブレットでは固定幅で列数は自動調整。スマホでは1列縦表示。
- テキストカラーは白固定。
フルワイドのバナー
コンテンツエリア幅まで広がるバナーデザインです。
サンプルがこちら。
- 横幅はフルワイドで固定。画像を暗くするオプション付き。
- 縦にいくつでも増やせます。画像間の空きはなく余白なしの接着表示。
- バナーにマウスオーバーすると画像が少し大きくなり、テキストも少し右に動く演出付き。（※PCのみ）
- テキストカラーは白固定。
3タイプのバナー画像の実際の表示サンプルがデモサイトの【Volar2】オリジナルバナーでご覧になれます。
『オリジナルバナーデザイン』の関連記事
-
SIRIUS2テンプレート【Volar2】にはテーブル（表）のデータの背景にアイコンをつけたりセル幅を自在に調節できたりする便利な機能が搭載されてます -
SIRIUS2テンプレート【Volar2】では画像をクリックすると拡大表示できる機能を搭載してます。 -
SIRIUS2テンプレート【Volar2】では通常のヘッダーエリアを動画ヘッダーに簡単に切り替えることができます。 -
SIRIUS2テンプレート【Volar2】では通常のヘッダーエリアをフェード切り替え画像スライダーに簡単に切り替えることができます。 -
SIRIUS2テンプレート【Volar2】の1カラムページで使える＜フルワイド背景画像＞についての詳細ページ。 -
SIRIUS2テンプレート【Volar2】のテキスト周りを彩る＜独自の装飾効果＞についての詳細ページ。 -
SIRIUS2テンプレート【Volar2】なら＜まっさらなLPページ＞を作るのも簡単。 -
SIRIUS2テンプレート【Volar2】では人気記事1位～4位までをコンテンツ上部に自動表示させることができます。