FastComments.com

Menu Icon

Sprache 🇩🇪 Deutsch
🇺🇸 English 🇧🇬 Български 🇨🇳 简体中文 🇹🇼 繁體中文 🇭🇷 Hrvatski 🇩🇰 Dansk 🇳🇱 Nederlands 🇺🇸 English (US) 🇨🇦 Français (Canada) 🇫🇷 Français (France) 🇩🇪 Deutsch 🇨🇾 Ελληνικά (Κύπρος) 🇬🇷 Ελληνικά 🇮🇱 עברית 🇮🇹 Italiano 🇯🇵 日本語 🇰🇷 한국어 🇵🇱 Polski 🇧🇷 Português (Brasil) 🇷🇺 Русский 🇺🇦 Русский (Украина) 🇧🇦 Српски (БиХ) 🇷🇸 Srpski (Latinica) 🇲🇪 Српски (Црна Гора) 🇷🇸 Српски 🇸🇮 Slovenščina 🇪🇸 Español 🇺🇦 Українська 🇹🇷 Türkçe

Plugins von Drittanbietern

WordPress

Benutzerdefinierte Installationen

VanillaJS / HTML-Snippet
Angular
React
React Native
Vue
TypeScript
Mehrere Instanzen auf derselben Seite
Häufige Anwendungsfälle
Fehlerbehebung bei häufigen Problemen

Einbetten in Dokumente

Notion und Google Sites

Installation

FastComments ist so konzipiert, dass es auf jeder Art von Seite installiert werden kann - statisch oder dynamisch, mit hellem oder dunklem Design, öffentlichen oder internen Seiten. Es sollte einfach zu installieren und an jede Art von Website oder webbasierte Anwendung anzupassen sein.

WordPress Internal Link

Sie finden unser WordPress-Plugin hier.

Eine vollständige Installationsanleitung und Dokumentation zum Plugin finden Sie hier.

Dieses Plugin unterstützt Live-Kommentare, SSO und eine Installation ohne Code. Folgen Sie einfach der Installationsanleitung auf der Admin-Seite nach der Installation des Plugins. Es führt Sie durch die Verbindung Ihrer WordPress-Installation mit Ihrem Konto.

Alle Kommentare, die mit FastComments über unser WordPress-Plugin hinterlassen werden, können automatisch mit Ihrer WordPress-Installation synchronisiert werden, damit Sie die Kontrolle über Ihre Daten behalten. Diese Option kann deaktiviert werden, um die Größe Ihrer WordPress-Datenbank zu begrenzen.

VanillaJS / HTML-Snippet Internal Link

Die VanillaJS-Version des Widgets ist sehr einfach zu installieren und erfordert keine Build-Systeme oder serverseitigen Code.

Fügen Sie einfach den folgenden Code-Schnipsel zu einer beliebigen Seite hinzu:

Simple Code Snippet
Copy CopyRun External Link
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

Sie können denselben Code-Schnipsel auf vielen Seiten verwenden; es wird automatisch ein separater Thread pro Seite erstellt.

Viele Anwendungen haben eine Option "HTML-Einbettungscode". Wählen Sie diese und fügen Sie den obigen Code-Schnipsel ein.

Sie benötigen auch kein Konto zum Ausprobieren! Möglicherweise sehen Sie "tenantId: demo" im obigen Schnipsel, wenn Sie nicht angemeldet sind. Auf diese Weise wird das Demo-Konto verwendet.

Die Dokumentation zur Konfiguration des Widgets finden Sie hier.

Alle Versionen des FastComments-Widgets sind Wrapper um die Kern-VanillaJS-Bibliothek. Dies ermöglicht es uns, Funktionen hinzuzufügen und Probleme an einer Stelle zu beheben - und die Änderungen werden automatisch auf die anderen Varianten des Kommentar-Widgets übertragen.

Angular Internal Link

Sie finden unsere Angular-Bibliothek auf NPM hier.

