Add Comments To a Website

Εγκατάσταση

Το FastComments έχει σχεδιαστεί ώστε να εγκαθίσταται σε οποιονδήποτε τύπο σελίδας - στατική ή δυναμική, με ανοιχτό ή σκούρο θέμα, δημόσιες ή εσωτερικές σελίδες.

Η εγκατάσταση πρέπει να είναι εύκολη και να προσαρμόζεται σε οποιονδήποτε τύπο ιστοτόπου ή εφαρμογής ιστού.

WordPress

Μπορείτε να βρείτε το WordPress plugin μας εδώ.

Ένας πλήρης οδηγός εγκατάστασης και τεκμηρίωση για το plugin βρίσκονται εδώ.

Αυτό το plugin υποστηρίζει ζωντανά σχόλια, SSO και εγκατάσταση χωρίς κώδικα. Απλώς ακολουθήστε τον οδηγό εγκατάστασης στη σελίδα διαχείρισης μετά την εγκατάσταση του plugin.

VanillaJS / Απόσπασμα HTML

Η έκδοση VanillaJS του widget είναι πολύ εύκολη στην εγκατάσταση, δεν απαιτεί συστήματα κατασκευής ή κώδικα διακομιστή.

Απλώς προσθέστε το παρακάτω απόσπασμα κώδικα σε οποιαδήποτε σελίδα:

Απλό απόσπασμα κώδικα

Copy

Run

<script async src="https://cdn.fastcomments.com/js/embed-v2-async.min.js"></script>
<div id="fastcomments-widget"></div>
<script>
window.fcConfigs = [{
    "tenantId": "demo"
}];
</script>

Μπορείτε να χρησιμοποιήσετε το ίδιο απόσπασμα κώδικα σε πολλές σελίδες· θα δημιουργήσει αυτόματα ξεχωριστό νήμα για κάθε σελίδα.

Μπορείτε να βρείτε τεκμηρίωση για τη διαμόρφωση του widget εδώ.

Angular

Μπορείτε να βρείτε τη βιβλιοθήκη Angular μας στο NPM εδώ.

Το FastComments Angular widget σχολίων υποστηρίζει όλες τις ίδιες δυνατότητες με την έκδοση VanillaJS - ζωντανά σχόλια, SSO και ούτω καθεξής.

Θα χρειαστείτε το fastcomments-typescript, που είναι peer dependency. Βεβαιωθείτε ότι περιλαμβάνεται στη μεταγλώττιση TypeScript σας. Στο μέλλον, αυτό το peer dependency θα μετακινηθεί στο @types/fastcomments που θα απλοποιήσει την εγκατάσταση.

FastComments Angular μέσω NPM

Copy

  npm install fastcomments-typescript --save
  npm install ngx-fastcomments --save

Το peer dependency πρέπει να προστεθεί στο αρχείο tsconfig.json σας, για παράδειγμα:

Προσθήκη fastcomments-typescript peer dependency

Copy

"include": [
  "src/**/*.ts",
  "node_modules/fastcomments-typescript/src/index.ts"
],

Στη συνέχεια, προσθέστε το FastCommentsModule στην εφαρμογή σας:

Προσθέστε το Module στην εφαρμογή σας

