arritalk

最新推荐文章于 2024-08-31 08:52:58 发布

原创最新推荐文章于 2024-08-31 08:52:58 发布 · 315 阅读

0 ·

CC 4.0 BY-SA版权

博客同时被 2 个专栏收录

4 篇文章

订阅专栏

微语

1 篇文章

订阅专栏

前言

看到别人有弄这个说说这个小页面，心想自己要不实现一个？

效果是这样滴：
传送门：
说说心情页，开源项目： artitalk.js.org

设置记录参考

申请leancloud国际版账号

前往leancloud国际版，注册账号。(需要验证邮箱)
创建应用
验证手机号在右上角，方便消息管理跟之后信息找回。

后台设置

可以收藏这个地址：https://console.leancloud.app/#/apps（直达书签任务栏）
添加用户（存储->结构化数据->_User->添加行）
添加用户
权限设置（存储->结构化数据->_User->权限）

前4个都设置为指定的指定用户、用户名

在这里插入图片描述

完成之后

在这里插入图片描述

获得应用秘钥AppID和Appkey
可以设置你的域名，如果有的话（设置->安全中心->下滑找到Web安全域名）(可选)

博客配置

注：我的是butterfly主题

配置butterfly.yml配置文件
这里给出配置主题目录作为导航source_data\butterfly.yml
创建页面source\artitalk\index.md

根据使用文档中的设置：Artitalk使用文档

配置说明：
1. 必须：修改img、appID、appKey、usernam
2. 选做：还可以修改placeholder提示和url图片地址
index.md文件具体可以参考的我的自行修改

---
title: 微语
type: artitalk
noDate: 'true'
comments: 'false'
img: https://cdn.jsdelivr.net/gh/chuchendjs/picgo/picgo/bt-sonny.jpg
---
<head>
  <script src="https://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script>
</head>
  <body>
      <script>
        var imgurl = "https://cdn.jsdelivr.net/gh/chuchendjs/picgo/picgo/bt-sonny.jpg"; //说说旁边显示的头像
        var appID = "你的appid";
        var appKEY = "你的Appkey";
        var per = "5"; //每页显示说说的数量
        var username = "bt-sonny"; //Leancloud中设置的用户名
        var placeholder1="只有bt-sonny才能评论哦"; //在编辑说说的输入框中的占位符
        var placeholder2="没有密码，不能评论！";  //在编辑密码的输入框中的占位符
        var lazy =1; //是否开启懒加载动画
        var bgimg = "https://cdn.jsdelivr.net/gh/chuchendjs/picgo/picgo/artitalk_bg.gif"; //背景动画
      </script>
      <div id="lazy"></div>
      <div id="artitalk"></div>
      <!-- <script type="text/javascript" src="https://cdn.jsdelivr.net/gh/drew233/artitalk/source/v1.0.0/artitalk.js"></script> -->
      <script type="text/javascript" src="https://unpkg.com/artitalk@1.2.6/artitalk.js"></script>
      <!-- <script type="text/javascript" src="https://unpkg.com/artitalk"></script> -->
  </body> //根据自己的需要修改版本
</html>

发说说心情

点biu,即可成功发布说说。

有图片的话，也可以预览再发布哟~

说明：

我这里用的是1.2.6的版本，所以要做一下小改动
去到官方的更新日志：传送门

更新时间： 2020.5.26 16:05 (1.2.5版本，在这个版本基础上做修改)

操作

bug修复，老用户的话需要操作一下。具体操作如下：
1. 进入shuoshuo class
2. 点击批量操作->增加条件->选择列增加条件imgurl(如果你的选择列中没有这一列，新建一个列命名为imgurl即可)->条件里面选does not exist->测试条件->下一步
3. 选择操作类型->更新数据->选择要更新的列imgurl->set->然后输入你的默认头像链接->下一步(头像链接如果填错了，可以通过同样的操作进行修改)
4. 选中跳过所有权限校验机制然后点击连续运行，等它执行完就可以进行下一步了。
5. 注：最后在1.2.6版本发布说说，若出现头像未定义，请在你发布说说那里重新登录，或者清除浏览器缓存，这样就可以正常加载了
6. 提醒：需要删除发布的说说数据的话，就去后台登录删除就OK了