Das FastComments Angular-Kommentar-Widget unterstützt alle Funktionen der VanillaJS-Version - Live-Kommentare, SSO und mehr.

Sie benötigen fastcomments-typescript als Peer-Abhängigkeit. Bitte stellen Sie sicher, dass diese in Ihrer TypeScript-Kompilierung enthalten ist. In Zukunft wird diese Peer-Abhängigkeit nach @types/fastcomments verschoben, was diese Installation vereinfachen wird.

FastComments Angular via NPM
Copy Copy
1
2 npm install fastcomments-typescript --save
3 npm install ngx-fastcomments --save
4

Die Peer-Abhängigkeit sollte in Ihrer tsconfig.json-Datei hinzugefügt werden, zum Beispiel:

Adding fastcomments-typescript peer dependency
Copy Copy
1
2"include": [
3 "src/**/*.ts",
4 "node_modules/fastcomments-typescript/src/index.ts"
5],
6

Fügen Sie dann das FastCommentsModule zu Ihrer Anwendung hinzu:

Add The Module to Your App
Copy 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

Verwendung

Um zu beginnen, übergeben wir ein Konfigurationsobjekt für den Demo-Mandanten:

Usage - Inline Configuration
Copy Copy
1
2<lib-fastcomments [config]="{ tenantId: 'demo' }"></lib-fastcomments>
3

Da die Konfiguration recht komplex werden kann, können wir eine Objektreferenz übergeben:

Usage - Pass Object for Configuration
Copy Copy
1
2<lib-fastcomments [config]="fastcommentsConfig"></lib-fastcomments>
3
Usage - EU
Copy Copy
1
2<lib-fastcomments [config]="{ tenantId: 'demo', region: 'eu' }"></lib-fastcomments>
3

Das Widget verwendet Änderungserkennung, sodass das Ändern von Eigenschaften des Konfigurationsobjekts ein Neuladen verursacht.

Die vom Angular-Komponenten unterstützte Konfiguration finden Sie hier.

React Internal Link

Sie finden unsere React-Bibliothek auf NPM hier.

Das FastComments React-Kommentar-Widget unterstützt alle Funktionen der VanillaJS-Version - Live-Kommentare, SSO und mehr.

FastComments React via NPM
Copy Copy
1
2npm install --save fastcomments-react
3
FastComments React via Yarn
Copy Copy
1
2yarn add fastcomments-react
3
React Example
Copy 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

Wenn Sie in der EU sind, sollten Sie den region-Parameter wie folgt setzen:

React Example - EU
Copy Copy
1
2 <FastCommentsCommentWidget tenantId="demo" region="eu" />
3

Die vom React-Komponenten unterstützte Konfiguration finden Sie hier.

React Native Internal Link

Sie finden unsere React Native-Bibliothek auf NPM hier.

Das FastComments React Native-Kommentar-Widget unterstützt alle Funktionen der VanillaJS-Version - Live-Kommentare, SSO und mehr.

FastComments React Native via NPM
Copy Copy
1
2npm install --save fastcomments-react-native
3
FastComments React Native via Yarn
Copy Copy
1
2yarn add fastcomments-react-native
3

Die Konfiguration wird etwas anders angegeben als bei der fastcomments-react-Bibliothek:

React Native Example
Copy Copy
1
2import { FastCommentsCommentWidget } from 'fastcomments-react-native';
3
4// ...
5
6 const tenantId = 'demo'; // Your tenant id. Can be fetched from https://fastcomments.com/auth/my-account/api-secret
7 const pageId = 'native-test'; // the ID or URL of the comment thread in your app.
8 const config = {
9 tenantId: tenantId,
10 urlId: pageId
11 };
12
13 return (
14 <FastCommentsCommentWidget config={config}/>
15 );
16

Wenn Sie in der EU sind, sollten Sie den region-Parameter setzen:

