ReactPress最佳实践—搭建导航网站实战

小牛itbull2024-12-16 12:49

Github项目地址：https://github.com/fecommunity/easy-blog 欢迎Star。

近期，阮一峰在科技爱好者周刊第 325 期中推荐了一款开源工具------ReactPress，ReactPress一个基于 Next.js 的博客和 CMS 系统，可查看 demo站点。（@fecommunity 投稿）

导航站

可以通过后台配置分类网站，展示效果如下。

关键词搜索

可以根据关键词指定站内或者其他搜索引擎的方式搜索。

导航详情

点击导航地址后，会进入详情页，然后可以使用按钮跳转。

如何配置？

方式一：在config路径下的settings配置：

复制代码

interface IGlobalConfig {
  navConfig: NavSetting; // 导航配置
  urlConfig: any[]; // 地址配置
}

interface CategoryItem {
  label: string; // 展示的名称
  key: string; // 唯一标识
  url?: string; //地址
}

interface NavSetting {
  categories: CategoryItem[]; // 分类信息
  subCategories: {
    [k: string]: CategoryItem[]
  }
}

方式二：后台管理系统中配置

也是支持全局配置的。

体验地址：https://blog.gaoredu.com/nav

Github项目地址：https://github.com/fecommunity/easy-blog 欢迎Star。