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

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。

相关推荐
学不动CV了23 分钟前
单片机ADC采集机理层面详细分析(二)
c语言·arm开发·stm32·单片机·嵌入式硬件·开源·51单片机
Danny_FD26 分钟前
Vue + Element UI 实现模糊搜索自动补全
前端·javascript
gnip31 分钟前
闭包实现一个简单Vue3的状态管理
前端·javascript
Enddme39 分钟前
《面试必问!JavaScript 中this 全方位避坑指南 (含高频题解析)》
前端·javascript·面试
你怎么知道我是队长1 小时前
python---eval函数
开发语言·javascript·python
用户2519162427111 小时前
Canvas之图像合成
前端·javascript·canvas
Mintopia1 小时前
🎯 光与面的命运交锋:Möller-Trumbore 线段三角形相交算法全解析
前端·javascript·计算机图形学
Ares-Wang1 小时前
Vue》》@ 用法
前端·javascript·vue.js
心.c2 小时前
JavaScript单线程实现异步
开发语言·前端·javascript·ecmascript
爱分享的程序员2 小时前
前端面试专栏-前沿技术:31.Serverless与云原生开发
前端·javascript·面试