使い方は?

Tab Bar - ボトムナビゲーションバー、ボトムナブ、またはタブナビゲーションとして知られる - は、Shein、ASOS、Zara、Etsy、H&M、Nike、Uniqloなどのグローバルブランドによって使用され、モバイルユーザーエクスペリエンスを向上させます。これは、すべてのサイズのウェブサイトに適しており、モバイルとデスクトップの両方で効果的です。

主な利点:

  • 重要なリンクを簡単にアクセスできる場所に配置し、迅速で便利なアクセスを提供
  • 主要なナビゲーションを中央集約し、ユーザーと検索エンジンがサイトをよりよく理解できるようにする - SEOに最適
  • 現在のUXおよびモバイルフレンドリーなデザインのトレンドに従った現代的でプロフェッショナルな外観を提供
  • すべてのページで可視性を保ち、顧客がプロモーション、トレンド商品、またはメンバーシップオファーなどの重要なリンクを見逃さないようにする

FAQ:

1. 無料版と有料版のどちらを使用するか決めていません。プロフェッショナルメニューのテンプレートを試すことはできますか?

もちろんです!メニューグループは主に初心者がNavi+の高度な機能に圧倒されないようにするためのものです 😄。プロフェッショナルメニューを試して、すべての機能とレイアウトオプションを探索するのが最良の方法です。後で、必要ないメニューや不適切なメニューを削除するだけです。

2. ここでメニューを作成すると、すぐに私のウェブサイトに表示されますか?

まだです。正しいメニューを公開する必要があります。それは簡単ですので心配しないでください!

3. 間違ったテンプレートを選んだり、間違いを犯したらどうなりますか?

全く問題ありません。いつでも削除して新しいものを作成できます。メニューをテストしていて別のテンプレートを試したい場合は、現在のものをバックアップファイルとして保存し、後で再オープンできます。メニュー間で部分をコピー&ペーストすることもできます(2つのブラウザタブを開くことで)ので、以前の作業を保持できます。自由に実験してください!

4. メニューを1つだけ作成するべきですか、それとも複数作成するべきですか?

あなたは複数のメニューを作成するべきです。アクティブなメニューだけがサイトに表示されますが、異なるテンプレートを選択したり、メニューをクローンしたりして多くのバージョンを準備できます。メニューはページタイプ(ホーム、商品、コレクション...)、デバイス(モバイルまたはデスクトップ)、またはURLキーワードに基づいて表示/非表示に設定できます。ですので、各状況に合ったメニューを構築してください!

ステップ1: メニューツリーを編集する

1.1. メニューツリーの理解

メニューツリーは、すべてのメニューの最も重要な部分です - 構造を定義します。

メニューツリーの例を示します:

Home  
Catalog  
- All Mountain  
   - Cruise Flex  
   - Balance Ride
- Freestyle  
   - Park Board  
   - Jib Board  
- Freeride  
Support  
More  

これは3レベルのメニューツリーです。レベル1にはHomeCatalogSupportMoreが含まれています。All-Mountainはレベル2のメニュー項目で、2つの子項目Cruise FlexBalance Rideがあります。

あなたはこのメニューツリーを構築するのにほとんどの時間を費やし、顧客が探しているコンテンツを見つけるのを助けます。

Catalog: A level 1 menu item, displayed as a tab on the tab bar. All-Mountain: Level 2 menu item that appears when you tap on Catalog.
Cruise Flex, Balance Ride: Level 3 menu item that appears when you tap on All-Mountain.

1.2. メニューツリーとの基本的なインタラクション

メニュー項目を上下または左右にドラッグ&ドロップして、その位置や親子関係を変更できます。

任意のメニュー項目にマウスをホバーすると、追加のオプションが表示されます:項目の詳細を編集する、メニューツリーから削除する、または他の場所にコピー&ペーストすることができます。

ヒント: 2つのブラウザタブでNavi+アプリを開くことで、1つのメニュー項目を別のメニューにコピーできます。

1.3. 重要!サンプルメニュー項目を削除し、必要な構造だけを保持してください。

これはNavi+でメニューを作成する際の一般的な状況です。新しいメニューを作成すると、レイアウトアイデアを示し、必要に応じてコピー/ペーストできる人気のメニュー項目を含む完全な例が含まれます。ただし、Navi+に不慣れでStarterプランを使用している場合は、画像のアップロードや高度なインタラクションの使用など、利用できない機能に対して多くの赤い(i)警告が表示されます。

これらの高度な機能が必要な場合は、BusinessまたはEliteプランへのアップグレードを検討してください。しかし、Starterプランを続けたい場合は、赤い(i)警告のあるメニュー項目を見つけて削除してください。

重要なヒント: 削除確認が表示されたら、「次回は再度尋ねない」をオンにして、より早く削除できます。

1.4. メニューツリーにメニュー項目を追加する

メニュー項目を追加するには、2つのオプションがあります:

オプション1**(Navi+に不慣れな場合は推奨しません)**: 「メニューを追加」をクリックして、メニューツリーの最後に空のメニュー項目を挿入します。この方法は、メニュー項目の設定をよく理解している必要があります。これは後で説明します。最初は圧倒されるかもしれませんので、後で探索してください。

オプション2(推奨): すでに多くのデザインされたメニュー項目テンプレートを用意しています。それらを適切な場所にコピー&ペーストするだけです。メニューツリーが完成したら、未使用のテンプレートを削除してください。