React Native - EU
Copy Copy
1
2 // ...
3 const config = {
4 tenantId: tenantId,
5 urlId: pageId,
6 region: 'eu'
7 };
8 // ...
9

Die vom React Native-Komponenten unterstützte Konfiguration finden Sie hier.

Vue Internal Link

Sie finden unsere Vue-Bibliothek auf NPM hier.

Zusätzlich ist eine vue-next-Bibliothek auf NPM hier verfügbar.

Den Quellcode finden Sie auf GitHub.

Das FastComments Vue-Kommentar-Widget unterstützt alle Funktionen der VanillaJS-Version - Live-Kommentare, SSO und mehr.

Die folgenden Anweisungen gelten für Vue 3, da es schon eine Weile verfügbar ist. FastComments unterstützt jedoch auch Vue 2 über die fastcomments-vue-Bibliothek.

FastComments Vue via NPM
Copy Copy
1
2npm install --save fastcomments-vue-next
3
FastComments Vue via Yarn
Copy Copy
1
2yarn add fastcomments-vue-next
3
Vue Example
Copy 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

Wenn Sie in der EU sind, sollten Sie die region auf EU setzen:

FastComments Vue - EU
Copy Copy
1
2<fast-comments v-bind:config="{tenantId: 'demo', region: 'eu'}"/>
3

Die fastcomments-vue- und fastcomments-vue-next-Bibliotheken unterstützen dieselbe Konfiguration wie das VanillaJS-Kommentar-Widget.

Die vom Vue-Komponenten unterstützte Konfiguration finden Sie hier.

TypeScript Internal Link

Die TypeScript-Definitionen für FastComments, die Typen für alle Konfigurationen des Kommentar-Widgets enthalten, finden Sie auf NPM hier.

Sie finden sie auf GitHub hier.

Mehrere Instanzen auf derselben Seite Internal Link

Jede Instanz des Kommentar-Widgets ist isoliert. Aus diesem Grund unterstützt FastComments von Haus aus mehr als eine Instanz pro Seite oder mehrere Instanzen, die auf denselben Chat-Thread verweisen.

Im Fall der VanillaJS-Bibliothek müssen Sie das Kommentar-Widget einfach an verschiedene DOM-Knoten binden. Wenn Sie einfach den aktuellen Thread auf der Seite aktualisieren möchten, siehe Kommentar-Threads wechseln ohne die Seite neu zu laden;

Synchronisierung des Authentifizierungsstatus über mehrere Instanzen

Betrachten wir das Beispiel einer benutzerdefinierten Single-Page-Anwendung, die eine Liste häufig gestellter Fragen mit eigenem Kommentar-Thread ist.

In diesem Fall haben wir mehrere Instanzen von FastComments gleichzeitig im DOM.

Das ist in Ordnung, aber es stellt einige Herausforderungen für die Benutzererfahrung dar.

Betrachten Sie diesen Ablauf:

  1. Der Benutzer besucht die Seite mit einer Liste von Fragen, jede mit ihrem eigenen Kommentar-Widget.
  2. Der Benutzer gibt seinen Benutzernamen und seine E-Mail-Adresse ein und hinterlässt eine Frage in einem der Threads.
  3. Er sieht ein anderes FAQ-Element, zu dem er eine Frage hat.
  4. Er möchte erneut kommentieren. Muss er seine E-Mail-Adresse und seinen Benutzernamen erneut eingeben?

In diesem Fall übernimmt FastComments die Synchronisierung des Authentifizierungsstatus über Widget-Instanzen für Sie. In Schritt vier wird der Benutzer bereits temporär authentifiziert sein, da er seinen Benutzernamen und seine E-Mail-Adresse auf derselben Seite eingegeben hat.

Häufige Anwendungsfälle Internal Link

Live-Kommentare sofort anzeigen

Das Kommentar-Widget ist standardmäßig live, jedoch erscheinen Live-Kommentare unter einem "N neue Kommentare anzeigen"-Button, um zu verhindern, dass sich der Seiteninhalt verschiebt.

