FastComments.com


FastComments подржава више типова реакција по страници. Подржавамо оно што зовемо "Page Reacts" (приказано на дну ове странице) који су прилагодљиви емотикони, или иконе, које могу да се прикажу изнад области за коментаре.

Такође имамо Floating Likes видџет који се појављује у доњем десном углу екрана. Ова документација покрива оба.


Реакције странице Internal Link


Page Reacts видџет приказује прилагодљив скуп иконица реакција на коментарском видџету.

Корисници могу кликнути на слике да би реаговали, и он памти реакције које су одабрали по страници. Ако су пријављени на fastcomments.com, ово је везано за њихов налог.

Ако кликнете на Run на примеру испод можете видјети како ради.


Инсталација - VanillaJS Internal Link

За Page Reacts морамо одлучити о двије ствари:

  • Које слике реакција користити.
  • Кратак id за именовање сваке реакције.

Опционо:

  • Можете такође дефинисати опционе посебне слике за одабране/неодабране реакције.
  • Можете одлучити да ли желите приказати списак корисника који су реаговали када померите миша преко једне од реакција.
Пример кода за реакције странице
Copy CopyRun External Link
1
2<script src="https://cdn.fastcomments.com/js/embed-v2.min.js"></script>
3<div id="page-reacts-example"></div>
4<script>
5 window.FastCommentsUI(document.getElementById('page-reacts-example'), {
6 tenantId: 'demo',
7 pageReactConfig: {
8 showUsers: true,
9 reacts: [
10 {id: 'droll', src: 'https://docs.fastcomments.com/images/emojis/droll.png'},
11 {id: 'he', src: 'https://docs.fastcomments.com/images/emojis/heart-eyes.png'},
12 {id: 'laugh', src: 'https://docs.fastcomments.com/images/emojis/laugh.png'},
13 {id: 'puke', src: 'https://docs.fastcomments.com/images/emojis/puke.png', selectedSrc: 'https://docs.fastcomments.com/images/emojis/puke-bw.png' },
14 {id: 'rofl', src: 'https://docs.fastcomments.com/images/emojis/rofl.png' },
15 ]
16 }
17 });
18</script>
19

Конфигурација за React, Angular и сличне frontend библиотеке је иста.

Лебдећи виџет лајкова Internal Link

Видгет за лајкове који плута приказује плутајући оквир у доњем десном углу екрана са бројем лајкова и коментара. Можете га видјети у акцији на овој страни!

Корисници могу кликнути на срце да лајкују страну, и он памти стране које су лајковали. Ако су пријављени на fastcomments.com, ово је везано за њихов налог како би се спречило да људи више пута лајкују исту страну.

Такође аутоматски открива преференције корисниковог прегледача за тамни режим и мења свој изглед у тамну верзију ако је то пожељно.

Инсталација - VanillaJS Internal Link

Instalacija je jednostavna:

Primjer koda za plutajuće lajkove
Copy Copy
1
2<script src="https://cdn.fastcomments.com/js/embed-page-likes-floating.min.js"></script>
3<div id="fastcomments-page-likes-floating"></div>
4<script>
5 window.FastCommentsEmbedPageLikesFloating(document.getElementById('fastcomments-page-likes-floating'), {
6 tenantId: 'demo'
7 });
8</script>
9

Potpis tipa konstruktora je:

Konfiguracija
Copy Copy
1
2/**
3 *
4 * @param {HTMLElement} targetElement
5 * @param config
6 * @property {string} tenantId
7 * @property {string} urlId - Promijenite ovo da postavite ID stranice/artikla. Po zadanom, to je URL stranice.
8 * @property {() => void} [onOpenComments]
9 * @property {object} [sso]
10 * @constructor
11 */
12

Podržava SSO za povezivanje reakcija sa korisničkim nalogom radi autentifikacije.

Trenutno je podržan samo VanillaJS. Ako želite da se ovaj widget doda u neku od naših klijentskih biblioteka, obavijestite nas!

Asinhrona verzija

Asinhroni primjer koda za plutajuće lajkove
Copy Copy
1
2<script src="https://cdn.fastcomments.com/js/embed-page-likes-floating.min.js?v=2" async></script>
3<div id="fastcomments-page-likes-floating"></div>
4<script>
5 (function () {
6 function tryLoad() {
7 if (window.FastCommentsEmbedPageLikesFloating) {
8 window.FastCommentsEmbedPageLikesFloating(document.getElementById('fastcomments-page-likes-floating'), {
9 tenantId: 'demo'
10 });
11 } else {
12 setTimeout(tryLoad, 50);
13 }
14 }
15
16 tryLoad();
17 })();
18</script>
19

Sa SSO

Takođe možemo proslijediti Sigurni SSO ili Jednostavni SSO podatke:

Primjer koda za Sigurni SSO za plutajuće lajkove
Copy Copy
1
2<script src="https://cdn.fastcomments.com/js/embed-page-likes-floating.min.js"></script>
3<div id="fastcomments-page-likes-floating"></div>
4<script>
5 window.FastCommentsEmbedPageLikesFloating(document.getElementById('fastcomments-page-likes-floating'), {
6 tenantId: 'demo',
7 sso // proslijedite sso objekat
8 });
9</script>
10
Primjer koda za Jednostavni SSO za plutajuće lajkove
Copy Copy
1
2<script src="https://cdn.fastcomments.com/js/embed-page-likes-floating.min.js"></script>
3<div id="fastcomments-page-likes-floating"></div>
4<script>
5 window.FastCommentsEmbedPageLikesFloating(document.getElementById('fastcomments-page-likes-floating'), {
6 tenantId: 'demo',
7 simpleSSO: {
8 id: 'some-user-id',
9 username: 'some username',
10 email: 'some@email.com',
11 }
12 });
13</script>
14

Инсталација - WordPress Internal Link


Za WordPress, ovu funkciju možete omogućiti instaliranjem dodatka poput WPCode i dodavanjem sledećeg HTML isječka u podnožje bloga:

Kod za plutajuće lajkove za WordPress
Copy Copy
1
2<script src="https://cdn.fastcomments.com/js/embed-page-likes-floating.min.js" async></script>
3<div id="fastcomments-page-likes-floating"></div>
4<script>
5 (function () {
6 function tryLoad() {
7 if (window.FastCommentsEmbedPageLikesFloating) {
8 const articles = document.getElementsByTagName('article');
9 if (!articles.length) {
10 return console.warn('Article not found to show fastcomments likes.');
11 }
12 window.FastCommentsEmbedPageLikesFloating(document.getElementById('fastcomments-page-likes-floating'), {
13 tenantId: '-VuPDR12d-v_',
14 urlId: articles[0].id.replace('post-', '')
15 });
16 } else {
17 setTimeout(tryLoad, 50);
18 }
19 }
20
21 tryLoad();
22 })();
23</script>
24