添加说说页面并自定义 | Artitalk

天水 581 3 min

在单独页面添加Artitalk相应代码实现博客说说功能

LeanCloud 配置应用

创建应用

创建 class

数据存储 -> 结构化数据 -> 创建 Class

创建 atComment

添加用户

内建用户 -> 用户管理 -> 添加用户

设置 shuoshuo 权限

数据存储 -> 结构化数据 -> shuoshuo -> 权限 -> Class 访问权限

将 add_fields create delete update 权限设为指定用户

为用户添加头像

数据存储 -> 结构化数据 -> _User -> 添加列

添加列，列名为 img

添加头像 url

设置 _User 权限

数据存储 -> 结构化数据 -> _User -> 权限 -> Class 访问权限

查看应用凭证

设置 -> 应用凭证

复制 AppID AppKey

Hexo 配置 shuoshuo

创建说说页

hexo new page shuoshuo

配置 shuoshuo/index.md

---
title: 说说
layout: shuoshuo
---

<script type="text/javascript" src="https://unpkg.com/artitalk"></script>

<div id="artitalk_main"></div>
<script>
new Artitalk({
    appId: '5fg3W8hOstfnjveOC0IAFWko-MdYXbMMI', 
    appKey: 'KR98rkqDVXNyUv0Ny0H0FuBS', 
})
</script>

远端部署

hexo clean & hexo deploy

个性化参数配置

new Artitalk({
        appId: '6lnrhdDqwW5Xm5Qc2R1artxj-MdYXbMMI',
        appKey: 'OjKfqahsJRiA1cpzQSJPQoUj',
        atEmoji: {
              baiyan: "https://cdn.jsdelivr.net/gh/Artitalk/Artitalk-emoji/baiyan.webp",
              bishi: "https://cdn.jsdelivr.net/gh/Artitalk/Artitalk-emoji/bishi.webp",
              bizui: "https://cdn.jsdelivr.net/gh/Artitalk/Artitalk-emoji/bizui.webp",
              chan: "https://cdn.jsdelivr.net/gh/Artitalk/Artitalk-emoji/chan.webp",
              daku: "https://cdn.jsdelivr.net/gh/Artitalk/Artitalk-emoji/daku.webp",
              dalao: "https://cdn.jsdelivr.net/gh/Artitalk/Artitalk-emoji/dalao.webp",
              dalian: "https://cdn.jsdelivr.net/gh/Artitalk/Artitalk-emoji/dalian.webp",
              dianzan: "https://cdn.jsdelivr.net/gh/Artitalk/Artitalk-emoji/dianzan.webp",
              doge: "https://cdn.jsdelivr.net/gh/Artitalk/Artitalk-emoji/doge.webp",
              facai: "https://cdn.jsdelivr.net/gh/Artitalk/Artitalk-emoji/facai.webp",
              fadai: "https://cdn.jsdelivr.net/gh/Artitalk/Artitalk-emoji/fadai.webp",
              fanu: "https://cdn.jsdelivr.net/gh/Artitalk/Artitalk-emoji/fanu.webp",
        },
        atComment: true,
        motion: true,
        pageSize: 10,
        lang: zh,
        avatarPla: "你的头像url",
        shuoPla: "左眼跳财，右眼封建迷信",
        bgImg: "https://ovo.btwoa.com/img/webp/202203220157641.gif",
        color1: 'linear-gradient(166deg, rgb(56, 0, 253) 8%, rgb(128, 0, 228) 20%, rgb(255, 0, 146) 40%, rgb(255, 111, 177) 65%, rgb(255, 71, 64) 90%)',
        color2: 'linear-gradient(166deg, rgb(253, 218, 255) 8%, rgba(200, 175, 233) 20%, rgb(173, 205, 252) 40%, rgb(173, 252, 244) 65%, rgb(202, 248, 208) 90%)',
        color3: 'rgba(255,255,255,1)',
    })