Add Comments to BigCommerce Sites

Първо, нека създадем персонализирана тема, която ще редактираме. Ако вече имате настроена персонализирана тема, можете да пропуснете тази стъпка.

To do this, we will go to Storefront and then Themes.

Изберете Storefront

Изберете Themes

For the purposes of this tutorial we will use the default theme, but the instructions are the same for all themes.

Next, we are няма going to click Customize. Instead, click Advanced and Make a Copy.

Направете копие

Confirm copying the theme:

Запазете копието

Once complete, you should see your theme listed under Themes on the bottom of the page, like so.

Създадена персонализирана тема

Now we can edit our new theme to add FastComments.

Редактирайте файловете на темата

Следващата стъпка е да добавите кода на уиджета, който прави интеграцията да работи.

След като влезете в редактора на темата, както е указано в предишната стъпка, ще видите браузър за файлове вляво и редактор вдясно.

Ще редактираме шаблон, който представлява страниците на нашите публикации в блога.

В навигацията отляво отидете на 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

Сега ще поставим кода на джаджата на 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 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