# 品牌与站点壳

[返回目录](../README.md)

站点壳包括 Header 品牌、导航和 Footer。`product-list-page` / `product-detail-page` 可以通过 `showHeader`、`showFooter` 控制是否显示。

## brand

品牌信息。

```json
{
  "brand": {
    "name": "Example Brand",
    "logoUrl": "https://example.com/logo.webp",
    "tagline": "Product Catalog"
  }
}
```

| 参数 | 说明 |
| --- | --- |
| `name` | 品牌名 |
| `logoUrl` | Logo 图片地址 |
| `tagline` | 副标题 |

## navitems

Header 导航。

```json
{
  "navItems": [
    { "label": "ABOUT US", "href": "/about-us" },
    {
      "label": "PRODUCTS",
      "href": "/products",
      "active": true,
      "children": [
        { "label": "SKINCARE", "href": "/products?category=skincare" },
        { "label": "MAKEUP", "href": "/products?category=makeup" }
      ]
    }
  ]
}
```

| 参数 | 说明 |
| --- | --- |
| `label` | 导航显示名 |
| `href` | 点击跳转地址 |
| `active` | 是否当前高亮 |
| `children` | 子导航。配置后鼠标移入该导航项会显示下拉菜单。分类链接可使用 `/products?category=<分类 code>`。 |

## footer

Footer 配置。

```json
{
  "footer": {
    "copyright": "© 2026 Example Brand",
    "contactEmail": "sales@example.com",
    "contactPhone": "+1 000 000 0000",
    "groups": [
      {
        "title": "Company",
        "links": [{ "label": "About", "href": "/about" }]
      }
    ]
  }
}
```