搜索引擎优化指南3.0(《VuePress博客优化之增加Vssue评论功能》全文搜索)

　　搜索引擎优化指南3.0(《VuePress博客优化之增加Vssue评论功能》全文搜索)

　　如果一个网站有评论功能，它可以与读者建立交流，优化网站，还可以及时更新文章中的错误。

　　添加评论功能，主流是使用Valine和Vssue。

　　Valine 是一款基于 LeanCloud 的快速、简洁、高效的无后端评论系统，是一种无服务器云服务，提供数据存储、即时通讯等一站式后端服务。使用Valine需要注册LeanCloud，注册LeanCloud并使用服务，需要实名认证，最终效果如下：

　　

　　具体步骤请参考《VuePress博客优化：添加缬氨酸评论》

　　虽然 Vssue 是一个 Vue 驱动、基于 Issue 的评论插件，虽然有多个托管平台可用，但这里我使用的是 GitHub，并且我已经用我的 GitHub 实现了 文章 问题。同步。最终结果如下：

　　

　　具体步骤请参考《VuePress博客优化：添加Vssue评论》

　　6.全文搜索

　　VuePress 的内置搜索只会为页面的标题、h2、h3 和标签构建搜索索引。如果需要全文搜索，可以使用Algolia搜索。

　　Algolia是一个数据库实时搜索服务，可以提供毫秒级的数据库搜索服务，其服务可以很方便地以API的形式部署到网页、客户端、APP等场景中。

　　例如 VuePress 官方文档使用 Algolia 搜索。使用 Algolia 搜索的最大优势是方便。它会自动爬取网站的页面内容并建立索引。您只需要申请 Algolia 服务。在网站中添加一些代码，就像添加统计代码一样，然后就可以实现全文搜索功能了：

　　

　　具体步骤参考《VuePress博客优化：打开Algolia全文搜索》

　　7.搜索引擎优化

　　如果你想让你的网站被搜索引擎做，你必须做好SEO，而SEO涉及很多地方。建议新手阅读基础文档学习：

　　《百度搜索引擎优化指南2.0》

　　Google 搜索中心搜索引擎优化 (SEO) 初学者指南

　　很多事情都要做，比如自定义标题、描述、关键词、优化链接、重定向、生成站点地图，提交到搜索引擎平台，然后辅助多个站长平台使用，及时发现并优化问题。

　　详情请参考：

　　VuePress博客的SEO优化（一）站点地图和搜索引擎收录

　　VuePress 博客的 SEO 优化（二）重定向

　　VuePress博客的SEO优化（三）标题、链接优化

　　VuePress博客的SEO优化（四）Open Graph协议

　　VuePress博客的SEO优化（五）添加JSON-LD数据

　　VuePress博客的SEO优化（六）站长工具

　　8.PWA 兼容

　　PWA，英文全称：Progressive Web Apps，中文翻译：Progressive Web Apps。

　　要实现PWA，我们可以很方便的让我们的网站实现桌面图标、离线缓存、推送通知等功能。

　　要实现PWA，请参考《VuePress博客优化兼容PWA》

　　9. 修改样式

　　网站风格总有一些不符合你期望的东西。有时，您需要自己修改代码。

　　如果你想改变主题颜色，VuePress定义了一些变量供以后使用，你可以创建一个

　　.vuepress/styles/palette.styl

　　文件：

　　$accentColor

　　#3eaf7c

　　$文本颜色

　　#2c3e50

　　$边框颜色

　　#eaecef

　　$codeBgColor

　　#282c34

　　$arrowBgColor

　　#ccc

　　$badgeTipColor

　　#42b983

　　$badgeWarningColor

　　#ffe564,35%)

　　$badgeErrorColor

　　#DA5961

　　$navbarHeight

　　$sidebarWidth

　　$内容宽度

　　$homePageWidth

　　$MQNarrow

　　$MQMobile

　　$MQMobileNarrow

　　如果你想自定义样式，你可以创建一个

　　.vuepress/styles/index.styl

　　文件。这是一个 Stylus 文件，但您也可以使用普通的 CSS 语法。

　　更多颜色修改参考VuePress的palette.styl。

　　链接：#palette-styl

　　10.手写插件

　　有时候现有的插件达不到要求，需要自己写插件，但也要注意我们写的是VuePress插件还是markdown-it插件，比如我们复制代码，我们可以使用VuePress插件来实现，但是如果我们想在代码块中添加一个try按钮，点击跳转到对应的playground页面，也就是展开markdown语法，我们需要编写一个markdown-it插件。

　　但是不管你写什么插件，它都提供文章：

　　VuePress 插件：“从头开始实施 VuePress 插件”

　　Markdown 语法"

　　如有错误或不准确之处，请务必纠正我，非常感谢。如果喜欢或者有灵感，欢迎star，也是对作者的鼓励。