レイアウト(デザイン設定)

表示中のFAQ

レイアウト(デザイン設定)について

レイアウトでヘッダーやフッターのデザインや表示する情報を編集することができます。

前提

  • サイドメニューから「デザイン設定」を開き、「レイアウト」をクリックします
  • デザイン設定についてはこちら

1. サイト基本情報

「ヘッダー」、「サイト基本情報」をクリックしてサイトの基本的な情報を編集することができます。

編集できる項目は下記です。

項目説明
ロゴヘッダーに表示するロゴを設定できます。
retinaディスプレイ用ロゴ、モバイルデバイス用ロゴが設定されていない場合は
この画像が使用されます。
※ロゴのサイズについてはロゴ画像の推奨サイズを知りたいをご覧ください。
retinaディスプレイ用ロゴを設定サイト訪問者の端末がretinaディスプレイの場合のロゴを設定できます。
※ロゴのサイズについてはロゴ画像の推奨サイズを知りたいをご覧ください。
モバイルデバイス用ロゴを設定サイト訪問者の端末がモバイルだった場合のロゴを設定できます。
※ロゴのサイズについてはロゴ画像の推奨サイズを知りたいをご覧ください。
サイトタイトルを表示チェックを入れるとサイトのタイトルを表示します。
サイトのタイトルは、SEO設定から編集できます。
SEO設定についてはこちら
キャッチフレーズを表示チェックを入れるとキャッチフレーズを表示します。
キャッチフレーズは、SEO設定から編集できます。
SEO設定についてはこちら
問い合わせ用電話番号を表示(PC/モバイル)ヘッダーに問い合わせ用電話番号を表示するか設定します。
電話番号下テキスト問い合わせ用電話番号の下に表示する文字を設定します。
サイトアイコン
(ファビコン)
サイトのアイコンを設定します。
タブに使用されます。
管理画面側のアイコンは変えることができません。

サイトタイトルを表示した場合、以下のようになります。

2. メインヘッダー

「ヘッダー」、「メインヘッダー」をクリックして、ヘッダーのレイアウトやデザインを編集できます。

編集できる項目は下記です。

項目説明
ヘッダー幅ヘッダーの幅を下記から選べます。
・全幅
・コンテンツ幅
メインメニューのレイアウトメニューの表示位置を変更できます。
ロゴ横に表示するコンテンツ会社ロゴ横に表示するコンテンツを編集できます。
サブメニュー
コンテナの線
サブメニューコンテナは、
メインメニューのメニュー項目が階層構造を持っている時、カーソルを重ねると表示されます。
サブメニューコンテナを囲む線の太さを編集できます。
メニューについてはこちら
サブメニューの線の色サブメニューコンテナの線の色を編集できます。
サブメニュー項目の線サブメニューを区切る線をつけることができます。
サブメニュー項目の線の色サブメニュー項目の線にチェックが入っている時、サブメニュー項目の線の色を編集できます。
サブメニューコンテナの動きサブメニューコンテナは、
メインメニューのメニュー項目が階層構造を持っている時、カーソルを重ねると表示されます。
メニューについてはこちら
サブメニューコンテナが表示される時の動きを下記から選択できます。
・デフォルト
・Slide Down
・Slide Up
・Fade
全てのページでメインヘッダーを表示しない各投稿画面の表示設定にある「メインヘッダーを表示しない」設定に関わらず表示されなくなります。

メインメニューのレイアウトでは以下のようにメニューの表示を変更できます。
※以下は「ロゴの右横に表示」を選んだ場合

サブメニューコンテナの幅では以下メニュー部分の幅を変更できます。

3. フッターウィジェット

「フッター」、「フッターウィジェット」をクリックして、フッターウィジェットエリアのデザインを編集できます。

編集できる項目は下記です。

項目説明
フッターの有効/無効フッターを有効にすることができます。
有効にするとウィジェットが配置できるようになります。
ウィジェットについてはこちら
フッターウィジェット上の線フッターの上に表示する線の幅を編集できます。
フッターウィジェット上の線の色フッターの上に表示する線の色を編集できます。

フッターウィジェットを無効にした場合、以下のようになります。

4. フッターバー

「フッター」、「フッターバー」をクリックして、フッターバーのデザインを編集できます。

編集できる項目は下記です。

項目説明
フッターバーレイアウトフッターバーのレイアウトを下記から選択できます。
・無効(左)
・セクションを縦並び(中央)
・セクションを横並び(右)
セクション1フッターバーの中で1つ目のエリアを編集できます。
下記から選択できます。
・なし
・カスタムテキスト
カスタムテキストを選択すると、「セクション1 カスタムテキスト」で入力した文字を表示できます。
セクション1
カスタムテキスト
セクション1に表示する文字です。
下記スニペットが使用できます。
・[crrent year]: 現在の西暦を表示します。
・[site_title]: サイトのタイトルを表示します。
・[theme_author]: いい生活のサービスサイトへのリンクを表示します。
セクション2フッターバーの中で2つ目のエリアを編集できます。
セクション1と同様です。
セクション2
カスタムテキスト
セクション2に表示する文字です。
セクション1 カスタムテキストと同様です。
フッターバーの線の太さフッターバーの幅を下記から選択できます。
・コンテンツ幅
・全幅
フッターバーの線(上)フッターバーの上に線つけます。
線の太さを編集できます。
フッターバーの線の色(上)フッターバーの線(上)の色を編集できます。

「セクション1 カスタムテキスト」を変更した場合、以下のようになります。

5. 設定の保存

設定の保存についてはこちら

この記事は役に立ちましたか?