Add Comments to BigCommerce Sites

Najpierw stwórzmy motyw niestandardowy, który będziemy edytować. Jeśli masz już skonfigurowany motyw niestandardowy, możesz pominąć ten krok.

Aby to zrobić, przejdziemy do Storefront, a następnie do Themes.

Wybierz Storefront

Wybierz Themes

Na potrzeby tego samouczka użyjemy motywu domyślnego, ale instrukcje są takie same dla wszystkich motywów.

Następnie nie będziemy klikać Dostosuj. Zamiast tego kliknij Advanced i Make a Copy.

Zrób kopię

Potwierdź skopiowanie motywu:

Zapisz kopię

Po zakończeniu powinieneś zobaczyć swój motyw wymieniony w sekcji Themes na dole strony, w ten sposób.

Utworzono motyw niestandardowy

Teraz możemy edytować nasz nowy motyw, aby dodać FastComments.

Edytuj pliki motywu

Następnym krokiem będzie dodanie kodu widżetu, który sprawi, że integracja będzie działać.

Kiedy znajdziesz się w edytorze motywu, zgodnie z instrukcjami z poprzedniego kroku, zobaczysz po lewej przeglądarkę plików, a po prawej edytor.

Zamierzamy edytować szablon, który reprezentuje nasze strony z wpisami na blogu.

W nawigacji po lewej przejdź do templates->pages->blog-post.html.

Otwórz szablon

Następnie skopiuj kod, którego użyjemy do zainstalowania 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

Teraz wkleimy kod widgetu na Line 6. Ważne jest, aby kod został dodany przed linią z {{/partial}}.

Wklej na Line 6

Powinno to wyglądać mniej więcej tak:

Po dodaniu kodu

Teraz możemy zapisać plik:

Zapisz

...i wyjdź z edytora:

Edytuj edytor

Ostatnim krokiem jest użycie nowego szablonu motywu.

W prawym górnym rogu zobaczysz teraz albo Publish albo Make Active Theme. Kliknij to, aby kontynuować i wprowadzić zmiany na żywo:

Opublikuj zmiany

Teraz możemy sprawdzić naszą stronę! Jeśli przejdziesz do wpisu na blogu, na dole powinno pojawić się pole komentarza.

Zmiany na żywo

Świetna robota! Dodałeś komentarze na żywo do swojej witryny BigCommerce.

Jeśli napotkałeś błąd odmowy dostępu ('permission denied'), lub chcesz dostosować FastComments, czytaj dalej.

FastComments został zaprojektowany tak, aby można go było dostosować do twojej witryny.

Jeśli chcesz dodać niestandardowe style lub zmienić konfigurację, Zobacz dokumentację dotyczącą dostosowywania i konfiguracji, aby dowiedzieć się, jak.

Nie zaleca się dodawania FastComments za pomocą kreatora stron (Page Builder) BigCommerce, ponieważ wtedy kod musi być ręcznie dodawany na każdej wybranej stronie.

Jeśli jednak jest to pożądane, należy użyć następującego fragmentu kodu. Fragmenty kodu z innych samouczków nie będą działać ze względu na specyfikę BigCommerce:

Fragment kreatora stron BigCommerce

Copy

1

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

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

4<script>

5 (function () {

6 let loaded = false;

7 function attemptLoad() {

8 if (loaded) {

9 return;

10 }

11 if (!window.FastCommentsUI) {

12 return;

13 }

14 FastCommentsUI(document.getElementById('fastcomments-widget'), {

15 tenantId: "demo"

16 });

17 loaded = true;

18 }

19 attemptLoad();

20 const interval = setInterval(function () {

21 attemptLoad();

22 if (loaded) {

23 clearInterval(interval);

24 }

25 }, 300);

26 })();

27</script>

28