Προσθήκη Σχολίων σε Ιστότοπους BigCommerce

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

Για να το κάνουμε αυτό, θα μεταβούμε στο Storefront και μετά στο Themes.

Επιλογή Storefront

Επιλογή Themes

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

Στη συνέχεια, δεν θα κάνουμε κλικ στο Customize. Αντίθετα, κάντε κλικ στο Advanced και στο Make a Copy.

Δημιουργία Αντιγράφου

Επιβεβαιώστε την αντιγραφή του θέματος:

Αποθήκευση του Αντιγράφου

Μόλις ολοκληρωθεί, θα δείτε το θέμα σας να εμφανίζεται κάτω από το Themes στο κάτω μέρος της σελίδας, όπως παρακάτω.

Το Προσαρμοσμένο Θέμα Δημιουργήθηκε

Τώρα μπορούμε να επεξεργαστούμε το νέο μας θέμα για να προσθέσουμε το FastComments.

Επεξεργασία Αρχείων Θέματος

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

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

Αυτό που πρόκειται να κάνουμε είναι να επεξεργαστούμε ένα πρότυπο που αντιπροσωπεύει τις σελίδες των δημοσιεύσεων του ιστολογίου μας.

Στην αριστερή πλοήγηση, μεταβείτε στο templates->pages->blog-post.html.

Άνοιγμα του προτύπου

Στη συνέχεια, αντιγράψτε τον κώδικα που θα χρησιμοποιήσουμε για την εγκατάσταση του FastComments:

BigCommerce Comments Code

Copy

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

Τώρα πρόκειται να επικολλήσουμε τον κώδικα του widget στη Line 6. Είναι σημαντικό ο κώδικας να προστεθεί πριν τη γραμμή με \{{/partial}}.

Επικόλληση στη Γραμμή 6

Θα πρέπει να έχετε κάτι σαν το παρακάτω:

Μετά την προσθήκη του κώδικα

Τώρα μπορούμε να αποθηκεύσουμε το αρχείο:

Αποθήκευση

...και έξοδος από τον επεξεργαστή:

Επεξεργασία του Επεξεργαστή

Το τελευταίο μας βήμα είναι να χρησιμοποιήσουμε το νέο πρότυπο θέματος.

Στο πάνω δεξιά μέρος, τώρα θα δείτε είτε Publish είτε Make Active Theme. Κάντε κλικ σε αυτό για να συνεχίσετε και να δημοσιεύσετε τις αλλαγές:

Δημοσίευση των αλλαγών

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

Αλλαγές σε πραγματικό χρόνο

Καλή δουλειά! Έχετε προσθέσει σχόλια σε πραγματικό χρόνο στον ιστότοπό σας στο BigCommerce.

Αν αντιμετωπίζετε σφάλμα "permission denied" ή θέλετε να προσαρμόσετε το FastComments, διαβάστε παρακάτω.

FastComments έχει σχεδιαστεί για να προσαρμόζεται ώστε να ταιριάζει με τον ιστότοπό σας.

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

Δεν συνιστάται να προσθέτετε το FastComments μέσω του Page Builder του BigCommerce, καθώς τότε ο κώδικας πρέπει να προστεθεί χειροκίνητα σε κάθε επιθυμητή σελίδα.

Ωστόσο, αν αυτό επιθυμείτε, πρέπει να χρησιμοποιηθεί το ακόλουθο απόσπασμα κώδικα. Αποσπάσματα κώδικα από άλλα σεμινάρια δεν θα λειτουργήσουν λόγω της φύσης του BigCommerce:

Απόσπασμα Page Builder του BigCommerce

Copy

1

2<script async src="https://cdn.fastcomments.com/js/embed-v2-async.min.js"></script>

3<div id="fastcomments-widget"></div>

4<script>

5 window.fcConfigs = [{

6 target: '#fastcomments-widget',

7 tenantId: "demo"

8 }];

9</script>

10