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 σας ανήκουν για να αυθεντικοποιεί αιτήματα που σχετίζονται με τον λογαριασμό σας. Δείτε την τεκμηρίωσή μας για να δείτε πώς να επιλύσετε αυτό το σφάλμα (απλώς προσθέστε την ακριβή υπο-τοποθεσία + domain στον λογαριασμό σας).

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

Migrated Comments Not Showing for Custom Installations

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

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

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

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

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

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

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

Desired Configuration Not Working as Expected

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

Comments Missing on Same URL With Different Hash Bang

Από προεπιλογή, το FastComments θα χρησιμοποιήσει το URL της σελίδας για το "bucket" όπου αποθηκεύονται τα σχόλια. Αν τα URLs σας περιλαμβάνουν #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>

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

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

Παράδειγμα αγνόησης παραμέτρων ερωτήματος

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, δίνουμε πολλή δουλειά για να εξασφαλίσουμε ότι η παράδοση των email μας είναι όσο το δυνατόν πιο αξιόπιστη. Ωστόσο, μερικοί πάροχοι email είναι γνωστό ότι είναι δύσκολοι στην αξιόπιστη παράδοση. Ελέγξτε το φάκελο ανεπιθύμητων για μηνύματα από 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

Desired Configuration Not Working as Expected

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

Desired Configuration Not Working as Expected

Comments Missing on Same URL With Different Hash Bang

URL Query Parameters Affecting Widget

Not Receiving Emails

Notion και Google Sites

Notion

Google Sites