ヘッダーの装飾

装飾方法

ヘッダーセクションの装飾

◆設定できる背景の種類

1.全体背景
全体背景の変更はこちら → 「全体背景の変更」

2.PCの２段目背景
2段目背景の変更はこちら → 「2段目背景の変更」

3.スマホの2段目背景
2段目背景の変更はこちら → 「2段目背景の変更」

4.スマホバーガー内の背景
スマホバーガー内の背景変更はこちら → 「スマホバーガー内の設定」

◆全体背景の変更

1. ヘッダーセクションをクリック。
2. 「背景」をクリック。
3. 背景の設定。
   
   2段目があるレイアウトの場合は2段目に違う背景を設定することができます。
   → 「2段目背景の変更」
   背景の設定についてはこちら → 「背景の設定」
4. 「OK」で確定。
5. 以上が、全体背景色の変更手順です。
   公開サイトへ反映するには「サイト更新」をクリックしてください。

◆枠線の設定

1. ヘッダーセクションをクリック。
2. 「枠線」をクリック。
3. 「表示位置」を選択。
4. 「形状」を選択。
5. 色を選択。
   
   色の詳細設定についてはこちらをご参照ください
   → 背景の設定「詳細設定をする」
6. 「OK」で確定。
7. 以上が、枠線の設定手順です。
   公開サイトへ反映するには「サイト更新」をクリックしてください。

◆2段目背景の変更

2段目があるレイアウトを選択した場合、全体背景とは別に2段目の背景を変更することができます。
設定方法はPC表示、スマホ表示同様です。

1. ヘッダーセクションをクリック。
2. PCまたはスマホ表示をクリック。
3. 2段目があるレイアウトを選択。
4. 2段目の背景設定。
   
   背景の設定についてはこちら → 「背景の設定」
5. 「OK」で確定。
6. 以上が、2段目背景の変更手順です。
   公開サイトへ反映するには「サイト更新」をクリックしてください。

◆スマホバーガー内の設定

・アイコン色の変更

1. スマホ表示をバーガーにした上でヘッダーセクションを選択。
2. アイコン色を選択。
   
   色の詳細設定についてはこちらをご参照ください
   → 背景の設定「詳細設定をする」
3. 「OK」で確定。
4. 以上が、アイコン色の変更手順です。
   公開サイトへ反映するには「サイト更新」をクリックしてください。

・バーガー内の背景変更

1. スマホ表示をバーガーにした上でヘッダーセクションをクリック。
2. バーガーメニューの背景色を選択。
   
   背景の設定についてはこちら → 「背景の設定」
3. 「OK」で確定。
4. 以上が、背景色の変更手順です。
   公開サイトへ反映するには「サイト更新」をクリックしてください。

ページリンクの装飾

◆フォント / 文字色（PC / スマホ）

1. ページリンクをクリック。
   スマホの装飾をする場合はスマホに表示切り替えをしてください。
2. 装飾の編集をしたい方をクリック。
3. 「フォント」と「文字色」の設定。
   
   設定方法はこちらをご参照ください
   → フッターの設定「ページリンクの装飾」
4. 「OK」で確定。
5. 以上が、フォントと文字色を変更する手順です。
   公開サイトへ反映するには「サイト更新」をクリックしてください。

◆区切り線（PC / スマホ）

ページリンクの間に区切り線を入れることができます。

1. ページリンクをクリック。
   
   スマホの装飾をする場合はスマホに表示切り替えをしてください。
2. 装飾の編集をしたい方をクリック。
3. 下へスクロールし「区切り線」の種類を選択。
   スマホの場合は区切り線を「あり」「なし」から選択してください。
4. 区切り線の色を選択。
   
   詳細設定についてはこちらをご参照ください
   → 背景の設定「詳細設定をする」
5. 「OK」で確定。
6. 以上が、区切り線の設定手順です。
   公開サイトへ反映するには「サイト更新」をクリックしてください。

◆ハイライト（PCのみ）

ハイライトをつけた場合、現在選択中のページが分かりやすくなります。
スマホにはハイライト設定はありませんが常にハイライトがついています。

1. ページリンクをクリック。
2. 「PC装飾」をクリック。
3. 「ハイライト」を選択。
4. 上へ戻り「OK」で確定。
5. 以上が、ハイライトの設定手順です。
   公開サイトへ反映するには「サイト更新」をクリックしてください。

◆下線（PCのみ）

下線をつけた場合、現在選択中のページが分かりやすくなります。
また、ハイライトを付けた場合と付けない場合とでは下線の見え方が変わります。

1. ページリンクをクリック。
2. 「PC装飾」をクリック。
3. 「下線」を選択。
4. 下線の色を選択。
   
   詳細設定についてはこちらをご参照ください
   → 背景の設定「詳細設定をする」
5. 上へ戻り「OK」で確定。
6. 以上が、下線の設定手順です。
   公開サイトへ反映するには「サイト更新」をクリックしてください。

◆テキストの位置（スマホ・バーガー設定のみ）

スマホ表示でバーガーメニューのレイアウトを選択時のみテキストの位置設定が可能です。
スマホの装飾をする場合はスマホに表示切り替えをしてください。

1. ページリンクをクリック。
2. 「スマホ装飾」をクリック。
3. 「テキストの位置」を選択。
4. 「OK」で確定。
5. 以上が、テキスト位置の変更手順です。
   公開サイトへ反映するには「サイト更新」をクリックしてください。

◆三角アイコンの設定（スマホかつバーガー設定のみ）

・スマホ表示でバーガーメニューのテキスト位置を左にした場合、三角アイコンの位置と色の設定が可能です。

・スマホの装飾をする場合はスマホに表示切り替えをしてください。

1. ページリンクをクリック。
2. 「スマホ装飾」をクリック。
3. 「三角アイコン」を選択。
4. アイコンの色を選択。
   
   詳細設定についてはこちらをご参照ください
   → 背景の設定「詳細設定をする」
5. 上へ戻り「OK」で確定。
6. 以上が、三角アイコンの設定手順です。
   公開サイトへ反映するには「サイト更新」をクリックしてください。

パーツの装飾について

◆パーツをクリックして編集します。