色と背景（デザイン設定）

色と背景（デザイン設定）について

サイト全体の色や背景をカスタマイズすることができます。

前提

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

1. 基本色

「基本色」をクリックして、サイト全体の色を設定できます。

設定できる色は下記です。

項目	説明
メインカラー	サイト全体のイメージとなる色です。 主要な画面の要素(メインメニューなど)がこの色になります。
サブカラー（普通）	ボタンやアイコン等で使用する、メインカラーを補う色です。
サブカラー（弱）	フッターの背景等、主に背景色として使用する色です。
強調色	新着やお気に入り、注意書き等、主に注意喚起を促す箇所に使用される色です。
強調背景色	新着やお気に入り、注意書き等、主に注意喚起を促す箇所の背景色として使用される色です。
問い合わせボタン色	問い合わせボタンの色がこの色になります。
ヘッダー背景色	ヘッダーの背景色がこの色になります。
背景色	サイト全体の背景色がこの色になります
背景画像	背景に画像を設定することができます。 設定した背景画像は「高度な設定」をクリックして、詳細を設定することができます。

「カラーセットから読み込む」では手軽にサイト全体の色を変更できることができます。

個別に任意の色を指定することもできます。

2. パンくず

「パンくず」をクリックして、パンくずの色を設定できます。

設定できる色は下記です。

項目	説明
文字色	パンくずの文字の色です。
リンク色	パンくずの中でリンクになっている文字の色です。
リンクhover色	カーソルをリンクに合わせた時の文字の色です。
背景色	パンくず全体の背景色です。

背景色を水色にした場合、以下のようになります。

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

「フッターウィジェット」をクリックして、フッターウィジェットの色を設定できます。

ウィジェットについてはこちら

設定できる色は下記です。

項目	説明
ウィジェットタイトル色	ウィジェットのタイトルの色です。
文字色	ウィジェットの中に表示される文字の色です。
リンク色	ウィジェットの中でリンクになっている文字の色です。
リンクhover色	カーソルをリンクに合わせた時の文字の色です。
背景色	ウィジェットの背景色です。
背景画像	背景に画像を設定することができます。 設定した背景画像は「高度な設定」をクリックして、詳細を設定することができます。

背景色を水色にした場合、以下のようになります。

4. フッターバー

「フッターバー」をクリックして、フッターバーの色を設定できます。

フッターバーについてはこちら

設定できる色は下記です。

項目	説明
文字色	フッターバーの中の文字の色です。
リンク色	フッターバーの中でリンクになっている文字の色です。
リンクhover色	カーソルをリンクに合わせた時の文字の色です。
背景色	フッターバーの背景色です。
背景画像	背景に画像を設定することができます。 設定した背景画像は「高度な設定」をクリックして、詳細を設定することができます。

文字色を緑にした場合、以下のようになります。

5. 設定の保存

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

• Related Articles

• デザイン設定

  デザイン設定について デザイン設定を使って、サイト全体の見た目や表示項目をカスタマイズすることができます。 設定パネルの右側には、常に更新内容を反映したプレビューが表示されます。 カスタマイズ内容は大きく下記に分類されます。 それぞれの詳しい使い方についてはリンク先をご覧ください。 レイアウト 色と背景 メニュー ウィジェット 1. 変更内容の保存 デザインを変更したあとは保存する必要があります。 「歯車」ボタンをクリックして、デザインの変更を下書きとして保存することができます。 ...

• フォント（デザイン設定）

  フォント（デザイン設定）について サイトに表示されるフォントを変更することができます。 前提 サイドメニューから「デザイン設定」を開き、「フォント」をクリックします デザイン設定についてはこちら フォント変更 「全体」と「見出し(h1-h6)」のフォントをそれぞれ変更できます。

• メニュー（デザイン設定）

  メニュー（デザイン設定）について ページメニュー(以下画面の赤枠)に表示する項目を変更できます。 メニュー項目はいくつでも設定することができますが、エリアに入りきらない場合は「もっと見る」という項目が作られ、カーソルを合わせると表示されます。 前提 サイドメニューから「デザイン設定」を開き、「メニュー」をクリックします。 デザイン設定についてはこちら 1. メニューの編集 1.1. メニュー項目の並べ替えと階層化 編集したいメニューをクリックします。 ...

• ウィジェット（デザイン設定）

  ウィジェット全般について ウィジェットとは、フッターエリアに配置できるコンテンツのことです。 「デザイン設定」画面から設定することができます。 使えるウィジェットは以下の通りです。 SNSリンク カスタムHTML ギャラリー テキスト ナビゲーションメニュー 最近のブログ投稿 画像 前提 「フッターエリア」が有効になっている必要があります。フッターエリアについてはこちら デザイン設定についてはこちら 1. ウィジェットの追加 「デザイン設定」画面を開き、「ウィジェット」をクリックします。 ...

• レイアウト（デザイン設定）

  レイアウト（デザイン設定）について レイアウトでヘッダーやフッターのデザインや表示する情報を編集することができます。 前提 サイドメニューから「デザイン設定」を開き、「レイアウト」をクリックします デザイン設定についてはこちら 1. サイト基本情報 「ヘッダー」、「サイト基本情報」をクリックしてサイトの基本的な情報を編集することができます。 編集できる項目は下記です。 項目 説明 ロゴ ヘッダーに表示するロゴを設定できます。 ...