feat(comment): add Telegram Comments support (#180)

This commit is contained in:
Dillon 2020-03-17 22:39:25 +08:00 committed by GitHub
parent 6b03c711ac
commit 01d814ef6f
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
13 changed files with 274 additions and 203 deletions

View file

@ -31,16 +31,17 @@ Compared to the original LeaveIt theme and the KeepIt theme, the LoveIt theme ha
* More readable **dark mode**
* Some beautiful **CSS animations**
* Easy-to-use and self-expanding **table of contents**
* More **social links**, **share sites** and **comment system**
* Extended markdown syntax for **[Font Awesome](https://fontawesome.com/) icons**
* Extended markdown syntax for **ruby annotation**
* **Mathematical formula** support by [KaTeX](https://katex.org/)
* **Diagram syntax** shortcode support by [mermaid](https://github.com/knsv/mermaid)
* **Mathematical formula** supported by [KaTeX](https://katex.org/)
* **Diagram syntax** shortcode supported by [mermaid](https://github.com/knsv/mermaid)
* **Interactive data visualization** shortcode supported by [ECharts](https://echarts.apache.org/)
* Embedded **music player** support by [APlayer](https://github.com/MoePlayer/APlayer) and [MetingJS](https://github.com/metowolf/MetingJS)
* **Bilibili** player support
* Kinds of **admonitions** shortcode support
* Custom style shortcodes support
* **CDN** for all third-party libraries support
* Embedded **music player** supported by [APlayer](https://github.com/MoePlayer/APlayer) and [MetingJS](https://github.com/metowolf/MetingJS)
* **Bilibili** player supported
* Kinds of **admonitions** shortcode supported
* Custom style shortcodes supported
* **CDN** for all third-party libraries supported
* ...
In short,
@ -57,9 +58,9 @@ I hope you will LoveIt ❤️!
* Optimized for **performance**: 99/100 on mobile and 100/100 on desktop in [Google PageSpeed Insights](https://developers.google.com/speed/pagespeed/insights)
* Optimized SEO performance with a correct **SEO SCHEMA** based on JSON-LD
* [**Google Analytics**](https://analytics.google.com/analytics) support
* Search engine **verification** support (Google, Bind, Yandex and Baidu)
* **CDN** for third-party libraries support
* [**Google Analytics**](https://analytics.google.com/analytics) supported
* Search engine **verification** supported (Google, Bind, Yandex and Baidu)
* **CDN** for third-party libraries supported
* Automatically converted images with **Lazy Load** by [lazysizes](https://github.com/aFarkas/lazysizes)
### Appearance and Layout
@ -67,21 +68,22 @@ I hope you will LoveIt ❤️!
* **Responsive** layout
* **Dark/Light** mode
* Globally consistent **design language**
* **Pagination** support
* **Pagination** supported
* Easy-to-use and self-expanding **table of contents**
* **Multilanguage** support and i18n ready
* **Multilanguage** supported and i18n ready
* Beautiful **CSS animation**
### Social and Comment Systems
* **Gravatar** supported by [Gravatar](https://gravatar.com)
* Local **Avatar** support
* Up to **61** social sites supported
* Up to **28** share sites support
* Local **Avatar** supported
* Up to **61** social links supported
* Up to **28** share sites supported
* **Disqus** comment system supported by [Disqus](https://disqus.com)
* **Gitalk** comment system supported by [Gitalk](https://github.com/gitalk/gitalk)
* **Valine** comment system supported by [Valine](https://valine.js.org/)
* **Facebook comments** system supported by [Facebook](https://developers.facebook.com/docs/plugins/comments/)
* **Telegram Comments** system supported by [Comments](https://comments.app/)
### Extended Features

View file

@ -30,6 +30,7 @@
* 可读性更强的**暗黑模式**
* 一些美观的 **CSS 动画**
* 易用和自动展开的**文章目录**
* 支持更多的**社交链接**、**网站分享**和**评论系统**
* 支持基于 **[Font Awesome](https://fontawesome.com/) 图标**的扩展 Markdown 语法
* 支持**上标注释**的扩展 Markdown 语法
* 支持基于 [KaTeX](https://katex.org/) 的**数学公式**
@ -77,6 +78,7 @@
* 支持 **[Gitalk](https://github.com/gitalk/gitalk)** 评论系统
* 支持 **[Valine](https://valine.js.org/)** 评论系统
* 支持 **[Facebook](https://developers.facebook.com/docs/plugins/comments/) 评论**系统
* 支持 **[Telegram Comments](https://comments.app/) 评论**系统
### 扩展功能

View file

@ -301,11 +301,6 @@
.version {
font-weight: bold;
font-style: normal;
color: $global-highlight-color;
.dark-theme & {
color: $global-highlight-color-dark;
}
}
}

View file

@ -32,10 +32,6 @@ $global-link-hover-color-dark: #fff !default;
// Color of the border
$global-border-color: #dcdcdc !default;
$global-border-color-dark: #4a4b50 !default;
// Color of the highlight
$global-highlight-color: #df1a08 !default;
$global-highlight-color-dark: #fff !default;
// ========== Global ========== //
// ========== Scrollbar ========== //

View file

@ -249,6 +249,16 @@ enableEmoji = true
numPosts = 10
appId = ""
languageCode = "en_US"
# Telegram Comments Config (https://comments.app/)
[languages.en.params.comment.telegram]
enable = false
siteID = ""
limit = 5
height = ""
color = ""
colorful = true
dislikes = false
outlined = false
[languages.zh-cn]
weight = 2
@ -473,6 +483,16 @@ enableEmoji = true
numPosts = 10
appId = ""
languageCode = "zh_CN"
# Telegram Comments 评论系统设置 (https://comments.app/)
[languages.zh-cn.params.comment.telegram]
enable = false
siteID = ""
limit = 5
height = ""
color = ""
colorful = true
dislikes = false
outlined = false
[languages.fr]
weight = 3
@ -534,169 +554,179 @@ enableEmoji = true
url = "https://github.com/dillonzq/LoveIt"
title = "GitHub"
weight = 6
[languages.fr.params]
# site description
description = "À propos du thème LoveIt"
# site keywords
keywords = ["Thème", "Hugo"]
# site default theme ("light", "dark", "auto")
defaultTheme = "auto"
# Home Page Info
[languages.fr.params.home]
# Home Page Profile
[languages.fr.params.home.profile]
enable = true
# Gravatar Email for preferred avatar in home page
gravatarEmail = ""
# URL of avatar shown in home page
avatarURL = "/images/avatar.png"
# subtitle shown in home page
subtitle = "Un thème Hugo simple, élégant et efficace"
# whether to use typeit animation for subtitle
typeit = true
# whether to show social links
social = true
# disclaimer (HTML format is allowed)
disclaimer = ""
# Home Page Posts
[languages.fr.params.home.posts]
enable = true
# special amount of posts in each home posts page
paginate = 6
# default behavior when you don't set "hiddenFromHomePage" in front matter
defaultHiddenFromHomePage = false
# Social Info in home page
[languages.fr.params.social]
GitHub = "xxxx"
Linkedin = "xxxx"
Twitter = "xxxx"
Instagram = "xxxx"
Email = "xxxx@xxxx.com"
Facebook = "xxxx"
Telegram = "xxxx"
# Medium = "xxxx"
# Gitlab = "xxxx"
Youtubelegacy = "xxxx"
# Youtubecustom = "xxxx"
# Youtubechannel = "xxxx"
# Tumblr ="xxxx"
# Quora = "xxxx"
# Keybase = "xxxx"
# Pinterest = "xxxx"
# Reddit = "xxxx"
# Codepen = "xxxx"
# FreeCodeCamp = "xxxx"
# Bitbucket = "xxxx"
# Stackoverflow = "xxxx"
# Weibo = "xxxx"
# Odnoklassniki = "xxxx"
# VK = "xxxx"
# Flickr = "xxxx"
# Xing = "xxxx"
# Snapchat = "xxxx"
# Soundcloud = "xxxx"
# Spotify = "xxxx"
# Bandcamp = "xxxx"
# Paypal = "xxxx"
# Fivehundredpx = "xxxx"
# Mix = "xxxx"
# Goodreads = "xxxx"
# Lastfm = "xxxx"
# Foursquare = "xxxx"
# Hackernews = "xxxx"
# Kickstarter = "xxxx"
# Patreon = "xxxx"
# Steam = "xxxx"
# Twitch = "xxxx"
# Strava = "xxxx"
# Skype = "xxxx"
# Whatsapp = "xxxx"
# Zhihu = "xxxx"
# Douban = "xxxx"
# Angellist = "xxxx"
# Slidershare = "xxxx"
# Jsfiddle = "xxxx"
# Deviantart = "xxxx"
# Behance = "xxxx"
# Dribble = "xxxx"
# Wordpress = "xxxx"
# Vine = "xxxx"
# Googlescholar = "xxxx"
# Researchgate = "xxxx"
# Mastodon = "xxxx"
# MastodonPrefix = "https://mastodon.technology/"
# Thingiverse = "xxxx"
# Devto = "xxxx"
# Gitea = "xxxx"
# XMPP = "xxxx"
# Matrix = "xxxx"
# Bilibili = "xxxx"
# Social Share Links in post page
[languages.fr.params.share]
[languages.fr.params]
# site description
description = "À propos du thème LoveIt"
# site keywords
keywords = ["Thème", "Hugo"]
# site default theme ("light", "dark", "auto")
defaultTheme = "auto"
# Home Page Info
[languages.fr.params.home]
# Home Page Profile
[languages.fr.params.home.profile]
enable = true
Twitter = true
Facebook = true
Linkedin = true
Whatsapp = true
Pinterest = true
# Tumblr = true
HackerNews = true
# Reddit = true
# VK = true
# Buffer = true
# Xing = true
# Line = true
# Instapaper = true
# Pocket = true
# Digg = true
# Stumbleupon = true
# Flipboard = true
# Weibo = true
# Renren = true
# Myspace = true
# Blogger = true
# Baidu = true
# Odnoklassniki = true
# Evernote = true
# Skype = true
# Trello = true
# Mix = true
# Comment Config
[languages.fr.params.comment]
# Gravatar Email for preferred avatar in home page
gravatarEmail = ""
# URL of avatar shown in home page
avatarURL = "/images/avatar.png"
# subtitle shown in home page
subtitle = "Un thème Hugo simple, élégant et efficace"
# whether to use typeit animation for subtitle
typeit = true
# whether to show social links
social = true
# disclaimer (HTML format is allowed)
disclaimer = ""
# Home Page Posts
[languages.fr.params.home.posts]
enable = true
# Disqus Comment Config (https://disqus.com/)
[languages.fr.params.comment.disqus]
enable = false
# Disqus shortname to use Disqus in posts
shortname = ""
# Gitalk Comment Config (https://github.com/gitalk/gitalk)
[languages.fr.params.comment.gitalk]
enable = false
owner = ""
repo = ""
clientId = ""
clientSecret = ""
# Valine Comment Config (https://github.com/xCss/Valine)
[languages.fr.params.comment.valine]
enable = true
appId = "QGzwQXOqs5JOhN4RGPOkR2mR-MdYXbMMI"
appKey = "WBmoGyJtbqUswvfLh6L8iEBr"
placeholder = "Votre commentaire ..."
notify = false
verify = true
avatar = "mp"
meta= ""
pageSize = 10
lang = "en"
visitor = true
recordIP = true
# Facebook Comment Config (https://developers.facebook.com/docs/plugins/comments)
[languages.fr.params.comment.facebook]
enable = false
width = "100%"
numPosts = 10
appId = ""
languageCode = "fr"
# special amount of posts in each home posts page
paginate = 6
# default behavior when you don't set "hiddenFromHomePage" in front matter
defaultHiddenFromHomePage = false
# Social Info in home page
[languages.fr.params.social]
GitHub = "xxxx"
Linkedin = "xxxx"
Twitter = "xxxx"
Instagram = "xxxx"
Email = "xxxx@xxxx.com"
Facebook = "xxxx"
Telegram = "xxxx"
# Medium = "xxxx"
# Gitlab = "xxxx"
Youtubelegacy = "xxxx"
# Youtubecustom = "xxxx"
# Youtubechannel = "xxxx"
# Tumblr ="xxxx"
# Quora = "xxxx"
# Keybase = "xxxx"
# Pinterest = "xxxx"
# Reddit = "xxxx"
# Codepen = "xxxx"
# FreeCodeCamp = "xxxx"
# Bitbucket = "xxxx"
# Stackoverflow = "xxxx"
# Weibo = "xxxx"
# Odnoklassniki = "xxxx"
# VK = "xxxx"
# Flickr = "xxxx"
# Xing = "xxxx"
# Snapchat = "xxxx"
# Soundcloud = "xxxx"
# Spotify = "xxxx"
# Bandcamp = "xxxx"
# Paypal = "xxxx"
# Fivehundredpx = "xxxx"
# Mix = "xxxx"
# Goodreads = "xxxx"
# Lastfm = "xxxx"
# Foursquare = "xxxx"
# Hackernews = "xxxx"
# Kickstarter = "xxxx"
# Patreon = "xxxx"
# Steam = "xxxx"
# Twitch = "xxxx"
# Strava = "xxxx"
# Skype = "xxxx"
# Whatsapp = "xxxx"
# Zhihu = "xxxx"
# Douban = "xxxx"
# Angellist = "xxxx"
# Slidershare = "xxxx"
# Jsfiddle = "xxxx"
# Deviantart = "xxxx"
# Behance = "xxxx"
# Dribble = "xxxx"
# Wordpress = "xxxx"
# Vine = "xxxx"
# Googlescholar = "xxxx"
# Researchgate = "xxxx"
# Mastodon = "xxxx"
# MastodonPrefix = "https://mastodon.technology/"
# Thingiverse = "xxxx"
# Devto = "xxxx"
# Gitea = "xxxx"
# XMPP = "xxxx"
# Matrix = "xxxx"
# Bilibili = "xxxx"
# Social Share Links in post page
[languages.fr.params.share]
enable = true
Twitter = true
Facebook = true
Linkedin = true
Whatsapp = true
Pinterest = true
# Tumblr = true
HackerNews = true
# Reddit = true
# VK = true
# Buffer = true
# Xing = true
# Line = true
# Instapaper = true
# Pocket = true
# Digg = true
# Stumbleupon = true
# Flipboard = true
# Weibo = true
# Renren = true
# Myspace = true
# Blogger = true
# Baidu = true
# Odnoklassniki = true
# Evernote = true
# Skype = true
# Trello = true
# Mix = true
# Comment Config
[languages.fr.params.comment]
enable = true
# Disqus Comment Config (https://disqus.com/)
[languages.fr.params.comment.disqus]
enable = false
# Disqus shortname to use Disqus in posts
shortname = ""
# Gitalk Comment Config (https://github.com/gitalk/gitalk)
[languages.fr.params.comment.gitalk]
enable = false
owner = ""
repo = ""
clientId = ""
clientSecret = ""
# Valine Comment Config (https://github.com/xCss/Valine)
[languages.fr.params.comment.valine]
enable = true
appId = "QGzwQXOqs5JOhN4RGPOkR2mR-MdYXbMMI"
appKey = "WBmoGyJtbqUswvfLh6L8iEBr"
placeholder = "Votre commentaire ..."
notify = false
verify = true
avatar = "mp"
meta= ""
pageSize = 10
lang = "en"
visitor = true
recordIP = true
# Facebook Comment Config (https://developers.facebook.com/docs/plugins/comments)
[languages.fr.params.comment.facebook]
enable = false
width = "100%"
numPosts = 10
appId = ""
languageCode = "fr"
# Telegram Comments Config (https://comments.app/)
[languages.fr.params.comment.telegram]
enable = false
siteID = ""
limit = 5
height = ""
color = ""
colorful = true
dislikes = false
outlined = false
[params]
# LoveIt theme version

View file

@ -25,9 +25,9 @@ It is based on the original [LeaveIt Theme](https://github.com/liuzc/LeaveIt/) a
* :(fas fa-rocket): Optimized for **performance**: 99/100 on mobile and 100/100 on desktop in [Google PageSpeed Insights](https://developers.google.com/speed/pagespeed/insights)
* :(fab fa-searchengin): Optimized SEO performance with a correct **SEO SCHEMA** based on JSON-LD
* :(fab fa-google): [**Google Analytics**](https://analytics.google.com/analytics) support
* :(fas fa-search): Search engine **verification** support (Google, Bind, Yandex and Baidu)
* :(fas fa-tachometer-alt): **CDN** for third-party libraries support
* :(fab fa-google): [**Google Analytics**](https://analytics.google.com/analytics) supported
* :(fas fa-search): Search engine **verification** supported (Google, Bind, Yandex and Baidu)
* :(fas fa-tachometer-alt): **CDN** for third-party libraries supported
* :(fas fa-cloud-download-alt): Automatically converted images with **Lazy Load** by [lazysizes](https://github.com/aFarkas/lazysizes)
#### Appearance and Layout
@ -35,21 +35,22 @@ It is based on the original [LeaveIt Theme](https://github.com/liuzc/LeaveIt/) a
* :(fas fa-desktop): / :(fas fa-mobile): **Responsive** layout
* :(fas fa-moon): / :(fas fa-sun): **Dark/Light** mode
* :(fas fa-layer-group): Globally consistent **design language**
* :(fas fa-ellipsis-h): **Pagination** support
* :(fas fa-ellipsis-h): **Pagination** supported
* :(far fa-list-alt): Easy-to-use and self-expanding **table of contents**
* :(fas fa-language): **Multilanguage** support and i18n ready
* :(fas fa-language): **Multilanguage** supported and i18n ready
* :(fab fa-css3-alt): Beautiful **CSS animation**
#### Social and Comment Systems
* :(far fa-user): **Gravatar** supported by [Gravatar](https://gravatar.com)
* :(fas fa-user-circle): Local **Avatar** support
* :(far fa-id-card): Up to **61** social sites supported
* :(fas fa-share-square): Up to **28** share sites support
* :(fas fa-user-circle): Local **Avatar** supported
* :(far fa-id-card): Up to **61** social links supported
* :(fas fa-share-square): Up to **28** share sites supported
* :(far fa-comment): **Disqus** comment system supported by [Disqus](https://disqus.com)
* :(far fa-comment-dots): **Gitalk** comment system supported by [Gitalk](https://github.com/gitalk/gitalk)
* :(far fa-comment-alt): **Valine** comment system supported by [Valine](https://valine.js.org/)
* :(far fa-comments): **Facebook comments** system supported by [Facebook](https://developers.facebook.com/docs/plugins/comments/)
* :(fas fa-comments): **Telegram Comments** system supported by [Comments](https://comments.app/)
#### Extended Features

View file

@ -30,9 +30,9 @@ It is based on the original [LeaveIt Theme](https://github.com/liuzc/LeaveIt/) a
* :(fas fa-rocket): Optimized for **performance**: 99/100 on mobile and 100/100 on desktop in [Google PageSpeed Insights](https://developers.google.com/speed/pagespeed/insights)
* :(fab fa-searchengin): Optimized SEO performance with a correct **SEO SCHEMA** based on JSON-LD
* :(fab fa-google): [**Google Analytics**](https://analytics.google.com/analytics) support
* :(fas fa-search): Search engine **verification** support (Google, Bind, Yandex and Baidu)
* :(fas fa-tachometer-alt): **CDN** for third-party libraries support
* :(fab fa-google): [**Google Analytics**](https://analytics.google.com/analytics) supported
* :(fas fa-search): Search engine **verification** supported (Google, Bind, Yandex and Baidu)
* :(fas fa-tachometer-alt): **CDN** for third-party libraries supported
* :(fas fa-cloud-download-alt): Automatically converted images with **Lazy Load** by [lazysizes](https://github.com/aFarkas/lazysizes)
#### Appearance and Layout
@ -40,21 +40,22 @@ It is based on the original [LeaveIt Theme](https://github.com/liuzc/LeaveIt/) a
* :(fas fa-desktop): / :(fas fa-mobile): **Responsive** layout
* :(fas fa-moon): / :(fas fa-sun): **Dark/Light** mode
* :(fas fa-layer-group): Globally consistent **design language**
* :(fas fa-ellipsis-h): **Pagination** support
* :(fas fa-ellipsis-h): **Pagination** supported
* :(far fa-list-alt): Easy-to-use and self-expanding **table of contents**
* :(fas fa-language): **Multilanguage** support and i18n ready
* :(fas fa-language): **Multilanguage** supported and i18n ready
* :(fab fa-css3-alt): Beautiful **CSS animation**
#### Social and Comment Systems
* :(far fa-user): **Gravatar** supported by [Gravatar](https://gravatar.com)
* :(fas fa-user-circle): Local **Avatar** support
* :(far fa-id-card): Up to **61** social sites supported
* :(fas fa-share-square): Up to **28** share sites support
* :(fas fa-user-circle): Local **Avatar** supported
* :(far fa-id-card): Up to **61** social links supported
* :(fas fa-share-square): Up to **28** share sites supported
* :(far fa-comment): **Disqus** comment system supported by [Disqus](https://disqus.com)
* :(far fa-comment-dots): **Gitalk** comment system supported by [Gitalk](https://github.com/gitalk/gitalk)
* :(far fa-comment-alt): **Valine** comment system supported by [Valine](https://valine.js.org/)
* :(far fa-comments): **Facebook comments** system supported by [Facebook](https://developers.facebook.com/docs/plugins/comments/)
* :(fas fa-comments): **Telegram Comments** system supported by [Comments](https://comments.app/)
#### Extended Features

View file

@ -50,6 +50,7 @@ lightgallery: true
* :(far fa-comment-dots): 支持 **[Gitalk](https://github.com/gitalk/gitalk)** 评论系统
* :(far fa-comment-alt): 支持 **[Valine](https://valine.js.org/)** 评论系统
* :(far fa-comments): 支持 **[Facebook](https://developers.facebook.com/docs/plugins/comments/) 评论**系统
* :(fas fa-comments): 支持 **[Telegram Comments](https://comments.app/) 评论**系统
#### 扩展功能

View file

@ -385,6 +385,17 @@ Note that some of these parameters are explained in details in other sections of
numPosts = 10
appId = ""
languageCode = "en_US"
# {{< version 0.2.0 >}}
# {{< link "https://comments.app/" "Telegram Comments" >}} Config
[params.comment.telegram]
enable = false
siteID = ""
limit = 5
height = ""
color = ""
colorful = true
dislikes = false
outlined = false
# site verification code for Google/Bing/Yandex/Pinterest/Baidu
[params.verification]

View file

@ -390,6 +390,17 @@ Note that some of these parameters are explained in details in other sections of
numPosts = 10
appId = ""
languageCode = "en_US"
# {{< version 0.2.0 >}}
# {{< link "https://comments.app/" "Telegram Comments" >}} Config
[params.comment.telegram]
enable = false
siteID = ""
limit = 5
height = ""
color = ""
colorful = true
dislikes = false
outlined = false
# site verification code for Google/Bing/Yandex/Pinterest/Baidu
[params.verification]

View file

@ -386,7 +386,18 @@ hugo
width = "100%"
numPosts = 10
appId = ""
languageCode = "en_US"
languageCode = "zh_CN"
# {{< version 0.2.0 >}}
# {{< link "https://comments.app/" "Telegram Comments" >}} 评论系统设置
[params.comment.telegram]
enable = false
siteID = ""
limit = 5
height = ""
color = ""
colorful = true
dislikes = false
outlined = false
# 网站验证代码,用于 Google/Bing/Yandex/Pinterest/Baidu
[params.verification]

View file

@ -113,4 +113,14 @@
Please enable JavaScript to view the <a href="https://developers.facebook.com/docs/plugins/comments/">comments powered by Facebook.</a>
</noscript>
{{- end -}}
{{- /* Telegram Comments System */ -}}
{{- if .Site.Params.comment.telegram.enable -}}
{{- $telegram := .Site.Params.comment.telegram -}}
<div id="telegram-comments" class="comment"></div>
<script async src="https://comments.app/js/widget.js?2" data-comments-app-website="{{ $telegram.siteID }}" data-limit="{{ $telegram.limit | default 5 }}"{{ with $telegram.height }} data-height="{{ . }}"{{ end }}{{ with $telegram.color }} data-color="{{ . }}"{{ end }}{{ if $telegram.colorful }} data-colorful="1"{{ end }}{{ if $telegram.dislikes }} data-dislikes="1"{{ end }}{{ if $telegram.outlined }} data-outlined="1"{{ end }}></script>
<noscript>
Please enable JavaScript to view the <a href="https://comments.app/">comments powered by Telegram Comments.</a>
</noscript>
{{- end -}}
{{- end -}}