הוספת תגובות לאתר

כדי להוסיף תגובות לאתר ה-WordPress שלך, תוכל למצוא את תוסף ה-WordPress שלנו כאן.

מדריך התקנה מלא ותיעוד לגבי התוסף זמינים כאן.

התוסף תומך בהוספת תגובות בזמן אמת, SSO והתקנה ללא קוד. פשוט עקוב אחר מדריך ההתקנה בדף הניהול לאחר התקנת התוסף. הוא ינחה אותך בתהליך חיבור התקנת ה-WordPress שלך לחשבון שלך.

כל התגובות שנשארות באמצעות FastComments דרך התוסף שלנו ל-WordPress יכולות להסתנכרן אוטומטית חזרה להתקנת ה-WordPress שלך כך שתשמור על שליטה על הנתונים שלך. ניתן לכבות זאת כדי להגביל את גודל מסד הנתונים של ה-WordPress שלך.

גרסת VanillaJS של הווידג'ט היא הדרך הפשוטה ביותר להוסיף תגובות לאתר שלך, ואינה דורשת מערכות בנייה או קוד צד-שרת.

פשוט הוסף את קטע הקוד הבא לכל דף כדי להוסיף תגובות לאתר שלך:

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

ניתן להשתמש באותו קטע קוד במספר דפים; הוא ייצור אוטומטית שרשור נפרד לכל דף.

לאפליקציות רבות יש אפשרות "HTML Embed Code". בחר את האפשרות והדבק את קטע הקוד לעיל.

אין צורך בחשבון כדי לנסות! ייתכן שתראה "tenantId: demo" בקטע הקוד שלמעלה אם אינך מחובר. כך הוא ישתמש בחשבון הדמו.

ניתן למצוא תיעוד על תצורת הווידג'ט כאן.

כל הגרסאות של הווידג'ט של FastComments הן עטיפות סביב ספריית ה-VanillaJS המרכזית. זה מאפשר לנו להוסיף תכונות ולתקן בעיות במקום אחד - והשינויים מתפשטים אוטומטית לשאר הגרסאות של ווידג'ט התגובות.

להוספת תגובות לאתר שנבנה עם Angular, ניתן למצוא את ספריית ה-Angular שלנו ב-NPM כאן.

ווידג'ט התגובות של FastComments ל-Angular תומך בכל אותן התכונות של ה-VanillaJS — תגובות בזמן אמת, sso, ועוד.

תזדקקו ל-fastcomments-typescript, שהיא peer dependency. אנא ודאו שהיא כלולה בקומפילציית TypeScript שלכם. בעתיד, ה-peer dependency הזה יעבור ל-@types/fastcomments מה שיפשט את ההתקנה הזו.

FastComments Angular דרך NPM

Copy

1

2 npm install fastcomments-typescript --save

3 npm install ngx-fastcomments --save

4

יש להוסיף את ה-peer dependency בקובץ tsconfig.json שלכם, לדוגמה:

הוספת peer dependency של fastcomments-typescript

Copy

1

2"include": [

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

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

5],

6

לאחר מכן, הוסיפו את FastCommentsModule לאפליקציה שלכם:

הוספת המודול לאפליקציה שלכם

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

שימוש

כדי להתחיל, נעביר אובייקט config עבור ה-tenant demo:

שימוש - קונפיגורציה מוטמעת

Copy

1

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

3

מאחר שהקונפיגורציה עלולה להיות מורכבת, נוכל להעביר הפניה לאובייקט:

שימוש - העברת אובייקט לקונפיגורציה

Copy

1

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

3

שימוש - אירופה (EU)

Copy

1

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

3

הווידג'ט משתמש בזיהוי שינויים, ולכן שינוי של כל אחת מהתכונות של אובייקט הקונפיגורציה יגרום לטעינה מחדש שלו.

ניתן למצוא את הקונפיגורציה שהקומפוננטה של Angular תומכת בה כאן.

להוספת תגובות לאתר שנבנה ב־React, ניתן למצוא את ספריית ה־React שלנו ב־NPM כאן.

ווידג'ט התגובות של FastComments ל־React תומך בכל אותן תכונות כמו ה‑VanillaJS — תגובות בזמן אמת, sso, וכדומה.

FastComments React דרך NPM

Copy

1

2npm install --save fastcomments-react

3

FastComments React דרך Yarn

Copy

1

2yarn add fastcomments-react

3

דוגמה ב־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

אם אתם באיחוד האירופי, תרצו להגדיר את הפרמטר region כך:

