【个人博客搭建及配置五】评论系统

ConardLi

发布于 2019-09-08 14:43:56

6280

发布于 2019-09-08 14:43:56

文章被收录于专栏：code秘密花园

导读：

分类：技术干货

题目：评论系统

史上最全个人博客搭建教程系列...

博客使用valine作为评论工具，原因是他使用简介，体积轻量，灵活配置，速度很快！

注册LeanCloud

valine借助了LeanCloud的力量，所以需要LeanCloud的APP ID 和 APP Key

首先注册和登录LeanCloud

创建一个应用：

应用创建好以后，进入刚刚创建的应用，选择左下角的设置>应用Key，然后就能看到你的APP ID和APP Key了：

代码

将如下代码插入你的文章模板中

<head>
...
<script src="//cdn1.lncld.net/static/js/3.0.4/av-min.js"></script>
<script src='//unpkg.com/valine/dist/Valine.min.js'></script>
...
</head>
<body>
...
<div id="vcomments"></div>
<script>
new Valine({
el: '#vcomments',
appId: '<API_ID>',
appKey: '<API_Key>'
})
</script>
</body>

数据管理

配置好这些，等待两分钟，就可以在文章里使用你的评论啦。

由于Valine 是无后端评论系统，所以也就没有开发评论数据管理功能。

可以在leanCloud中管理评论

登录>选择你创建的应用>存储>选择Class Comment

安全域名

为了数据安全，在leanCloud中配置你的安全域名

配置项

Valine还有一些其他的配置项

new Valine({
el: '#vcomments' ,
appId: '<APP_ID>',
appKey: '<APP_KEY>',
notify:false,
verify:false,
avatar:'mm',
placeholder: 'just go go'
});
placeholder
类型:String
默认值:Just go go
必要性:false
评论框占位提示符。
notify
类型:Boolean
默认值:false
必要性:false
评论回复邮件提醒，请参考配置。
verify
类型:Boolean
默认值:false
必要性:false
验证码服务。
path
类型:String
默认值:window.location.pathname
必要性:false
当前文章页路径，用于区分不同的文章页，以保证正确读取该文章页下的评论列表。
可选值：
window.location.pathname (默认值，推荐)
window.location.href
自定义
I. 请保证每个文章页路径的唯一性，否则可能会出现不同文章页下加载相同评论列表的情况。
II. 如果值为window.location.href，可能会出现随便加不同参数进入该页面，而被判断成新页面的情况。
avatar
类型:String
默认值:mm
必要性:false
Gravatar 头像展示方式。
可选值：
''(空字符串)
mp
identicon
monsterid
wavatar
retro
robohash
hide
更多信息，请查看头像配置。
meta
类型:Array
默认值:['nick','mail','link']
必要性:false
评论者相关属性。
pageSize
类型:Number
默认值:10
必要性:false
评论列表分页，每页条数。
lang
类型:String
默认值:zh-cn
必要性:false
多语言支持。
可选值：
zh-cn
en
如需自定义语言，请参考i18n。
visitor
类型:Boolean
默认值:false
必要性:false
文章访问量统计。
highlight
类型：Boolean
默认值: true
必要性: false
代码高亮，默认开启，若不需要，请手动关闭
avatarForce
类型: Boolean
默认值: false
必要性: false

本文参与腾讯云自媒体同步曝光计划，分享自微信公众号。

原始发表：2018-12-14，如有侵权请联系 cloudcommunity@tencent.com 删除

数据结构

编程算法

css

本文分享自 code秘密花园微信公众号，前往查看

如有侵权，请联系 cloudcommunity@tencent.com 删除。

本文参与腾讯云自媒体同步曝光计划，欢迎热爱写作的你一起参与！

数据结构

编程算法

css

登录后参与评论

0 条评论

热度

【个人博客搭建及配置五】评论系统

【个人博客搭建及配置五】评论系统

配置项

社区

活动

资源

关于

腾讯云开发者

热门产品

热门推荐

更多推荐