博客折腾笔记③:搭建个人动态页面 iM

今天在少数派上看到一篇搭建类似微博的个人动态页面的指南,我非常感高兴:出于对实现私密树洞分享心情的需要以及言论审查的苦恼,我想在博客上实现这样的功能很久了。感谢原作者为不懂技术的脚本小子我造好了轮子,接下来只需简单配置即可实现所需功能了。

以下是我的配置过程:

参考文章:保卫表达:用后端 BaaS 快速搭建专属无点赞评论版微博 ——b 言 b 语

配置后端 BaaS

这里使用 LeanCloud 国际版

登入后创建应用并命名

进入新建好的应用,点击新建Class,将新建的 Class 命名为 content

同时设置下方 create 、delete 、update 三项权限为” 指定用户 “,其他权限默认即可

点击刚创建的 content Class

点击 添加列 并创建名称为 content 的「列」,类型为 String

完成后点击左侧设置 - 应用 Keys,记录三组 Keys 备用

配置客户端发送工具

Winodws:使用 Quicker

Quicker 模板地址:点击安装

安装模板后右键编辑模板,修改变量定义和其他内容

尝试发送一次请求,如果配置正确,在 LeanCloud 的后台刷新就能看到一条记录了。此后的删除、修改,都需要通过该后台进行。

Android

请参考我的另一篇文章

在博客上添加界面

在博客 /source 下新建文件夹 iM

下载作者提供的页面文件

将其复制到 /source/iM 下,打开编辑器自行修改其中内容

请注意填写 53-54 行的 appIdappKey

修改后打开博客根目录_config.yml,在 skip_render 添加新建好的 iM 文件夹

1
2
3
skip_render: 
- "404.html"
- "iM/**"

保存后打开所用主题文件夹下的_config.yml,向菜单栏添加 iM 的入口

这里以主题 NeXT 为例:编辑 menu 下面的内容,添加 iM: /iM/ || user

1
2
3
4
5
6
7
8
9
10
11
# Usage: `Key: /link/ || icon`
# Key is the name of menu item. If the translation for this item is available, the translated text will be loaded, otherwise the Key name will be used. Key is case-senstive.
# Value before `||` delimiter is the target link, value after `||` delimiter is the name of Font Awesome icon.
# When running the site in a subdirectory (e.g. yoursite.com/blog), remove the leading slash from link value (/archives -> archives).
# External url should start with http:// or https://
menu:
home: / || home
categories: /categories/ || th
tags: /tags/ || tags
archives: /archives/ || archive
iM: /iM/ || user

完成后终端依次输入

1
2
3
hexo clean
hexo g
hexo s

打开 localhost:4000 查看效果

To-Do

  • index.md,参考 Cytus2 里的界面魔改?
  • hexo-blog-encrypt 加密页面?