wassname/talk
1
0
Fork 0
mirror of https://github.com/wassname/talk.git synced 2026-07-16 11:22:16 +08:00
Code Issues Packages Projects Releases Wiki Activity

[CORL-181] Add docs for comment count integration (#2598)

Browse Source 
* docs: add docs for comment count integration

* docs: update count docs

* chore: improve integration docs
This commit is contained in:
Vinh
2019-10-01 19:27:00 +00:00
committed by Wyatt Johnson
parent 093202f9e2
commit d3931db285
3 changed files with 57 additions and 15 deletions
Download Patch File Download Diff File Expand all files Collapse all files
docs/_config.yml
+2
View File
@@ -94,6 +94,8 @@ sidebar:
url: /v5/integrating/cms/
- title: Single Sign On
url: /v5/integrating/sso/
- title: Comment Count
url: /v5/integrating/counts/
- title: API
children:
- title: GraphQL Overview
docs/source/version-5-counts.md
+38
View File
@@ -0,0 +1,38 @@
---
title: Comment Count Integration
permalink: /v5/integrating/counts/
---
Add the `count.js` script to your `html` tree. On a page that includes the _Stream Embed_ this is done for you automatically, however for best performance we recommend to include it into the `<head>` tag.
```html
<script href="//{{ CORAL_DOMAIN_NAME }}/assets/js/count.js" defer></script>
```
> **NOTE:** Replace the value of `{% raw %}{{ CORAL_DOMAIN_NAME }}{% endraw %}` with the location of your running instance of Coral.
Insert an html element with the class `coral-count` and configure it using `data-coral-*` attributes.
```html
<span class="coral-count" data-coral-url="http://example.com/blog-entry-1/"></span>
```
After successful injection it will become:
```html
<span class="coral-count" data-coral-url="http://example.com/blog-entry-1/">
<span class="coral-count-number">5</span>
<span class="coral-count-text">Comments</span>
</span>
```
### Available `data-coral-*` attributes
Set the class of your html element to `coral-count` in order to get story counts. The following `data-coral-*` attributes will configure the output:
- `data-coral-id` – The id of the story of which counts should be injected.
- `data-coral-url` – The url of the story of which counts should be injected.
- `data-coral-notext` – If set to `"true"`, only the count number will be injected
Either `data-coral-id` or `data-coral-url` should be set. If none are provided the story url
will be retrieved from the [canonical url reference](https://developer.mozilla.org/en-US/docs/Web/HTTP/Basics_of_HTTP/Choosing_between_www_and_non-www_URLs#Using_%3Clink_relcanonical%3E) `<link rel="canonical" href="...">` or inferred using the current page url.
docs/source/version-5-integrating.md
+17 -15
View File
@@ -3,25 +3,27 @@ title: Integrating on your site
permalink: /v5/integrating/cms/
---
With Coral setup and running locally you can test embeding the comment stream with this sample embed script:
With Coral setup and running you can embed the comment stream with this sample embed script:
```
<div id="coral_thread"></div>
<script type="text/javascript">
(function() {
var talk = document.createElement('script'); talk.type = 'text/javascript'; talk.async = true;
var url = '{{ CORAL_DOMAIN_NAME }}';
talk.src = '//' + url + '/assets/js/embed.js';
talk.onload = function() {
Coral.createStreamEmbed({
id: "coral_thread",
autoRender: true,
rootURL: '//' + url,
});
};
(document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(talk);
})();
</script>
(function() {
var d = document, s = d.createElement('script');
var url = '{{ CORAL_DOMAIN_NAME }}';
s.src = '//' + url + '/assets/js/embed.js';
s.async = false;
s.defer = true;
s.onload = function() {
Coral.createStreamEmbed({
id: "coral_thread",
autoRender: true,
rootURL: '//' + url,
});
};
(d.head || d.body).appendChild(s);
})();
</script>`;
```
> **NOTE:** Replace the value of `{% raw %}{{ CORAL_DOMAIN_NAME }}{% endraw %}` with the location of your running instance of Coral.