In einigen Fällen ist es dennoch wünschenswert, die neuen Kommentare sofort anzuzeigen, ohne auf einen Button klicken zu müssen.

In diesem Fall möchten Sie das showLiveRightAway-Flag aktivieren, dessen Dokumentation Sie hier finden.

Anonyme Kommentare erlauben (keine E-Mail erforderlich)

Standardmäßig erfordert FastComments, dass der Benutzer beim Kommentieren eine E-Mail-Adresse hinterlässt.

Dies kann deaktiviert werden, Anweisungen finden Sie hier.

Benutzerdefiniertes Styling

Viele unserer Kunden wenden ihr eigenes Styling auf das Kommentar-Widget an. Die Dokumentation finden Sie hier.

Dieselben Kommentare auf mehreren Domains anzeigen

Das Anzeigen derselben Kommentare auf mehreren Websites ist etwas, das FastComments von Haus aus unterstützt. Siehe unsere Dokumentation zu diesem Thema.

Die aktuelle Seite wechseln

FastComments unterstützt SPAs und komplexe Anwendungen. Das Wechseln der aktuellen Seite ist einfach und wird hier behandelt.

Fehlerbehebung bei häufigen Problemen Internal Link

Hier sind einige häufig auftretende Symptome und gängige Lösungen.

"This is a demo"-Meldung

Dies wird angezeigt, wenn Sie den Widget-Code von unserer Startseite kopiert haben, die unseren Demo-Mandanten verwendet. Um Ihren Mandanten zu verwenden, kopieren Sie den Widget-Code von hier.

"FastComments cannot load on this domain"-Fehler

FastComments muss wissen, welche Domains Ihnen gehören, um Anfragen zu authentifizieren, die mit Ihrem Konto verbunden sind. Lesen Sie unsere Dokumentation, um zu erfahren, wie Sie diesen Fehler beheben können (fügen Sie einfach die genaue Subdomain + Domain zu Ihrem Konto hinzu).

Beachten Sie, dass dies nur nach Ablauf der Testphase auftreten sollte. Während der Testphase werden alle Anfragen von neuen Domains automatisch zu Ihrem Konto hinzugefügt.

Migrierte Kommentare werden bei benutzerdefinierten Installationen nicht angezeigt

Dies geschieht normalerweise, wenn die importierten Kommentare an eine Page ID gebunden sind und Sie eine URL übergeben (oder keinen Wert, in diesem Fall wird standardmäßig die Seiten-URL verwendet).

Sie können dies debuggen, indem Sie Ihre Kommentare exportieren und die Spalte URL ID (derzeit Spalte B) anzeigen.

Stellen Sie sicher, dass die Werte in der Spalte URL ID dieselben Werte sind, die Sie als urlId-Parameter an die Widget-Konfiguration übergeben.

Für weitere Erklärungen lesen Sie unsere Dokumentation darüber, wie Kommentare mit Seiten und Artikeln verknüpft werden.

Wenn alles andere fehlschlägt, kontaktieren Sie uns.

Kommentar-Widget wird nicht angezeigt

Wenn das Kommentar-Widget nicht angezeigt wird, überprüfen Sie die Chrome-Entwicklerkonsole auf Fehler.

Bei den meisten Fehlkonfigurationen zeigt das Kommentar-Widget zumindest einen Fehler auf der Seite an, wenn es laden kann. Nichts zu sehen ist normalerweise ein Hinweis auf einen Scripting-Fehler.

Gewünschte Konfiguration funktioniert nicht wie erwartet

Probieren Sie unsere Chrome-Erweiterung aus, um zu sehen, welche Konfiguration an das Kommentar-Widget übergeben wird. Wenn alles andere fehlschlägt, machen Sie einen Screenshot von dem, was die Chrome-Erweiterung anzeigt, und kontaktieren Sie uns.

