メニュービルダーを使用すると、特集アイテムを強調表示し、顧客を効果的にガイドし、さまざまな画像とテキストのレイアウトオプションを提供する高度なメニューを作成できます。ストアのカスタマイズされたクイックナビゲーションのデザインを始めましょう！
⚠️ 始める前に：
- ストアがレイアウトエンジンエディタを使用している場合は、コードを調整するためにこの ドキュメントを参照するか、オンラインビジネスオーナーサクセスチームにお問い合わせください。
- メニュービルダーのインターフェースは一般的に ショップビルダーに似ています。概要については、関連するよくある質問を参照してください。
この記事では以下の内容をカバーします：
1. 高度なメニュー
高度なメニューを作成する
ステップ 1
SHOPLINE管理画面で、[オンラインストアデザイン] > [メニューナビゲーション]に移動し、高度なメニューを作成をクリックします。
*注意事項：
- 次のテーマテンプレートのみサポートされています：ウルトラシック / キングスマン / ヴァーム / フィリアテーマテンプレート。
- 各オンラインストアは1つの高度なメニューの作成のみをサポートしています。
ステップ 2
[高度なメニューのデザイン] > [メニューを追加]に移動して、メニュービルダーの使用を開始します。
高度なメニューを適用する
ステップ 1
[オンラインストアデザイン] > [メニューナビゲーション]に移動し、適用をクリックします。
ステップ 2
ポップアップの指示を読み、確認をクリックします。
ステップ 3
高度なメニューの横に「使用中」のラベルが表示されます。
編集 / 削除
[オンラインストアデザイン] > [メニューナビゲーション] > [高度なメニュー]に移動し、編集をクリックするか、「⋯」をクリックして削除を選択します。
ポップアップの指示を読み、確認チェックボックスをチェックし、削除をクリックします。
2. メニュー ビルダー
高度なメニューのレイアウトを選択してください。合計で4つのレイアウトを選択できます：
- 階層的に展開 - 画像付きテキストリスト
- すべて展開 - テキストのみリスト
- すべて展開 - 画像付きテキストリスト
- すべて展開 - テキストのみ & 画像付きテキストリスト
高度なメニューデザイン
ステップ 1
メニューのデフォルト名は "L1 Expand OOO - OOO リスト" です。各メニューの上にカーソルを置くと、「編集」、「サブメニューを追加」、「削除」アイコンが表示されます。
*注：最大8つのL1メニューを追加できます。
ステップ 2
「」アイコンをクリックしてL1メニューを編集します。「
」アイコンをクリックして削除します。
説明 |
|
|
メニュー タイトル 最大50文字を入力します。サポートされている言語はストア設定と同じです。 | |
|
メニュー URL 外部URLを入力するか、システムページ（ページ、商品カテゴリ、プロモーション、ブログ記事、ブログカテゴリ）を選択できます。 | |
|
リンクを開く形式 現在のウィンドウまたは新しいウィンドウで開くように選択します。 | |
|
サブメニューの展開方法 2つの方法をサポートしています：
| |
|
行ごとの第二層サブメニュー（PC） サブメニューが完全に展開されると、第二レベルで行ごとに表示されるサブメニューの数を設定できます。 |
ステップ 3
L1メニューの横にある「+」アイコンを選択してL2メニューを追加します。同様に、L2メニューの横にある「+」アイコンを選択してL3メニューを追加できます。
*注：最大12のL2メニューと最大10のL3メニューを追加できます。
ステップ 4
「」アイコンをクリックしてL2/L3メニューを編集します。「
」アイコンをクリックして削除します。保存をクリックして完了します。
説明 |
|
|
メニュータイトル 最大50文字を入力します。サポートされている言語はストア設定と同じです。 | |
|
テキストの配置 左 / 中央 / 右 | |
|
太字のフォーマット 太字 / 通常 | |
|
メニューURL 外部URLの入力またはシステムページ（ページ、商品カテゴリ、プロモーション、ブログ記事、ブログカテゴリ）の選択をサポートします。 | |
|
リンクの開き方 現在のウィンドウまたは新しいウィンドウで開くように選択します。 | |
|
デスクトップ/モバイルでの画像表示
| |
|
画像（デスクトップ / モバイル） JPG／JPEG／PNG形式をサポートします。L3メニューは1:1の比率のみサポートします。 | |
|
画像の比率（デスクトップ / モバイル）
| |
|
テキスト位置付き画像（デスクトップ / モバイル）
|
ステップ5
「"」アイコンをクリックしてドラッグし、メニューの順序を再配置します。メニューは階層レベルによって移動します。たとえば、L1メニューを移動すると、そのすべてのL2およびL3メニューも一緒に移動します。
ステップ6
すべてのメニューの設定を保存してください。その後、プレビューページ > 公開をクリックします。
全体のレイアウト設定
ステップ1
[全体のレイアウト設定] > [スタイル設定]に移動します。
ステップ2
完了したら、保存をクリックします。
|
|
説明 |
|
メニューの配置 (PC) 左 / 中央 / 右 | |
|
親メニューの展開方法 親メニュー (L1メニュー) の展開方法を選択します: なし または 矢印。
| |
|
サブメニューの色のカスタマイズ 有効にすると、L2/L3メニューの背景色とテキスト色をカスタマイズできます。無効にすると、SHOPビルダーで設定されたメニューの色が適用されます。 | |
|
背景 メニューの背景色を選択します。 | |
|
テキスト メニューのテキスト色を選択します。 |
ステップ 3
すべてのメニューの設定を保存してください。その後、プレビューページ > 公開をクリックします。
3. 注意事項
- この機能は、Ultra Chic、Kingsman、Varm、およびPhiliaストアテーマのみサポートされています。各ストアは、最大1つの高度なメニューを作成できます。
-
「デスクトップ/モバイルに画像を表示」を有効にしても画像をアップロードしない場合、システムはデフォルトの画像を表示します。
続きを読む
この記事はAIを使用して翻訳されており、不正確な部分が含まれている可能性があります。最も正確な情報については、元の英語版を参照してください。
コメント