Integration with just-comments (#468)

Add support for just-comments
This commit is contained in:
Hugo Alves 2019-03-25 22:07:45 +00:00 committed by Dean Attali
parent 843128c0ce
commit e6cc1835f7
5 changed files with 18 additions and 2 deletions

View File

@ -104,7 +104,7 @@ Many personalization settings in `_config.yml`, such as setting your name and si
### Allowing users to leave comments ### Allowing users to leave comments
If you want to enable comments on your site, Beautiful Jekyll supports either the [Disqus](https://disqus.com/) comments plugin, [Facebook](https://developers.facebook.com/docs/plugins/comments) comments or [Staticman](https://staticman.net). If any of these are set in the configuration file, then all blog posts will have comments turned on by default. To turn off comments on a particular blog post, add `comments: false` to the YAML front matter. If you want to add comments on the bottom of a non-blog page, add `comments: true` to the YAML front matter. If you want to enable comments on your site, Beautiful Jekyll supports either the [Disqus](https://disqus.com/) comments plugin, [Facebook](https://developers.facebook.com/docs/plugins/comments) comments, [Staticman](https://staticman.net) or [just-comments](https://just-comments.com). If any of these are set in the configuration file, then all blog posts will have comments turned on by default. To turn off comments on a particular blog post, add `comments: false` to the YAML front matter. If you want to add comments on the bottom of a non-blog page, add `comments: true` to the YAML front matter.
#### Disqus comments #### Disqus comments
@ -118,6 +118,10 @@ To use Facebook comments, create a Facebook app using [Facebook developers](http
To use Staticman, you first need to invite `staticmanlab` as a collaborator to your repository (by going to your repository **Settings** page, navigate to the **Collaborators** tab, and add the username `staticmanlab`), and then accept the invitation by going to `https://staticman3.herokuapp.com/v3/connect/github/<username>/<repo-name>`. Lastly, fill in your `repository` and `branch` in the Staticman section of `_config.yml`. To use Staticman, you first need to invite `staticmanlab` as a collaborator to your repository (by going to your repository **Settings** page, navigate to the **Collaborators** tab, and add the username `staticmanlab`), and then accept the invitation by going to `https://staticman3.herokuapp.com/v3/connect/github/<username>/<repo-name>`. Lastly, fill in your `repository` and `branch` in the Staticman section of `_config.yml`.
#### Just-Comments comments
To use Just-comments you first need to have an account. After you just need to copy the API key to the just-comments property in `_config.yml` file.
### Adding Google Analytics to track page views ### Adding Google Analytics to track page views
Beautiful Jekyll lets you easily add Google Analytics to all your pages. This will let you track all sorts of information about visits to your website, such as how many times each page is viewed and where (geographically) your users come from. To add Google Analytics, simply sign up to [Google Analytics](https://www.google.com/analytics/) to obtain your Google Tracking ID, and add this tracking ID to the `google_analytics` parameter in `_config.yml`. Beautiful Jekyll lets you easily add Google Analytics to all your pages. This will let you track all sorts of information about visits to your website, such as how many times each page is viewed and where (geographically) your users come from. To add Google Analytics, simply sign up to [Google Analytics](https://www.google.com/analytics/) to obtain your Google Tracking ID, and add this tracking ID to the `google_analytics` parameter in `_config.yml`.
@ -147,7 +151,7 @@ title | Page or blog post title
subtitle | Short description of page or blog post that goes under the title subtitle | Short description of page or blog post that goes under the title
tags | List of tags to categorize the post. Separate the tags with commas and place them inside square brackets. Example: `[personal, self help, finance]` tags | List of tags to categorize the post. Separate the tags with commas and place them inside square brackets. Example: `[personal, self help, finance]`
bigimg | Include a large full-width image at the top of the page. You can either give the path to a single image, or provide a list of images to cycle through (see [my personal website](https://deanattali.com/) as an example). bigimg | Include a large full-width image at the top of the page. You can either give the path to a single image, or provide a list of images to cycle through (see [my personal website](https://deanattali.com/) as an example).
comments | If you want do add Disqus comments to a specific page, use `comments: true`. Comments are automatically enabled on blog posts; to turn comments off for a specific post, use `comments: false`. Comments only work if you set your Disqus id in the `_config.yml` file. comments | If you want do add comments to a specific page, use `comments: true`. Comments are automatically enabled on blog posts; to turn comments off for a specific post, use `comments: false`. Comments only work if you enable at least one provider(diqus, staticman, just-comments) in `_config.yml` file.
show-avatar | If you have an avatar configured in the `_config.yml` but you want to turn it off on a specific page, use `show-avatar: false`. If you want to turn it off by default, locate the line `show-avatar: true` in the file `_config.yml` and change the `true` to `false`; then you can selectively turn it on in specific pages using `show-avatar: true`. show-avatar | If you have an avatar configured in the `_config.yml` but you want to turn it off on a specific page, use `show-avatar: false`. If you want to turn it off by default, locate the line `show-avatar: true` in the file `_config.yml` and change the `true` to `false`; then you can selectively turn it on in specific pages using `show-avatar: true`.
image | If you want to add a personalized image to your blog post that will show up next to the post's excerpt and on the post itself, use `image: /path/to/img`. image | If you want to add a personalized image to your blog post that will show up next to the post's excerpt and on the post itself, use `image: /path/to/img`.
share-img | If you want to specify an image to use when sharing the page on Facebook or Twitter, then provide the image's full URL here. share-img | If you want to specify an image to use when sharing the page on Facebook or Twitter, then provide the image's full URL here.

View File

@ -125,6 +125,8 @@ url-pretty: "MyWebsite.com" # eg. "deanattali.com/beautiful-jekyll"
# Fill in your Disqus shortname (NOT the userid) if you want to support Disqus comments # Fill in your Disqus shortname (NOT the userid) if you want to support Disqus comments
# disqus: "" # disqus: ""
# If you want to use just-comments fill with the API Key
#just-comments: "ABCD-EFGH-IJKL"
# To use Facebook Comments, fill in a Facebook App ID # To use Facebook Comments, fill in a Facebook App ID
# fb_comment_id: "" # fb_comment_id: ""

View File

@ -0,0 +1,4 @@
{%- if site.just-comments -%}
<div class="just-comments" data-apikey="{{site.just-comments}}"></div>
<script async src="https://just-comments.com/w.js"></script>
{%- endif -%}

View File

@ -15,6 +15,9 @@ layout: base
{% include fb-comment.html %} {% include fb-comment.html %}
<div class="staticman-comments"> <div class="staticman-comments">
{% include staticman-comments.html %} {% include staticman-comments.html %}
</div>
<div class="justcomments-comments">
{% include just_comments.html %}
</div> </div>
{% endif %} {% endif %}
</div> </div>

View File

@ -73,6 +73,9 @@ layout: base
<div class="staticman-comments"> <div class="staticman-comments">
{% include staticman-comments.html %} {% include staticman-comments.html %}
</div> </div>
<div class="justcomments-comments">
{% include just_comments.html %}
</div>
{% endif %} {% endif %}
</div> </div>
</div> </div>