Dodavanje komentara na web stranicu

Da biste dodali komentare na svoju WordPress stranicu, naš WordPress dodatak možete pronaći ovdje.

Kompletan vodič za instalaciju i dokumentacija vezana uz dodatak nalaze se ovdje.

Ovaj dodatak podržava komentiranje uživo, SSO i instalaciju bez koda. Jednostavno slijedite vodič za instalaciju na administracijskoj stranici nakon instalacije dodatka. On će vas voditi kroz povezivanje vaše WordPress instalacije s vašim računom.

Svi komentari ostavljeni putem FastComments kroz naš WordPress dodatak mogu se automatski sinkronizirati natrag u vašu WordPress instalaciju tako da zadržite kontrolu nad svojim podacima. Ovo se može isključiti kako biste ograničili veličinu vaše WordPress baze podataka.

Verzija widgeta za VanillaJS najjednostavniji je način dodavanja komentara na vašu web-stranicu, ne zahtijevajući nikakve build sustave ili serverski kod.

Jednostavno dodajte sljedeći isječak koda na bilo koju stranicu da biste dodali komentare na vašu stranicu:

Simple Code Snippet

Copy Run

1

2<script async src="https://cdn.fastcomments.com/js/embed-v2-async.min.js"></script>

3<div id="fastcomments-widget"></div>

4<script>

5window.fcConfigs = [{

6 "tenantId": "demo"

7}];

8</script>

9

Isti isječak koda možete koristiti na mnogim stranicama; automatski će stvoriti zasebnu temu za svaku stranicu.

Mnoge aplikacije imaju opciju "HTML kod za umetanje". Odaberite tu opciju i zalijepite gore navedeni isječak koda.

Ne morate imati račun da biste to isprobali! Možda ćete vidjeti "tenantId: demo" u gore navedenom isječku ako niste prijavljeni. Na taj način će se koristiti demo račun.

Dokumentaciju o konfiguriranju widgeta možete pronaći ovdje.

Sve verzije FastComments widgeta su omotači oko osnovne VanillaJS biblioteke. To nam omogućuje dodavanje značajki i ispravljanje problema na jednom mjestu - i promjene se automatski prosljeđuju na druge varijante widgeta za komentare.

Za dodavanje komentara na web-stranicu izgrađenu s Angularom, našu Angular biblioteku možete pronaći na NPM-u ovdje.

FastComments Angular widget za komentare podržava sve iste značajke kao i VanillaJS verzija - uživo komentiranje, SSO i slično.

Trebat će vam fastcomments-typescript, koji je peer ovisnost. Molimo osigurajte da je to uključeno u vašu TypeScript kompilaciju. U budućnosti će ta peer ovisnost biti premještena u @types/fastcomments čime će se pojednostaviti ova instalacija.

FastComments Angular putem NPM-a

Copy

1

2 npm install fastcomments-typescript --save

3 npm install ngx-fastcomments --save

4

Peer ovisnost trebate dodati u svoju datoteku tsconfig.json, na primjer:

Dodavanje peer ovisnosti fastcomments-typescript

Copy

1

2"include": [

3 "src/**/*.ts",

4 "node_modules/fastcomments-typescript/src/index.ts"

5],

6

Zatim dodajte FastCommentsModule u svoju aplikaciju:

Dodajte modul u svoju aplikaciju

Copy

1

2import { BrowserModule } from '@angular/platform-browser';

3import { NgModule } from '@angular/core';

4

5import { AppComponent } from './app.component';

6import { FastCommentsModule } from 'ngx-fastcomments';

7

8@NgModule({

9 declarations: [

10 AppComponent

11 ],

12 imports: [

13 BrowserModule,

14 FastCommentsModule

15 ],

16 providers: [],

17 bootstrap: [AppComponent]

18})

19export class AppModule { }

20

Usage

Za početak, prosljeđujemo objekt konfiguracije za demo tenant:

Korištenje - Inline konfiguracija

Copy

1

2<lib-fastcomments [config]="{ tenantId: 'demo' }"></lib-fastcomments>

3

Budući da konfiguracija može postati prilično složena, možemo proslijediti referencu na objekt:

Korištenje - Proslijedite objekt za konfiguraciju

Copy

1

2<lib-fastcomments [config]="fastcommentsConfig"></lib-fastcomments>

3

Korištenje - EU

Copy

1

2<lib-fastcomments [config]="{ tenantId: 'demo', region: 'eu' }"></lib-fastcomments>

3

Widget koristi detekciju promjena, tako da će promjena bilo koje svojstva objekta konfiguracije uzrokovati njegovo ponovno učitavanje.

Konfiguraciju koju Angular komponenta podržava možete pronaći ovdje.

Za dodavanje komentara na web-stranicu izrađenu s Reactom, našu React biblioteku možete pronaći na NPM-u ovdje.

