Installation | FastComments Docs

Εγκατάσταση

Το 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 θα προστίθενται αυτόματα στον λογαριασμό σας.

Τα μεταφερμένα σχόλια δεν εμφανίζονται για προσαρμοσμένες εγκαταστάσεις

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

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

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

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

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

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

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

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

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

Σχόλια που λείπουν στο ίδιο URL με διαφορετικό hash bang

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

Παράδειγμα αγνόησης hash bangs

Copy

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

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

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

Αγνόηση παραμέτρων query

Copy

<script src="https://cdn.fastcomments.com/js/embed-v2.min.js"></script>
<div id="fastcomments-widget"></div>
<script>
window.FastCommentsUI(document.getElementById('fastcomments-widget'), {
    tenantId: "demo",
    url: location.protocol + '//' + location.host + location.pathname,
    urlId: location.pathname
});
</script>

Δεν λαμβάνετε emails

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

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

Notion και Google Sites

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

Notion

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

Google Sites

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

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

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

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

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

Εγκατάσταση

WordPress

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

Angular

Χρήση

React

React Native

Vue

TypeScript

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

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

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

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

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

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

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

Τα μεταφερμένα σχόλια δεν εμφανίζονται για προσαρμοσμένες εγκαταστάσεις

Το widget σχολίων δεν εμφανίζεται

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

Σχόλια που λείπουν στο ίδιο URL με διαφορετικό hash bang

Οι παράμετροι URL query επηρεάζουν το widget

Δεν λαμβάνετε emails

Notion και Google Sites

Notion

Google Sites

Γλώσσα 🇬🇷 Ελληνικά

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

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

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

Εγκατάσταση

WordPress

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

Angular

Χρήση

React

React Native

Vue

TypeScript

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

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

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

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

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

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

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

Τα μεταφερμένα σχόλια δεν εμφανίζονται για προσαρμοσμένες εγκαταστάσεις

Το widget σχολίων δεν εμφανίζεται

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

Σχόλια που λείπουν στο ίδιο URL με διαφορετικό hash bang

Οι παράμετροι URL query επηρεάζουν το widget

Δεν λαμβάνετε emails

Notion και Google Sites

Notion

Google Sites