Site identity, name, and navigation config

Two files control how Birthday Wall presents itself to browsers, search engines, and visitors: lib/site-config.ts handles the site’s identity and metadata, while lib/nav-config.ts controls which pages appear in the navigation bar and in what order. You’ll typically update both when you first set up a new deployment.

Site identity — `lib/site-config.ts`

The siteConfig object exposes five fields that flow into <title> tags, Open Graph metadata, and the admin panel header.

name

string

Used as the browser tab title and the Open Graph og:title value. Shown whenever someone shares a link to your site on social platforms. Default: "helloazhen | 生日空间".

title

string

Mirrors name and is used interchangeably in metadata components. Set both to the same value to keep titles consistent across the site.

description

string

The meta description read by search engines and displayed in social link previews. Keep it under 160 characters. Default: "为 TA 送上最特别的生日祝福".

adminTitle

string

The heading shown at the top of the admin panel (/admin). It does not affect the public-facing site. Default: "管理后台".

url

string

The canonical base URL of your deployment. Read from the NEXT_PUBLIC_SITE_URL environment variable, with a hardcoded fallback. This value is used when constructing absolute links in emails, share features, and OG tags. Default fallback: "https://helloazhen.com".

Customization example

export const siteConfig = {
  name: "Alex's Birthday | Birthday Space",
  title: "Alex's Birthday | Birthday Space",
  description: "Send Alex your warmest birthday wishes!",
  adminTitle: "Admin Panel",
  url: process.env.NEXT_PUBLIC_SITE_URL || "https://alex-birthday.vercel.app",
};

The url field should exactly match your deployed domain. It is used when generating absolute links in emails and share features — a mismatch will produce broken links.

The navConfig.pages array defines every entry in the top navigation bar. Each item maps to a PageConfig object:

Field	Type	Description
`id`	`string`	Unique identifier for the page (e.g. `"home"`, `"radio"`)
`name`	`string`	Label displayed in the nav bar
`path`	`string`	Route path (e.g. `"/"`, `"/radio"`)
`icon`	`string`	Emoji icon shown next to the label
`visible`	`boolean`	Set to `false` to hide the page from the nav bar
`order`	`number`	Controls the left-to-right display order; lower numbers appear first

Default config

export const navConfig = {
  pages: [
    { id: "home",   name: "首页",   path: "/",       icon: "🏠", visible: true, order: 1 },
    { id: "radio",  name: "电台",   path: "/radio",  icon: "🎵", visible: true, order: 2 },
    { id: "write",  name: "写祝福", path: "/write",  icon: "✏️", visible: true, order: 3 },
    { id: "report", name: "报告",   path: "/report", icon: "📊", visible: true, order: 4 },
    { id: "games",  name: "游戏室", path: "/games",  icon: "🎮", visible: true, order: 5 },
  ] as PageConfig[],
};

Customization example

To rename labels, reorder items, or hide pages you don’t need, edit the array directly:

export const navConfig = {
  pages: [
    { id: "home",   name: "Home",     path: "/",       icon: "🏠", visible: true,  order: 1 },
    { id: "radio",  name: "Radio",    path: "/radio",  icon: "🎵", visible: true,  order: 2 },
    { id: "write",  name: "Wishes",   path: "/write",  icon: "✏️", visible: true,  order: 3 },
    { id: "report", name: "Report",   path: "/report", icon: "📊", visible: false, order: 4 },
    { id: "games",  name: "Games",    path: "/games",  icon: "🎮", visible: true,  order: 5 },
  ] as PageConfig[],
};

In the example above, the Report page is hidden from the nav by setting visible: false. The page still exists at /report — it just won’t appear as a navigation link.

Get Started

Features

Customization

Site identity, name, and navigation config

Site identity — `lib/site-config.ts`

Customization example

Navigation — `lib/nav-config.ts`

Default config

Customization example

​Site identity — lib/site-config.ts

​Customization example

​Navigation — lib/nav-config.ts

​Default config

​Customization example

Site identity — `lib/site-config.ts`

Customization example

Navigation — `lib/nav-config.ts`

Default config

Customization example