FastComments React widget za komentiranje podržava sve iste značajke kao i VanillaJS - komentiranje uživo, sso, i tako dalje.

FastComments React putem NPM-a

Copy

1

2npm install --save fastcomments-react

3

FastComments React putem Yarn-a

Copy

1

2yarn add fastcomments-react

3

Primjer za React

Copy

1

2import React, { Component } from 'react'

3

4import {FastCommentsCommentWidget} from 'fastcomments-react'

5

6class Example extends Component {

7 render() {

8 return <FastCommentsCommentWidget tenantId="demo" />

9 }

10}

11

Ako se nalazite u EU, trebali biste postaviti parametar region ovako:

Primjer za React - EU

Copy

1

2 <FastCommentsCommentWidget tenantId="demo" region="eu" />

3

Konfiguraciju koju React komponenta podržava možete pronaći ovdje.

Da biste dodali komentare na vašu web stranicu izgrađenu s Vue, naš Vue paket možete pronaći na NPM-u ovdje.

Također, biblioteku vue-next možete pronaći na NPM-u ovdje

Izvorni kod možete pronaći na GitHubu.

FastComments Vue widget za komentare podržava sve iste značajke kao i VanillaJS - komentiranje uživo, sso i slično.

Upute u nastavku odnose se na Vue 3 jer je već neko vrijeme dostupan, no FastComments također podržava Vue 2 putem biblioteke fastcomments-vue.

FastComments Vue preko NPM

Copy

1

2npm install --save fastcomments-vue-next

3

FastComments Vue preko Yarn

Copy

1

2yarn add fastcomments-vue-next

3

Primjer Vue

Copy

1

2<template>

3 <img alt="Vue logo" src="./assets/logo.png">

4 <fast-comments v-bind:config="{tenantId: 'demo'}"/>

5</template>

6

7<script>

8import {FastComments} from 'fastcomments-vue-next';

9

10export default {

11 name: 'App',

12 components: {

13 FastComments

14 }

15}

16</script>

17

Ako se nalazite u EU, trebali biste postaviti region na EU:

FastComments Vue - EU

Copy

1

2<fast-comments v-bind:config="{tenantId: 'demo', region: 'eu'}"/>

3

Biblioteke fastcomments-vue i fastcomments-vue-next podržavaju istu konfiguraciju kao i VanillaJS widget za komentare.

Konfiguraciju koju Vue komponenta podržava možete pronaći ovdje.

TypeScript definicije za FastComments mogu se pronaći na NPM-u ovdje.

Možete ih pronaći na GitHubu ovdje.

Svaka instanca widgeta za komentare je izolirana. Zbog toga FastComments inherentno podržava više od jedne instance po stranici, ili više instanci koje upućuju na istu nit razgovora.

U slučaju VanillaJS biblioteke, na primjer, jednostavno trebate povezati widget za komentare s različitim DOM čvorovima. Ako želite jednostavno ažurirati trenutnu nit na stranici, pogledajte Switching Comment Threads Without Reloading The Page;

Sinkronizacija stanja autentifikacije kroz više instanci

Prođimo kroz primjer prilagođene jednostranice koja je popis često postavljanih pitanja s vlastitom nitom komentara.

U ovom slučaju, imamo više instanci FastCommentsa u DOM-u istovremeno.

To je u redu, ali postavlja neke izazove za korisničko iskustvo.

Razmotrite ovaj tok:

1. Korisnik posjeti stranicu s popisom pitanja, svako s vlastitim widgetom za komentare.
2. Korisnik unese svoje korisničko ime i e‑mail i ostavi komentar na jednoj od niti.
3. Vidi drugi FAQ unos o kojem ima pitanje.
4. Ponovo ide komentirati. Mora li ponovno unijeti svoj e‑mail i korisničko ime?

U ovom slučaju, FastComments upravlja sinkronizacijom stanja autentifikacije kroz instance widgeta za vas. U četvrtom koraku, korisnik će već biti privremeno autentificiran jer je unio svoje korisničko ime i e‑mail na istoj stranici.

Showing Live Comments Right Away

The comment widget is live by default, however live comments appear under a "Show N New Comments" button to prevent the page content from moving around.

In some cases, it's still desirable to show the new comments right away, without having to click a button.

In this case, you want to enable the showLiveRightAway flag, which you can find documentation for ovdje.

Allowing Anonymous Commenting (Not Requiring Email)

By default, FastComments requires the user to leave an email when they comment.

This can be disabled, upute su ovdje.

Custom Styling

Many of our customers apply their own styling to the comment widget. You can find the documentation ovdje.

Showing The Same Comments on Multiple Domains

Showing the same comments on multiple sites is something FastComments supports out of the box. See our documentation on this subject.

Changing The Current Page

FastComments supports SPAs and complex applications. Changing the current page is easy, and covered ovdje.