דוגמה ב־React - האיחוד האירופי

Copy

1

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

3

ניתן למצוא את התצורה שהרכיב של React תומך בה כאן.

כדי להוסיף תגובות לאתר שבנית באמצעות Vue, ניתן למצוא את ספריית Vue שלנו ב‑NPM כאן.

בנוסף, ספריית vue-next נמצאת ב‑NPM כאן

קוד המקור זמין ב‑GitHub.

ווידג'ט התגובות של FastComments ל‑Vue תומך בכל אותן התכונות כמו של ה‑VanillaJS — תגובות בזמן אמת, SSO, וכן הלאה.

ההוראות הבאות מיועדות ל‑Vue 3 מכיוון שיצאה מזה זמן, עם זאת FastComments תומכת גם ב‑Vue 2 באמצעות הספרייה fastcomments-vue.

FastComments Vue באמצעות NPM

Copy

1

2npm install --save fastcomments-vue-next

3

FastComments Vue באמצעות Yarn

Copy

1

2yarn add fastcomments-vue-next

3

דוגמה ל‑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

אם אתם באיחוד האירופי, רצוי להגדיר את region כ‑EU:

FastComments Vue - אזור EU

Copy

1

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

3

הספריות fastcomments-vue ו‑fastcomments-vue-next תומכות באותה תצורה כמו ווידג'ט התגובות של VanillaJS.

ניתן למצוא את התצורה שהקומפוננטה של Vue תומכת בה כאן.

הגדרות TypeScript עבור FastComments ניתן למצוא ב-NPM כאן.

אתה יכול למצוא אותן ב-GitHub כאן.

Each instance of the comment widget is isolated. Because of this, FastComments inherently supports more than one instance per page, or multiple instances pointing to the same chat thread.

In the case of the VanillaJS library for example, you simply have to tie the comment widget to different DOM nodes. If you want to simply update the current thread on the page, see Switching Comment Threads Without Reloading The Page;

סנכרון מצב האימות בין מופעים מרובים

בואו נסקור את הדוגמה של יישום עמוד יחיד מותאם אישית שהוא רשימת שאלות נפוצות עם שרשור ההערות שלהן.

במקרה זה, יש לנו מספר מופעים של FastComments ב‑DOM בו‑זמנית.

זה בסדר, אך זה מציב כמה אתגרים בחוויית המשתמש.

שקלו את הזרימה הזו:

1. המשתמש מבקר בעמוד עם רשימת שאלות, שלכל אחת יש וידג'ט ההערות שלה.
2. המשתמש מזין שם משתמש וכתובת אימייל ומשאיר שאלה באחד מהשרשורים.
3. הוא רואה פריט FAQ נוסף שיש לו שאלה לגביו.
4. הוא חוזר להוסיף תגובה. האם הוא צריך להזין שוב את האימייל ושם המשתמש שלו?

במקרה זה, FastComments מטפל בסנכרון מצב האימות בין מופעי הווידג'ט עבורך. בצעד הרביעי, המשתמש כבר יהיה מאומת זמנית מכיוון שהזין את שם המשתמש והאימייל שלו באותו עמוד.

הצגת תגובות חיות מיידית

ווידג'ט התגובות פעיל כברירת מחדל, אך תגובות חיות מופיעות תחת כפתור "הצג N תגובות חדשות" כדי למנוע תזוזת תוכן העמוד.

במקרים מסוימים, עדיין רצוי להציג את התגובות החדשות מיידית, ללא צורך ללחוץ על כפתור.

במקרה זה, עליך להפעיל את הדגל showLiveRightAway, שתיעוד שלו ניתן למצוא כאן.

אפשרות תגובות אנונימיות (ללא דרישת אימייל)

בברירת מחדל, FastComments דורש מהמשתמש להשאיר אימייל כאשר הוא מגיב.

זה ניתן לביטול, ההוראות כאן.

עיצוב מותאם אישית

רבים מלקוחותינו מיישמים עיצוב משלהם על ווידג'ט התגובות. ניתן למצוא את התיעוד כאן.

הצגת אותן תגובות על מספר תחומים

הצגת אותן תגובות על מספר אתרים היא תכונה ש‑FastComments תומך בה כבר מההתחלה. ראו את התיעוד בנושא.

שינוי העמוד הנוכחי

FastComments תומך ב‑SPA וביישומים מורכבים. שינוי העמוד הנוכחי הוא פשוט, ומוסבר כאן.