# 基于 Nuxtjs SSR 渲染的 WordPress 主题 Lareina

外形相近，内里大不同

自从接触了 Vue 以后，我就一直想要用 Vue 写一个 WordPress 主题，正好发现 WordPress 自身就带了 REST API。于是在去年12月份就写了一个极简的 WordPress 主题，不过是基于 Vue 的单页面应用，虽然实际体验很好，但是毕竟是单页面应用，SEO是不用想了的，而且如果页面多的话，首屏呈现时间（加载时间会很长）。所以并不怎么喜欢。后来发现了有后端渲染这个东西，很想研究一下，但是没有时间，也没有技术。这几个月基本都在准备考试，完全抽不出时间来研究。这个月终于把考试都解决了，所以这个主题就诞生了。

我是从 5/20 日开始写，5/29 日上线部署，5/30 部署完成。大概花了整整十天时间。遇到了无数的问题，通过啃官方 Handbook 和 Google ，基本都解决了。

不过昨天部署的时候遇到了很多的问题，尝试了很久，最后是把文件都上传到服务器进行 build 才解决。。。不知道是本地跟服务器 build 的结果不一样还是怎么回事。。。后端服务器这一块其实我也不是很会。。。

这个主题的海报生成部分代码来自xuanmo，另外借鉴了一下他的主题结构。此主题的部分动画效果参考了下Mirages，在此对两位作者表示感谢！

这是一款简洁的单栏的适合阅读的 WordPress 主题，适合放大量文字、代码以及图片。

# 功能与特性：

Ver 1.0.0

• 简洁
• 响应式设计，适配各种大小屏幕
• 搜索自动匹配，快速到达目标文章
• Schema
• 文章评分
• 两种评论样式（直接显示/伸缩对话框）
• 两种评论头像显示（文字头像/Gravatar）
• 两种评论等级显示（文字/图片）
• 两种导航栏样式切换（就是自适应下不同屏幕宽度下的那两种）
• 针对Retina设备优化
• 针对移动设备优化
• 针对macOS优化（并没有针对Windows，没设备，懒）
• 支持无刷新操作
• 黑、白及棕色多种主题
• 自动模式，会根据用户当地时间自动切换主题色。适配macOS下深色模式(Safari浏览器)
• 自定义主题色调（Sass）
• 自带卡片式友链样式
• 文章目录树显示
• 自带代码高亮功能
• 文章/评论表情功能
• (评论、文章中均可使用)
• 强大友好的后台配置选项
• 其他很多主题应有的功能

就这样。

# 已知问题：

Ver 1.0.0

• 返回顶部在Safari下无效(已修复)
• 字体更换在Windows下无效（少字体）（已修复）
• list样式不好看（已修复）
• 文章外链需要新窗口打开（已修复）
• 移动端可能无法评分（:hover和text-align的问题）(已修复)
• 移动端文章页面刷新后无法显示图标（没有加载css）(已修复)
• 移动端弹出输入框页面放大问题(已修复)
• 移动端搜索点击出问题(已修复，全是iOS弹出输入框的锅，太难弄了。)
• 部分小屏幕手机侧边栏打开二级菜单时会遮挡底部工具按钮，和details页面工具按钮位置调高一点。（已修复）
• TOC导航背景色