メニュー項目にアイコンを追加する

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

アイコンを使うと、買い物客がメニューをすばやく見分けられます。たとえば Sale の横に炎のアイコン、ブランドの横に小さなロゴを置けます。

アイコンを追加する

1. 項目を開く

   プレビューで項目にカーソルを合わせ、項目を編集 (1) をクリックします。項目の設定が左側に開き (2)、上部に アイコン が表示されます。

   

   (1) 項目を編集をクリック、(2) 項目の設定が左側に開き、上部にアイコンが表示される

2. アイコンを選ぶ

   ライブラリから選ぶか、独自の画像をアップロードします。

   アイコンを選択
   1. アイコンを選択 をクリックして検索します（例: heart、truck）。
   2. アイコンをクリックします。すぐに追加され、項目の文字色が使われます。
   アップロードアイコン
   1. アップロードアイコン をクリックします。画像 パネルに、アップロード済みの画像が表示されます。
   2. アップロード領域に画像をドロップするか、領域をクリックしてファイルを選択します。
   3. 画像をクリックし、選択 をクリックします。

   

   アイコンは項目設定の一番上にあります（Select icon / Upload icon）。

3. アイコンの幅を設定する

   アップロードした画像のみ対象です。アイコンの幅をご覧ください。

4. 保存して公開する

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

ノート

約60 × 60 pxの正方形のPNG、JPG、WebP、GIF、SVGを、2 MB以下でアップロードしてください。これより大きいファイルでは 画像は 2MB を超えないようにしてください。サイズを変更して再度アップロードしてください。 と表示されます。

アイコンの幅

自動

画像は元のサイズのまま表示されます。

カスタム

数値と単位（%、px、em、rem）で指定します（例: 24px）。

変更または削除する

アイコン ボックスの 変更 をクリックし、次のいずれかを選びます。

• アイコンを選択 — 別のライブラリのアイコンを選びます。
• アップロードアイコン — 別の画像を使います。
• 削除 — 項目からアイコンを削除します。

アップロードした画像は、再利用できるように 画像 パネルに残ります。ライブラリから削除するには、画像を選択して 削除 をクリックします。

ヒント

• 1つのメニュー内のアイコンは、スタイル（アウトラインまたは塗りつぶし）とサイズを統一しましょう。
• アップロードしたアイコンがぼやける場合は、表示サイズの2倍（24 pxなら48 × 48 px）でアップロードし、カスタム の幅を設定します。
• 言語ごとに別のアイコンを使うには、翻訳モードを使用します。

関連ページ

• メニュー項目を編集する項目のタイトル、リンク、アイコン、色、バッジ、サブメニュー、表示設定を変更したり、項目を複製、移動、削除したりします。
• メニュー項目を追加するメニューバーにトップレベルの項目を追加し、ページ、コレクション、商品、URLにリンクします。
• メニューを翻訳するメニュー項目と組み込みのメニューテキストを、ストアで販売しているすべての言語に翻訳します。

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

問題を報告