Copy

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { AppComponent } from './app.component';
import { FastCommentsModule } from 'ngx-fastcomments';
@NgModule({
  declarations: [
    AppComponent
  ],
  imports: [
    BrowserModule,
    FastCommentsModule
  ],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule { }

Χρήση

Για να ξεκινήσουμε, περνάμε ένα αντικείμενο ρύθμισης για τον demo tenant:

Χρήση - Inline διαμόρφωση

Copy

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

Δεδομένου ότι η διαμόρφωση μπορεί να γίνει αρκετά περίπλοκη, μπορούμε να περάσουμε μια αναφορά αντικειμένου:

Χρήση - Πέρασμα αντικειμένου για διαμόρφωση

Copy

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

Χρήση - EU

Copy

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

Το widget χρησιμοποιεί ανίχνευση αλλαγών, οπότε η αλλαγή οποιωνδήποτε ιδιοτήτων του αντικειμένου διαμόρφωσης θα προκαλέσει επαναφόρτωση.

Μπορείτε να βρείτε τη διαμόρφωση που υποστηρίζει το Angular component εδώ.

React

Μπορείτε να βρείτε τη βιβλιοθήκη React μας στο NPM εδώ.

Το FastComments React widget σχολίων υποστηρίζει όλες τις ίδιες δυνατότητες με την έκδοση VanillaJS - ζωντανά σχόλια, SSO και ούτω καθεξής.

FastComments React μέσω NPM

Copy

npm install --save fastcomments-react

FastComments React μέσω Yarn

Copy

yarn add fastcomments-react

Παράδειγμα React

Copy

import React, { Component } from 'react'
import {FastCommentsCommentWidget} from 'fastcomments-react'
class Example extends Component {
  render() {
    return <FastCommentsCommentWidget tenantId="demo" />
  }
}

Αν είστε στην EU, θα θέλετε να ορίσετε την παράμετρο region ως εξής:

Παράδειγμα React - EU

Copy

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

Μπορείτε να βρείτε τη διαμόρφωση που υποστηρίζει το React component εδώ.

React Native

Μπορείτε να βρείτε τη βιβλιοθήκη React Native μας στο NPM εδώ.

Το FastComments React Native widget σχολίων υποστηρίζει όλες τις ίδιες δυνατότητες με την έκδοση VanillaJS - ζωντανά σχόλια, SSO και ούτω καθεξής.

FastComments React Native μέσω NPM

Copy

npm install --save fastcomments-react-native

FastComments React Native μέσω Yarn

Copy

yarn add fastcomments-react-native

Η διαμόρφωση καθορίζεται ελαφρώς διαφορετικά σε σύγκριση με τη βιβλιοθήκη fastcomments-react:

Παράδειγμα React Native

Copy

import { FastCommentsCommentWidget } from 'fastcomments-react-native';
// ...
  const tenantId = 'demo'; // Το tenant id σας. Μπορεί να ληφθεί από https://fastcomments.com/auth/my-account/api-secret
  const pageId = 'native-test'; // Το ID ή URL του νήματος σχολίων στην εφαρμογή σας.
  const config = {
    tenantId: tenantId,
    urlId: pageId
  };
  return (
      <FastCommentsCommentWidget config={config}/>
  );

Αν είστε στην EU, θα θέλετε να ορίσετε την παράμετρο region:

React Native - EU

Copy

  // ...
  const config = {
    tenantId: tenantId,
    urlId: pageId,
    region: 'eu'
  };
  // ...

Μπορείτε να βρείτε τη διαμόρφωση που υποστηρίζει το React Native component εδώ.

Vue

Μπορείτε να βρείτε τη βιβλιοθήκη Vue μας στο NPM εδώ.

Επιπλέον, μια βιβλιοθήκη vue-next είναι στο NPM εδώ

Ο πηγαίος κώδικας μπορεί να βρεθεί στο GitHub.

Το FastComments Vue widget σχολίων υποστηρίζει όλες τις ίδιες δυνατότητες με την έκδοση VanillaJS - ζωντανά σχόλια, SSO και ούτω καθεξής.

Οι παρακάτω οδηγίες είναι για Vue 3 δεδομένου ότι έχει κυκλοφορήσει εδώ και καιρό, ωστόσο το FastComments υποστηρίζει επίσης Vue 2 μέσω της βιβλιοθήκης fastcomments-vue.

FastComments Vue μέσω NPM

Copy

npm install --save fastcomments-vue-next

FastComments Vue μέσω Yarn

Copy

yarn add fastcomments-vue-next

Παράδειγμα Vue

Copy

<template>
  <img alt="Vue logo" src="./assets/logo.png">
    <fast-comments v-bind:config="{tenantId: 'demo'}"/>
</template>
<script>
import {FastComments} from 'fastcomments-vue-next';
export default {
  name: 'App',
  components: {
    FastComments
  }
}
</script>

Αν είστε στην EU, θα θέλετε να ορίσετε το region σε EU:

FastComments Vue - EU

Copy

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

Οι βιβλιοθήκες fastcomments-vue και fastcomments-vue-next υποστηρίζουν την ίδια διαμόρφωση με το VanillaJS widget σχολίων.

Μπορείτε να βρείτε τη διαμόρφωση που υποστηρίζει το Vue component εδώ.

TypeScript

Οι ορισμοί TypeScript για το FastComments μπορούν να βρεθούν στο NPM εδώ.

Μπορείτε να τους βρείτε στο GitHub εδώ.

Πολλαπλές παρουσίες στην ίδια σελίδα

Κάθε instance του widget σχολίων είναι απομονωμένο. Εξαιτίας αυτού, το FastComments υποστηρίζει εγγενώς περισσότερα από ένα instance ανά σελίδα.

Συνήθεις περιπτώσεις χρήσης

Εμφάνιση ζωντανών σχολίων αμέσως

Το widget σχολίων είναι ζωντανό από προεπιλογή, αλλά τα ζωντανά σχόλια εμφανίζονται κάτω από ένα κουμπί "Εμφάνιση N νέων σχολίων".

Σε ορισμένες περιπτώσεις, είναι επιθυμητό να εμφανίζονται τα νέα σχόλια αμέσως χωρίς να χρειάζεται να κάνετε κλικ σε ένα κουμπί.

Επιτρέψτε ανώνυμα σχόλια

Από προεπιλογή, το FastComments απαιτεί από τον χρήστη να αφήσει email όταν σχολιάζει. Αυτό μπορεί να απενεργοποιηθεί.

Αντιμετώπιση συνηθισμένων προβλημάτων

Ακολουθούν κάποια συμπτώματα που συναντάμε συχνά, και οι συνήθεις λύσεις.

Μήνυμα "This is a demo"

Αυτό εμφανίζεται όταν έχετε αντιγράψει τον κώδικα του widget από την αρχική μας σελίδα, η οποία χρησιμοποιεί τον demo tenant μας. Για να χρησιμοποιήσετε τον δικό σας tenant, αντιγράψτε τον κώδικα του widget από εδώ.

Σφάλμα "FastComments cannot load on this domain"

Το FastComments χρειάζεται να γνωρίζει ποιες domains σας ανήκουν για να αυθεντικοποιήσει αιτήματα που σχετίζονται με τον λογαριασμό σας. Δείτε την τεκμηρίωσή μας για να δείτε πώς να επιλύσετε αυτό το σφάλμα (απλώς προσθέστε το ακριβές subdomain + domain στον λογαριασμό σας).

Σημειώστε ότι αυτό θα πρέπει να συμβεί μόνο αφού λήξει η δοκιμαστική περίοδος. Κατά τη διάρκεια της δοκιμαστικής περιόδου, οποιαδήποτε αιτήματα από νέες domains θα προστεθούν αυτόματα στον λογαριασμό σας.

Migrated Comments Not Showing for Custom Installations

Συνήθως αυτό συμβαίνει όταν τα εισαχθέντα σχόλια έχουν συσχετιστεί με ένα Page ID, και εσείς περνάτε μια URL (ή καμία τιμή, οπότε προεπιλέγεται στην URL της σελίδας).

Μπορείτε να εντοπίσετε το πρόβλημα εξάγοντας τα σχόλιά σας μέσω του exporting your comments και βλέποντας τη στήλη URL ID (προς το παρόν Στήλη B).

Βεβαιωθείτε ότι οι τιμές που βλέπετε στη στήλη URL ID είναι οι ίδιες τιμές που περνάτε στη διαμόρφωση του widget ως παράμετρο urlId.

Για περαιτέρω εξήγηση, δοκιμάστε να διαβάσετε την τεκμηρίωσή μας How Comments are Tied to Pages and Articles.

Αν όλα τα άλλα αποτύχουν, επικοινωνήστε μαζί μας.

Εάν το widget σχολίων δεν εμφανίζεται, ελέγξτε την κονσόλα του Chrome Developer για σφάλματα.

Σε περισσότερες περιπτώσεις λανθασμένης διαμόρφωσης, το widget σχολίων τουλάχιστον θα εμφανίσει ένα σφάλμα στη σελίδα εάν καταφέρει να φορτώσει. Το να μην βλέπετε τίποτα συνήθως υποδεικνύει σφάλμα scripting.

Η επιθυμητή ρύθμιση δεν λειτουργεί όπως αναμένεται

Δοκιμάστε την Chrome extension μας για να δείτε ποια διαμόρφωση λαμβάνει το widget σχολίων. Αν όλα αποτύχουν, βγάλτε ένα στιγμιότυπο οθόνης (screenshot) αυτού που λέει το Chrome extension και επικοινωνήστε μαζί μας.

Comments Missing on Same URL With Different Hash Bang

Από προεπιλογή, το FastComments θα χρησιμοποιήσει την URL της σελίδας ως το "bucket" όπου αποθηκεύονται τα σχόλια. Εάν οι URL σας περιλαμβάνουν #hashbangs, και αυτά τα #hashbangs δεν θα έπρεπε να αποτελούν μέρος του αναγνωριστικού που ταυτοποιεί ένα νήμα σχολίων, μπορούμε απλά να αγνοήσουμε την τιμή hash bang, για παράδειγμα:

Παράδειγμα αγνόησης Hash Bangs

Copy

<script async src="https://cdn.fastcomments.com/js/embed-v2-async.min.js"></script>
<div id="fastcomments-widget"></div>
<script>
window.fcConfigs = [{
    target: '#fastcomments-widget',
    tenantId: "demo",
    url: location.href.replace(location.hash, ''),
    urlId: location.href.replace(location.hash, '')
}];
</script>

Σημειώστε ότι μετά από αυτή την αλλαγή, θα χρειαστεί να γίνει μετεγκατάσταση για τα υπάρχοντα σχόλια. Για αυτό, επικοινωνήστε μαζί μας.

Από προεπιλογή, το FastComments θα χρησιμοποιήσει την URL της σελίδας ως το "bucket" όπου αποθηκεύονται τα σχόλια. Εάν οι URL σας περιλαμβάνουν παραμέτρους ερωτήματος που δεν θα έπρεπε να αποτελούν μέρος του αναγνωριστικού που ταυτοποιεί ένα νήμα σχολίων, μπορούμε απλά να τις αγνοήσουμε, για παράδειγμα:

Αγνόηση παραμέτρων ερωτήματος

Copy

<script async src="https://cdn.fastcomments.com/js/embed-v2-async.min.js"></script>
<div id="fastcomments-widget"></div>
<script>
window.fcConfigs = [{
    target: '#fastcomments-widget',
    tenantId: "demo",
    url: location.protocol + '//' + location.host + location.pathname,
    urlId: location.pathname
}];
</script>

Not Receiving Emails

Στο FastComments, καταβάλλουμε μεγάλη προσπάθεια για να εξασφαλίσουμε ότι η αποστολή των ηλεκτρονικών μηνυμάτων (emails) είναι όσο το δυνατόν πιο αξιόπιστη. Ωστόσο, κάποιοι πάροχοι email είναι διαβόητα δύσκολο να παραδίδονται με αξιοπιστία. Ελέγξτε τον φάκελο ανεπιθύμητων (spam) για μηνύματα από fastcomments.com.

Εάν επικοινωνήσετε μαζί μας, συνήθως μπορούμε να παρέχουμε περισσότερη πληροφόρηση για το γιατί ίσως να μην βλέπετε τα μηνύματα ηλεκτρονικού ταχυδρομείου από εμάς.

Notion και Google Sites

Θέλετε να προσθέσετε σχόλια στις σελίδες Notion σας; Σας καλύπτουμε.

Notion

Για την προσθήκη σχολίων σε έγγραφα Notion, δείτε το βίντεο επεξήγησης εδώ.

Google Sites

Το Google Sites υποστηρίζεται επίσης και η ροή είναι παρόμοια.

Επόμενος οδηγός

Πρόσθετα τρίτων

Προσαρμοσμένες εγκαταστάσεις

Ενσωμάτωση σε έγγραφα

Add Comments To a Website

Εγκατάσταση

WordPress

VanillaJS / Απόσπασμα HTML

Angular

Χρήση

React

React Native

Vue

TypeScript

Πολλαπλές παρουσίες στην ίδια σελίδα

Συνήθεις περιπτώσεις χρήσης

Εμφάνιση ζωντανών σχολίων αμέσως

Επιτρέψτε ανώνυμα σχόλια

Αντιμετώπιση συνηθισμένων προβλημάτων

Μήνυμα "This is a demo"

Σφάλμα "FastComments cannot load on this domain"

Migrated Comments Not Showing for Custom Installations

Comment Widget Not Showing

Η επιθυμητή ρύθμιση δεν λειτουργεί όπως αναμένεται

Comments Missing on Same URL With Different Hash Bang

URL Query Parameters Affecting Widget

Not Receiving Emails

Notion και Google Sites

Notion

Google Sites

Γλώσσα 🇨🇾 Ελληνικά (Κύπρος)

Πρόσθετα τρίτων

Προσαρμοσμένες εγκαταστάσεις

Ενσωμάτωση σε έγγραφα

Add Comments To a Website

Εγκατάσταση

WordPress

VanillaJS / Απόσπασμα HTML

Angular

Χρήση

React

React Native

Vue

TypeScript

Πολλαπλές παρουσίες στην ίδια σελίδα

Συνήθεις περιπτώσεις χρήσης

Εμφάνιση ζωντανών σχολίων αμέσως

Επιτρέψτε ανώνυμα σχόλια

Αντιμετώπιση συνηθισμένων προβλημάτων

Μήνυμα "This is a demo"

Σφάλμα "FastComments cannot load on this domain"

Migrated Comments Not Showing for Custom Installations

Comment Widget Not Showing

Η επιθυμητή ρύθμιση δεν λειτουργεί όπως αναμένεται

Comments Missing on Same URL With Different Hash Bang

URL Query Parameters Affecting Widget

Not Receiving Emails

Notion και Google Sites

Notion

Google Sites