ヒーローヘッダーパーツ
パーツ解説
「ヒーローヘッダー」は、画像を全画面に表示させることで、訪れた人にインパクトを与え、サイトのイメージを決定づけるパーツです。
企業からのメッセージを伝えたり、サイトの中でもとくに見てほしいコンテンツへの誘導にも利用されます。
ヒーローヘッダーパーツには複数の画像を登録でき、それぞれの画像にキャッチコピーやリンクを設定できます。
※画像は10件まで登録できます。
企業からのメッセージを伝えたり、サイトの中でもとくに見てほしいコンテンツへの誘導にも利用されます。
ヒーローヘッダーパーツには複数の画像を登録でき、それぞれの画像にキャッチコピーやリンクを設定できます。
※画像は10件まで登録できます。
パーツ編集モードでヒーローヘッダー部分にマウスカーソルを合わせると
①パーツ編集、②データ一覧（追加・編集） ボタン が表示されます。
①パーツ編集
①基本設定
- 表示データ設定
"1データ目固定表示"または、 "データ別表示" を選択します。
"1データ目固定表示"を選択すると、1データ目に設定している文章やバナー表示を2データ目以降にも表示します。
- 掲載ページ
掲載ページを"トップページのみ"にすると、トップページ以外のページではヒーローヘッダーが表示されなくなります。
- ナビゲーション表示
ナビゲーションを"有効"にすると、ヒーローヘッダー下のナビゲーションが表示されます。
②動作設定
自動スライドを"有効"に設定すると、ヒーローヘッダーの画像を自動で切り替える設定を行えます。
- 切替速度
次の画像に切り替わるまでの速さを 1（速い）～10（遅い）から選択します。
- エフェクト
画像が切り替わる際の効果を選択します。
- エフェクトスピード
エフェクトが始まって終わるまでの速さを 1（速い）～10（遅い）から選択します。
- 再生回数
スライドショーを繰り返し再生する回数を 繰り返し、1回のみ から選択します。
③フィルター設定／スマホフィルター設定
「フィルター表示」を"有効"に設定すると、ヒーローヘッダーの画像の上にフィルターを表示します。フィルターの色や模様を設定できます。
②データ作成
データ一覧画面
登録しているデータを確認できる画面です。ドラッグ＆ドロップで画像の表示順を並び替えることができます。
①新しく追加
データ編集パネルに移動して、データを新たに追加できます。
②操作パネル(三点リーダー)
マウスカーソルを三点リーダー（…）に合わせると、各データの操作パネルが表示されます。
編集、下書き／公開の切り替え、削除、複製 を行うことができます。
データ一覧で【新規追加】ボタン、または【編集】ボタンをクリックすると"データ編集"画面に移動します。
①背景画像設定／スマホ背景画像設定
ヒーローヘッダーの背景に表示させるイメージを登録します。
②文章
表示させる文章をエディタに入力します。エディタ内では、文字色や背景色を変更したり、編集することができます。
*エディタについてはこちら
*エディタについてはこちら
また背景色の設定や、「中央に表示」を "有効" にして文字を中央部分に配置できます。
③バナー表示設定
表示される画像をクリックすると、他のページへ遷移するバナーを設定できます。
- バナー画像設定
バナー画像を設定します。また代替テキスト（画像の代わりになる語句、文章）の設定も可能です。
- リンク設定
「URL入力」、「ページ選択」、「お問い合わせ」から選択します。また、ページ表示方法は「内部リンク」、「外部リンク」のどちらかを設定します。
- 中央に表示
"有効"にすると、バナーを中央部分に表示します。
基本操作
①ガイド
編集パネルの上部に表示されている "ガイド" チェックボックスをチェックすると、ヒーローヘッダー内にガイド線が表示されます。"黒"のチェックボックスにチェックをすると、ガイド線の色をよりはっきり表示します。
編集パネルの上部に表示されている "ガイド" チェックボックスをチェックすると、ヒーローヘッダー内にガイド線が表示されます。"黒"のチェックボックスにチェックをすると、ガイド線の色をよりはっきり表示します。
②コンテンツの移動
編集したい要素をクリックすると、選択状態のボックスが表示されます。ボックスの左側のアイコン部分をドラッグ＆ドロップでカーソル移動して配置を変更できます。