自定义落地页

MuseMVP 的落地页（Landing Page）高度可定制，核心配置与自定义逻辑集中在 src/config 目录。通过修改配置文件和自定义组件，即可实现品牌化、功能开关与内容替换。

配置目录结构

首页定制 (custom-page-home)

src/config/custom-page-home.tsx 控制首页各区块的显示与顺序：

const systemShowConfig = {
  hero: true,           // Hero 区域
  featuresShowcase: true,
  ctaSection: true,
  pricingSection: true,
  faqSection: true,
  newsletter: true,
};

将对应 systemShowConfig 值设为 false 即可隐藏该区块。如需替换为自定义组件，可在 PLACEHOLDER 注释处插入。

功能开关 (config.ui)

在 src/config/index.ts 的 config.ui 中控制页面可见性：

导航与页脚 (custom-common)

src/config/custom-common.ts 提供：

• getHeaderMenuItems()：Header 导航菜单项（含 headerMenuMap 文案）
• useFooterLinks()：页脚链接分组
• useFooterSocialIcons()：页脚社交图标

config.ui.headerConfig.customRoutes 可添加自定义导航项（支持 position: "left" | "center" | "right"）。

定价页 (custom-page-pricing)

src/config/custom-page-pricing.tsx 控制定价页内容。当 config.payments.enableBilling 为 false 时会重定向到首页。

定价文案与套餐展示由 src/config/saas/pricing-desc-usage.ts 和 pricing-desc.ts 决定。

• pricing-desc.ts：套餐标题、描述和功能点文案
• pricing-desc-usage.ts：实际可购买的价格项、productId 与计费行为

如果你想展示“原价 $249，现价 $199”这类划线价效果，应在 pricing-desc-usage.ts 中这样配置：

{
  type: "one-time",
  productId: billingProductCatalog.lifetime.productId,
  gatewayProductIds: billingProductCatalog.lifetime.gatewayProductIds,
  originalAmount: 249,
  amount: 199,
  currency: "USD",
}

字段语义：

• amount：实际传给支付网关、用于结算的价格
• originalAmount：可选的展示字段，只用于定价卡片中的划线原价展示

只有当 originalAmount > amount 时，前端才会显示划线原价；如果不填，则只展示当前价格。

FAQ 定制 (custom-faq)

src/config/custom-faq.ts 提供：

• useFaqData()：FAQ 列表数据（question、answer）
• useFaqSectionData()：FAQ 区块标题、描述等

可在 PLACEHOLDER 处插入自定义 FAQ 数据，或通过 i18n 文案（faq.items.*）配置。

法律页 (custom-legal)

src/config/custom-legal.ts 控制隐私政策、服务条款、社区规范等法律页内容：

快速定制流程

相关文档