Hexoにコメント機能のValineを追加
Disqusへ変更しました
環境
- Hexo 3.8.0
- hexo-theme-pinghsu 1.4.1
- Valine 1.3.6
Valineについて
Introduction | Valine
軽量でシンプルなコメントシステムです。
少し前から導入していました。
特徴
- 軽くて高速
- Markdownが使える
- Gravatar対応
- 絵文字対応
ここらへんがウリだと思いますが、とにかく軽いのは助かります。
いつコメントを貰えるのか分からないのに、重いと困りますから。
料金プラン
開発版は無料で使用できますが、リクエスト数が1日あたり30,000までなどとなっているので、アクセス数が多くなければいけそうな予感。
使用するには
Valineを使ってHexoにコメント機能を追加してみる - Qiita
LeanCloudを使用するのでアカウントを取る必要がありますが、中国サイトなので言語の壁が大変です。
Chromeのブラウザ翻訳でも一部が翻訳できていないということがよく起こるので、またGoogle翻訳したり面倒ですね。
とりあえず、アカウントを取りましたが、上記のサイトに詳しく載っているのでそちらでどうぞ。
電話番号を入力するところがあります。
LeanCloud 設定
ログイン後 > 右上ユーザーアイコン > 账号设置
アプリ作成
创建应用 > +押す
新应用名称 > valine
选择应用的计价方案 > 开发版 開発版
右下のボタン
アプリのキー取得
valine クリック > 应用 Key
使用するドメインを指定
安全中心 > Web 安全域名
https://fewlight.net/
保存
新着コメントクラス
第三方服务 · cccyb/hexo-theme-pinghsu Wiki
使用しているテーマの説明を参考にする。
存储 > 数据 > 创建 Class クリック
Class 名称 > Comment
设置数据条目的默认
限制写入 > 无限制 > 无限制
Valineのメール通知
βテスト中らしい
Valine 评论系统中的邮件提醒设置 · xCss/Valine Wiki · GitHub
どの記事にコメントされたか分からないので、記事の直接リンクもできず、できるのはサイトトップへのリンクぐらい。
Leancloudログイン > valine > 设置 > 邮件模板 > 用于重置密码的邮件主题
内容
1 | <p>Hi, {{username}}</p> |
下記へ
1 | <p>こんにちは、{{username}} </p> |
保存
コメント表示ですが、使用しているテーマが対応していて、スマホ以外の狭い横幅でないのならフッターで表示されるようになっています。
全部表示されるわけではないので、条件付きかもしれませんが。
後、コメントにリンクが飛ぶのではなくて、コメントがある記事にリンクが飛びます。
フッターは、テーマやコピーライトぐらいのすっきりした表示が好きなのですが、分かりやすさ重視で表示することにしました。
Hexoテーマ設定
C:/tools/hexo/themes/pinghsu/_config.yml
130行目
1 | valine: |
下記へ
1 | valine: |
appId
とappKey
は、取得した値を入力。visitor
はサイトトップで日付の代わりに表示されてしまうのでfalse
notify
はメール通知。verify
は、コメント投稿するときに計算式を表示して答えが合っているか確認するもの。lang
は英語で。参考サイトに記載されている日本語設定をすると、残念ながらEmoji
とPreview
がundefined
と表示されてしまう。
C:/tools/hexo/themes/pinghsu/layout/_partial/footer.ejs
238行目
1 | <script> |
下記へ
1 | <script> |
表示確認
後は、hexo s
で表示確認して、CSSで調整をすればいいと思います。
個別記事リンク付きのメール通知
他のテーマで参考になりそうなものを。
大変そうで難しそうでよく分からないということでやっていません。
ここまでやるなら、他のコメントシステムでいいような気もします。
まとめ
最近はコメントを外しているサイトも多いですが、無いよりかはあったほうがいいと思っています。
いざというときの連絡手段にもなりますしね。
メール通知の仕様が少し残念ですね。設定できそうとはいえ、どうしようか。
ちなみに、Disqusも試しましたが、表示が少し遅い気がします。
ログイン必須だと、そもそもコメントしない方が多いのではないかなと。
気になった方はコメントを試してみてください。
追記
2019-05-10
- Valineのメール通知を追加
- 個別記事リンク付きのメール通知を追加
2019-05-16
コメント機能をDisqusへ変更