Skip to main content

Exclude Lang

The excludeLang prop allows you to exclude the localization of URLs in the menu. This is useful when you want to render menu items with URLs that are not localized. The excludeLang prop can only be used with dynamic menus.

If you are using i18n in your project, your app's pages typically reside inside the src/app/[lang] folder. However, you may also have some pages outside the src/app/[lang] folder where you don't want localization. To prevent localization of these URLs, simply add excludeLang: true to the respective menu items. By default, excludeLang is set to false, so URLs are localized unless you specify excludeLang: true.

We have implemented this prop in the horizontalMenuData.tsx file located in the src/data/navigation folder.

Props​

excludeLang?: boolean
Default Value
excludeLang={false}

Example​

Here we have used dynamic menu example to render the horizontal menu. You may refer to the Dynamic Menu example for more information on the dynamic menu rendering.

/horizontal-menu/menu-render/exclude-lang

Source Code​

'use client'

// Third-party Imports
import classnames from 'classnames'

// Type Imports
import type { HorizontalMenuDataType } from '@/types/menuTypes'

// Component Imports
import HorizontalNav, { Menu } from '@menu/horizontal-menu'
import { GenerateHorizontalMenu } from '@compnoents/GenerateMenu'

// Style Imports
import styles from '../styles.module.css'

const menuData: HorizontalMenuDataType[] = [
  {
    label: 'Dashboards',
    children: [
      {
        label: 'Analytics',
        href: '/dashboards/analytics'
      },
      {
        label: 'eCommerce',
        href: '/dashboards/ecommerce'
      }
    ]
  },
  {
    label: 'Front Pages',
    href: '/front-pages/landing-page',
    target = '_blank',
    excludeLang: true
  },
  {
    label: 'Calendar'
  },
  {
    label: 'Menu Level',
    children: [
      {
        label: 'Menu Level 2.1'
      },
      {
        label: 'Menu Level 2.2',
        children: [
          {
            label: 'Menu Level 3.1'
          },
          {
            label: 'Menu Level 3.2'
          }
        ]
      }
    ]
  },
  {
    label: 'Documentation'
  }
]

const ExcludeLang = () => {
  return (
    <div className={classnames('flex items-center plb-2.5 pli-6 w-full', styles.customStyles)}>
      <HorizontalNav>
        <Menu>
          <GenerateHorizontalMenu menuData={menuData} />
        </Menu>
      </HorizontalNav>
    </div>
  )
}

export default ExcludeLang