Kommentare fehlen bei derselben URL mit unterschiedlichem Hash-Bang

Standardmäßig verwendet FastComments die Seiten-URL für den "Bucket", in dem Kommentare gespeichert werden. Wenn Ihre URLs #hashbangs enthalten und diese #hashbangs nicht Teil der Kennung sein sollten, die einen Kommentar-Thread identifiziert, können wir den Hash-Bang-Wert einfach ignorieren, zum Beispiel:

Ignore Hash Bangs Example
Copy Copy
1
2<script src="https://cdn.fastcomments.com/js/embed-v2.min.js"></script>
3<div id="fastcomments-widget"></div>
4<script>
5window.FastCommentsUI(document.getElementById('fastcomments-widget'), {
6 tenantId: "demo",
7 url: location.href.replace(location.hash, ''),
8 urlId: location.href.replace(location.hash, '')
9});
10</script>
11

Beachten Sie, dass nach dieser Änderung eine Migration für bestehende Kommentare durchgeführt werden muss. Kontaktieren Sie uns dafür.

URL-Abfrageparameter beeinflussen das Widget

Standardmäßig verwendet FastComments die Seiten-URL für den "Bucket", in dem Kommentare gespeichert werden. Wenn Ihre URLs Abfrageparameter enthalten, die nicht Teil der Kennung sein sollten, die einen Kommentar-Thread identifiziert, können wir sie einfach ignorieren, zum Beispiel:

Ignore Query Parameters
Copy Copy
1
2<script src="https://cdn.fastcomments.com/js/embed-v2.min.js"></script>
3<div id="fastcomments-widget"></div>
4<script>
5window.FastCommentsUI(document.getElementById('fastcomments-widget'), {
6 tenantId: "demo",
7 url: location.protocol + '//' + location.host + location.pathname,
8 urlId: location.pathname
9});
10</script>
11

Beachten Sie, dass nach dieser Änderung eine Migration für bestehende Kommentare durchgeführt werden muss. Kontaktieren Sie uns dafür.

E-Mails werden nicht empfangen

Bei FastComments investieren wir viel Arbeit, um sicherzustellen, dass unsere E-Mail-Zustellung so zuverlässig wie möglich ist. Einige E-Mail-Anbieter sind jedoch notorisch schwer zuverlässig zu erreichen. Überprüfen Sie Ihren Spam-Ordner auf Nachrichten von fastcomments.com.

Wenn Sie uns kontaktieren, können wir in der Regel mehr Einblick geben, warum Sie möglicherweise keine E-Mails von uns erhalten.

Notion und Google Sites Internal Link

Möchten Sie Kommentare zu Ihren Notion-Seiten hinzufügen? Wir haben die Lösung für Sie.

Notion

Zum Hinzufügen von Kommentaren zu Notion-Dokumenten sehen Sie das Erklärvideo hier.

Google Sites

Google Sites wird ebenfalls unterstützt, und der Ablauf ist ähnlich.

  1. Erstellen Sie eine Konversation zum Einbetten.
  2. Navigieren Sie beim Bearbeiten Ihrer Google-Site zu Einfügen -> Einbetten. Wählen Sie Nach URL.
  3. Fügen Sie die URL aus Schritt 1 ein.
  4. Klicken Sie auf Einfügen. Fertig!
Hinweis: Kommentare werden erst nach der Veröffentlichung angezeigt
FastComments in Google Sites

Nimbus Note

Das Hinzufügen von Live-Kommentaren zu einer Nimbus Note wird ebenfalls unterstützt, und der Ablauf ist ähnlich wie bei Notion.

  1. Erstellen Sie eine Konversation zum Einbetten.
  2. Fügen Sie beim Bearbeiten Ihrer Notiz einen Einbettungsblock hinzu.
  3. Verwenden Sie die URL aus Schritt 1 als einzubettende URL.
  4. Fertig!
Zu diesem Leitfaden beitragen