メニューの色を調整する

メニューバー、サブメニュー、タブ、商品ラベル、カートに追加ボタンの色を設定します。

ハウツーガイドすべてのプラン 5 分で読めます

カラー タブの色は、メニュー内のすべての項目に適用されます。ブランドに合わせた色を、1か所でまとめて設定できます。

色を変更する

カラータブを開く

メニューエディターで、左サイドバーのペンキ缶のアイコンをクリックします (1)。

カラータブを開き (1)、色フィールドをクリックします (2)。
色を選ぶ

色の横にあるフィールドをクリックします (2)。色を選ぶか、#FFFFFF のような16進コードを入力します。
プレビューを確認する

プレビューで項目にカーソルを合わせて、ホバー時の色を確認します。
保存して公開する

保存をクリックし、公開をクリックします。

背景色: メニューバーの背景。
Hover background color（ホバー時の背景色）: トップレベル項目の、ホバー時またはサブメニューが開いている間の背景。
Separator color（区切り線の色）: 項目間の区切り線。メニュー設定で デスクトップで区切り線を表示 または モバイルで区切り線を表示 がオンのときに表示されます。
文字色: トップレベル項目のテキストとアイコン。
Hover text color（ホバー時の文字色）: ホバー時のトップレベル項目のテキストとアイコン。

ドロップダウン、メガメニューとその内容です。

メニューに表示される商品のラベルです。

メニュー設定 > 詳細設定 で カートに追加ボタンを表示 がオンのときに表示されます。

項目が読みにくい、またはホバー時に消える

文字色 が 背景色 と、Hover text color が Hover background color と、十分なコントラストになっていることを確認してください。ホバー時の背景が白で文字も白だと、ホバー時に項目が見えなくなります。

1つの項目だけ別の色にしたい

項目自体の カラー 設定（Pro Navigation プラン）を使います（例：赤い「セール」項目）。メニュー項目を編集するをご覧ください。

このページは役に立ちましたか？