Navigation

Usage Instructions

To use the layout configuration file:

  1. Open the ` layout ` Folder in a text editor.
  2. Open the `config.json` file.
  3. Customize the `company info`, `top bar`, `appbar ` and `footer` arrays according to your needs.
  4. Save the changes to the file.

Examples

1:Company Info

  
            "company_info": {
              "company_name": "Nextstore",
              "address": "Sargodha, Pakistan",
              "phone": "+923035501602"
            },

2: Topbar

  "top_bar":{
            "languages": [
              { "name": "English", "key": "en", "countryCode": "uk" },
              { "name": "عربي", "key": "ar", "countryCode": "sa" }
            ],
            "currencies": [
              {
                "name": "united-states-dollar",
                "prefix": "USD",
                "symbol": "US$"
              },
          
              { "name": "euro", "prefix": "EUR", "symbol": "€" },
          
              {
                "name": "british-pound",
                "prefix": "GBP",
                "symbol": "£"
              },
          
              {
                "name": "australian-dollar",
                "prefix": "AUD",
                "symbol": "A$"
              },
          
              {
                "name": "canadian-dollar",
                "prefix": "CAD",
                "symbol": "CA$"
              },
          
              {
                "name": "israeli-shekel",
                "prefix": "ILS",
                "symbol": "₪"
              },
          
              {
                "name": "brazilian-real",
                "prefix": "BRL",
                "symbol": "R$"
              },
          
              {
                "name": "hong-kong-dollar",
                "prefix": "HKD",
                "symbol": "HK$"
              },
          
              {
                "name": "swedish-krona",
                "prefix": "SEK",
                "symbol": "SEK"
              },
          
              {
                "name": "new-zealand-dollar",
                "prefix": "NZD",
                "symbol": "NZ$"
              },
          
              {
                "name": "singapore-dollar",
                "prefix": "SGD",
                "symbol": "SGD"
              },
          
              {
                "name": "swiss-franc",
                "prefix": "CHF",
                "symbol": "CHF"
              },
          
              {
                "name": "south-african-rand",
                "prefix": "ZAR",
                "symbol": "ZAR"
              },
          
              {
                "name": "chinese-renminbi-yuan",
                "prefix": "CNY",
                "symbol": "CN¥"
              },
          
              {
                "name": "indian-rupee",
                "prefix": "INR",
                "symbol": "₹"
              },
          
              {
                "name": "malaysian-ringgit",
                "prefix": "MYR",
                "symbol": "MYR"
              },
          
              {
                "name": "mexican-peso",
                "prefix": "MXN",
                "symbol": "MX$"
              },
          
              {
                "name": "pakistani-rupee",
                "prefix": "PKR",
                "symbol": "PKR"
              },
          
              {
                "name": "philippine-peso",
                "prefix": "PHP",
                "symbol": "₱"
              },
          
              {
                "name": "new-taiwan-dollar",
                "prefix": "TWD",
                "symbol": "NT$"
              },
          
              {
                "name": "thai-baht",
                "prefix": "THB",
                "symbol": "THB"
              },
          
              {
                "name": "turkish-new-lira",
                "prefix": "TRY",
                "symbol": "TRY"
              },
          
              {
                "name": "united-arab-emirates-dirham",
                "prefix": "AED",
                "symbol": "AED"
              }
            ]
          },

3: Appbar

    "appbar":{

            "desktop_menu": [
              {
                "title": "header.home",
                "path": "/"
              },
              {
                "title": "header.categories",
                "path": "/",
                "isDropdown": true
              },
              {
                "title": "header.man",
                "path": "/products?gender=men"
              },
              {
                "title": "header.women",
                "path": "/products?gender=women"
              },
              {
                "title": "header.kids",
                "path": "/products?gender=kids"
              }
            ],

            "mobile_menu": [
              {
                "name": "header.home",
                "href": "/"
              },
              {
                "name": "header.search",
                "href": "/search"
              },
              {
                "name": "header.product",
                "href": "/products"
              },
              {
                "name": "header.checkout",
                "href": "/checkout"
              },
              {
                "name": "header.user",
                "isUser": true,
                "href": "/auth/login"
              }
            ]
          },

4: Footer

  
            "footer":{
              "footer_links": [
                {
                  "headline": "footer.product",
                  "children": [
                    { "name": "footer.application", "href": "#" },
                    { "name": "footer.features", "href": "#" },
                    { "name": "footer.requirements", "href": "#" },
                    { "name": "footer.technology", "href": "#" }
                  ]
                },
                {
                  "headline": "footer.resources",
                  "children": [
                    { "name": "footer.changelogy", "href": "#" },
                    { "name": "footer.updates", "href": "#" },
                    { "name": "footer.providers", "href": "#" },
                    { "name": "footer.affiliat", "href": "#" },
                    { "name": "footer.roadmap", "href": "#" }
                  ]
                },               
                {
                  "headline": "footer.company",
                  "children": [
                    { "name": "footer.blog", "href": "#" },
                    { "name": "footer.about-us", "href": "#" },
                    { "name": "footer.contact-us", "href": "#" },
                    { "name": "footer.jobs", "href": "#" },
                    { "name": "footer.team", "href": "#" }
                  ]
                }
              ],
              "social_icons": [
                { "name": "FaceBook", "color": "#1672E6", "href": "#" },
                { "name": "Instagram", "color": "#F40052", "href": "#" },
                { "name": "Linkedin", "color": "#0962B7", "href": "#" },
                { "name": "Pinterest", "color": "#B7081B", "href": "#" }
              ]
            }

Troubleshooting

Issue: The menu items are not displaying correctly.

Solution: Ensure that the JSON syntax is correct, and the menu items are properly structured within the arrays.