LogoShipSaaS
网站配置

导航菜单

配置网站头部的导航菜单

定义网站头部的导航菜单链接,每个项目都是 MenuItemConfig

src/config/navbar-config.ts

export function getNavbarLinks(): MenuItemConfig[] {
  const links: MenuItemConfig[] = [
    { title: m.features, href: Routes.Features, external: false },
  ];
  if (websiteConfig.payment?.enable) {
    links.push({ title: m.pricing, href: Routes.Pricing, external: false });
  }
  if (websiteConfig.blog?.enable) {
    links.push({ title: m.blog, href: Routes.Blog, external: false });
  }
  links.push({
    title: m.pages,
    items: [
      {
        title: m.about.title,
        description: m.about.description,
        href: Routes.About,
        icon: IconBuilding,
        external: false,
      },
      // 更多下拉项...
    ],
  });
  return links;
}

导航栏根据功能开关(如 payment.enableblog.enable)有条件地显示链接。它支持简单链接和带有嵌套项的下拉菜单。下拉菜单可以包含图标和描述,以提供更丰富的用户体验。

下一步

现在您了解了导航栏配置,请探索其他相关主题:

On this page