Add Live Chat to ClickFunnels Courses

Спочатку потрібно відкрити редактор шаблонів ClickFunnels. Для курсів це робиться шляхом відкриття курсу та натискання Customize у верхньому правому куті:

Налаштувати

Перейдіть до Templates:

Відкрийте шаблони

Курси складаються з різних шаблонів. Ми хочемо відображати коментарі на уроках, тому виберіть Default Lesson Page (наприклад):

Виберіть шаблон

Ось і все! Тепер ви готові до кроку два.

Тепер, коли ми в редакторі шаблонів, потрібно вирішити, де саме ми хочемо відображати коментарі або чат в реальному часі.

У цьому прикладі ми додамо його безпосередньо під відео. Наведіть курсор на елемент, щоб додати віджет у кінець, і натисніть ADD ELEMENT:

Додати елемент

Оберіть CUSTOM JS/HTML:

Оберіть CUSTOM JS/HTML

Тепер відкриємо редактор коду, куди вставимо наш код.

У ClickFunnels наступний крок трохи заплутаний.

Важливо, щоб ви НЕ обирали Code, коли наведете курсор на новий елемент. Натомість оберіть SETTINGS:

Оберіть SETTINGS

Тепер праворуч ми можемо натиснути Open Code Editor:

Натисніть Open Code Editor

Відкриється велика площина. Саме сюди ми можемо вставити наш код. Скопіюйте наступний фрагмент (використайте кнопку копіювання у верхньому правому куті):

Фрагмент коду стрімінгового чату ClickFunnels

Copy

1

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

3<div id="fastcomments-live-chat-widget" style="width: 500px;min-height: 780px;"></div>

4<style>

5 #fastcomments-live-chat-widget iframe {

6 min-height: 780px;

7 }

8</style>

9<script>

10 (function fcLoad() {

11 function tryLoad() {

12 // деякі провайдери змінюють фрагмент коду, роблячи його async

13 const container = document.getElementById('fastcomments-live-chat-widget');

14 if (!container) {

15 return waitRetry();

16 }

17 if (!window.FastCommentsLiveChat) {

18 return waitRetry();

19 }

20 window.FastCommentsLiveChat(container, {

21 tenantId: 'demo'

22 });

23 }

24 function waitRetry() {

25 setTimeout(tryLoad, 500);

26 }

27 tryLoad();

28 })();

29</script>

30

Цей фрагмент коду призначений для нашого продукту Streaming Chat, який добре підходить для відео. Якщо вам потрібен фрагмент коду для віджета Live Commenting, який краще підходить для звичайних сторінок або блог-публікацій, він знаходиться в кінці цього посібника.

Коли ми вставимо фрагмент коду у вікно, це має виглядати так:

Вставити код

Залишається лише закрити вікно:

Закрити

Тепер ви можете попередньо переглянути внесені зміни! Сміливо переміщуйте віджет та дивіться, де він найбільше підходить.

Попередній перегляд

Успіх! Не забудьте протестувати мобільну версію!

Успіх!

FastComments розроблено так, щоб його можна було налаштувати відповідно до вашого сайту.

Якщо ви хочете додати власні стилі або змінити конфігурацію, Перегляньте нашу документацію з налаштувань і конфігурації, щоб дізнатися, як.

Якщо ви шукаєте фрагмент коду для живих коментарів ClickFunnels, спробуйте це:

Фрагмент коду для живих коментарів ClickFunnels

Copy

1

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

3<div id="fastcomments-widget" style="min-width: 500px;min-height: 780px;"></div>

4<style>

5 #fastcomments-widget iframe {

6 min-height: 780px;

7 }

8</style>

9<script>

10 (function fcLoad() {

11 function tryLoad() {

12 // деякі провайдери змінюють фрагмент коду, роблячи його асинхронним

13 const container = document.getElementById('fastcomments-widget');

14 if (!container) {

15 return waitRetry();

16 }

17 if (!window.FastCommentsUI) {

18 return waitRetry();

19 }

20 window.FastCommentsUI(container, {

21 tenantId: 'demo'

22 });

23 }

24 function waitRetry() {

25 setTimeout(tryLoad, 500);

26 }

27 tryLoad();

28 })();

29</script>

30

FastComments підтримує функцію Auto Play. Вона дозволяє імпортувати CSV із коментарями та запланувати їх відтворення з певними зсувами за годинами, хвилинами та секундами від часу завантаження сторінки.

Вона також автоматично додає будь-які опубліковані коментарі назад у скрипт autoplay у відповідний час, тож ваш відеоскрипт зростає з кожним вебінаром без ручної роботи.

Наразі ця функція включена у всі плани FastComments.

Дізнайтеся більше про Заплановані коментарі тут

Примітка!

Пам'ятайте, що стовпець URL ID у CSV-файлі повинен відповідати URL курсу/відео.