Scribd
Upload
0 views

Navbar API Usage

The document outlines the structure of a menu configuration system, detailing top-level objects, main menu categories, dropdowns, and media objects. It emphasizes the recursive nature of the menu, allowing for multi-level hierarchies and localization features. Additionally, it highlights the visibility control for different customer types and the use of SEO-friendly URLs for navigation.

Uploaded by

contactxloy
Copyright
© © All Rights Reserved
Available Formats
Download as PDF, TXT or read online on Scribd
0 views

Navbar API Usage

The document outlines the structure of a menu configuration system, detailing top-level objects, main menu categories, dropdowns, and media objects. It emphasizes the recursive nature of the menu, allowing for multi-level hierarchies and localization features. Additionally, it highlights the visibility control for different customer types and the use of SEO-friendly URLs for navigation.

Uploaded by

contactxloy
Copyright
© © All Rights Reserved
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 2

1.

Top-Level Object

Fields:
id : Unique identifier for the menu configuration.
created_at / updated_at : Timestamps for creation and updates.
color : Default color for the menu (e.g., #000 for black).
locale : Language setting (e.g., fr for French).
menuLists : An array of main menu categories (e.g., "FEMME", "HOMME", "ENFANT").

2. Main Menu Categories ( menuLists )

Structure:

{
"id": 9,
"menuName": "FEMME",
"menuLink": "/shop/1",
"color": "#FF0000",
"activeBTOC": true, // Visible for B2C customers
"activeBTOB": true, // Visible for B2B customers
"specificUrl": "1-femme",
"newUrl": "1-femme",
"dropdowns": [ ... ], // Submenu items
"mediaMenu": [ ... ] // Images/icons for this category
}

Key Fields :
dropdowns : Subcategories or submenu items.
mediaMenu : Images or media associated with the category (e.g., banners).

3. Dropdowns (Submenu Items)

Structure:

{
"id": 32,
"menuName": "NOUVEAUTÉS",
"menuLink": "/shop/519",
"color": "#ff0000",
"pos": 1, // Position/order in the menu
"activeBtoC": true, // Visibility for B2C
"activeBtoB": false, // Visibility for B2B
"specificUrl": "519-nouveautes-femme",
"newUrl": "519-nouveautes-femme",
"mediaMenu": { ... }, // Image for this submenu
"dropdowns": [ ... ] // Further nested submenus
}

Key Features :
Nesting: Each dropdown can have its own dropdowns , allowing infinite nesting (e.g., "VÊTEMENTS" → "Pantalons").
Activation Flags : activeBtoC / activeBtoB control visibility for different customer types.
SEO URLs: specificUrl and newUrl generate clean URLs (e.g., /shop/519 maps to 519-nouveautes-femme ).

4. Media Objects ( mediaMenu )

Structure:

{
"id": 10,
"name": "products4.jpg",
"url": "https://images.zen.com.tn/...",
"formats": {
"large": { ... },
"small": { ... },
"medium": { ... },
"thumbnail": { ... }
}
}
Purpose: Stores images for menu items, with multiple resolutions for responsive display.

5. Recursive Structure

Example:

FEMME (menuLists)
├── NOUVEAUTÉS (dropdowns)
├── VÊTEMENTS (dropdowns)
│ ├── Pantalons (dropdowns)
│ ├── Afficher tout (dropdowns)
│ │ └── ... (nested dropdowns)
│ └── Maille (dropdowns)
├── CHAUSSURES (dropdowns)
└── ACCESSOIRES (dropdowns)

Key Insight: The menu is a tree where each node ( dropdowns ) can have children ( dropdowns ), creating a multi-level hierarchy.

6. Special Features

Localization : Fields like menuName_en / menuName_ar suggest support for multiple languages.
Promotions/Flags: Items like "SOLDES" (sales) or "PROMOTION" have color: "#ff0000" for highlighting.
Dynamic Content: Some entries link to collections (e.g., "Spring Summer 2024") or personas (e.g., "FASHIONISTA").

7. Usage Example

User Path: A customer might navigate:

FEMME → VÊTEMENTS → Robes | Combinaisons → /shop/165

You might also like