設定画面[ 外観 ] > [ カスタマイズ ] > [ 色 ]

サイトカラーやテキスト、テキストリンク、ボタンなどの色を設定することができます。

customizer3-2

サイト全体

メイン色

サイトタイトルやヘッダーナビゲーションのカレントメニュー、ヘッダーのメンバーアイコン・カートアイコンなどの色を変更することができます。

カスタマイザーでの設定表示
customizer3-1-1-a-2-add
項目名設定内容
メイン色初期色:#111111

サブ色

ヘッダーのカートアイコンの数量や、トップページにあるお知らせ一覧のカテゴリーの背景色などを変更することができます。

カスタマイザーでの設定表示
customizer3-1-1-b-2-add
項目名設定内容
サブ色初期色:#cc0000

テキスト色

ヘッダーナビゲーションのメニューや、各詳細ページのテキスト、お知らせ一覧の日付などの色(リンクを除く)を変更することができます。

カスタマイザーでの設定表示
customizer3-1-3-b-1-add
項目名設定内容
テキスト色初期色:#111111

リンク色

トップページの商品や特集一覧、各詳細ページのテキストリンクの色を変更することができます。

カスタマイザーでの設定表示
項目名設定内容
リンク色初期色:#333333

ボーダー色

ヘッダーナビゲーションやサブページに使用している罫線(テーブルを除く)などの色を変更することができます。
※ 「表示」画像に示されているように、選んだ色を淡く(薄く)して、「お知らせ」と「検索」の表示エリアの背景色としても使用しています。

カスタマイザーでの設定表示
customizer3-1-5-b-add
項目名設定内容
ボーダー色初期色:#c1c1c4

テーブル

テーブルの色を変更することができます。

カスタマイザーでの設定表示
customizer3-1-6-b-add
項目名設定内容
見出し 背景色初期色:#dfdfdf
見出し カラー初期色:#111111
ボーダー色初期色:#dfdfdf

フッター

トップ

フッターの上部エリアの背景色やテキスト色などを変更することができます。

カスタマイザーでの設定表示
customizer3-2-1-b-add
項目名設定内容
背景色初期色:#eaeaeb
テキスト色初期色:#000000
リンク色初期色:#000000
ボーダー色初期色:#bbbbbc
テーブル
 見出し 背景色初期色:#dfdfdf
 見出し カラー初期色:#111111
 見出し ボーダー色初期色:#dfdfdf

ボトム

フッターの下部エリアの背景色やテキストの色などを変更することができます。

カスタマイザーでの設定表示
customizer3-2-2-add
項目名設定内容
背景色初期色:#171717
テキスト色初期色:#cccccc

商品

カートボタン

カートボタンの色を設定することができます。

カスタマイザーでの設定表示
customizer3-4-1-add
項目名設定内容
背景色初期色:#000000
テキスト色初期色:#ffffff

価格

価格の色を設定することができます。

カスタマイザーでの設定表示
customizer3-4-2-add
項目名設定内容
価格初期色:#000000

商品タグ

「新着商品」や「お勧め商品」などの商品タグの色を設定することができます。

カスタマイザーでの設定表示
customizer3-4-3-add
項目名設定内容
新着商品初期色:#cc0000
お勧め商品初期色:#4eb6a5
在庫僅少初期色:#4e9fb6
セール初期色:#a64eb6

商品リスト

商品一覧での「キャンペーンメッセージ」や「売り切れ表示」の色を設定することができます。

カスタマイザーでの設定表示
customizer3-4-4-add
項目名設定内容
新着商品初期色:#cc0000
お勧め商品初期色:#4eb6a5
在庫僅少初期色:#4e9fb6
セール初期色:#a64eb6

その他

メインボタン

カートページの「次へ」のボタンやログインページの「ログイン」ボタンなどの色を設定することができます。

カスタマイザーでの設定表示
customizer3-5-1-add
項目名設定内容
背景色初期色:#000000
テキスト色初期色:#ffffff

サブボタン1

カートページの「数量更新」ボタンやカートテーブルの「削除」ボタンの色を設定することができます。

カスタマイザーでの設定表示
customizer3-5-2-add
項目名設定内容
背景色初期色:#000000
テキスト色初期色:#ffffff

サブボタン2

カートページの「買い物を続ける」や「戻る」ボタンなどの色を設定することができます。

カスタマイザーでの設定表示
customizer3-5-3-add
項目名設定内容
背景色初期色:#dddddd
テキスト色初期色:#333333

ナビゲーション色

スライドで表示した際のナビゲーション(矢印)の色を設定することができます。

カスタマイザーでの設定表示
customizer3-5-4-add
項目名設定内容
ナビゲーション色初期色:#555555

発送業務休日

発送業務休日の色を設定することができます。

カスタマイザーでの設定表示
customizer3-5-5-add
項目名設定内容
発送業務休日初期色:#fff0d1