Add Live Chat to ClickFunnels Courses

First, we need to open the ClickFunnels template editor. For courses, this is accessed by opening the course and clicking Customize in the top right:

התאמה אישית

Go to Templates:

פתח תבניות

Courses consist of different templates. We want to display comments on lessons, so select Default Lesson Page (for example):

בחר תבנית

That's it! Now you're ready for step two.

עכשיו כשאנחנו בעורך התבניות, עלינו להחליט היכן נרצה להציג את ההערות או את הצ'אט החי.

בדוגמה זו נוסיף אותו ישירות מתחת לווידאו. עברו עם העכבר מעל האלמנט כדי להוסיף את הווידג'ט בסופו, ולחצו על ADD ELEMENT:

הוסף אלמנט

Select CUSTOM JS/HTML:

בחרו ב־CUSTOM JS/HTML

עכשיו נפתח את עורך הקוד שבו נדביק את הקוד שלנו.

ClickFunnels is a bit confusing on this next step.

חשוב לא לבחור את 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 // כמה ספקים משנים את קטע הקוד כדי שיהיה אסינכרוני

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 Live Commenting, נסו את זה:

קטע קוד ל-ClickFunnels Live Commenting

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 script, בזמן הנכון, כך שהתסריט של הווידאו שלך גדל עם כל וובינר ללא כל עבודה ידנית.

זה כלול כיום בכל התוכניות של FastComments.

למידע נוסף על תגובות מתוזמנות כאן

שים לב!

זכור שעמודת URL ID בקובץ ה-CSV חייבת להתאים ל-URL של הקורס/הווידאו.