Dodaj komentarje v tečaje ThriveCart Learn+

Zaradi zasnove ThriveCart Learn+ moramo dodati FastComments kodo na vsako stran tečaja, na kateri želimo prikazovati komentarje.

Na vsaki strani lahko uporabimo isti kodni odlomek, ločene niti komentarjev pa bodo samodejno povezane z vsako posamezno stranjo.

Začeli bomo tako, da v urejevalniku odpremo naš tečaj in dodamo HTML blok.

Na levi strani bi morali videti možnost HTML bloka. Povlecite ga na stran, kjer želite prikazati komentarje.

Odprite tečaj in dodajte HTML blok

Zdaj izberite nov HTML element. Na levi se bo pojavil blok, kamor lahko prilepimo našo kodo.

Zdaj ste pripravljeni za korak 2.

Za 2. korak moramo kopirati našo kodo. Preverite, da vrstica 50 ne pravi "demo" – poskrbeli boste, da bo tam vaš ID najemnika (tenant id). Ta bi moral biti že izpolnjen za vas.

Zdaj kopirajmo našo kodo, specifično za ThriveCart-Learn.

Je precej obsežna, ker ima integracija s ThriveCart veliko funkcionalnosti, zato preprosto kliknite gumb Copy v zgornjem desnem kotu kode:

Koda za komentarje ThriveCart Learn+

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 attemptsRemaining = 10;

7

8 function tryLoad() {

9 const simpleSSO = {optedInNotifications: true, optedInSubscriptionNotifications: true};

10 let isAuthenticated = false;

11 let profileLink = document.querySelector('.thrivecart-courses-header-profile-link');

12 if (!profileLink) {

13 profileLink = document.querySelector('.thrivecart-courses-header-profile'); // class is different for preview.

14 }

15 // broad email input field selector incase ThriveCart changes id.

16 const emailInputField = document.querySelector('input[type=email]');

17 if (emailInputField && emailInputField.value) {

18 isAuthenticated = true;

19 simpleSSO.email = emailInputField.value;

20 } else if (profileLink && !profileLink.innerText.includes('John Smith')) { // allow preview to work - no email available.

21 attemptsRemaining--;

22 if (!attemptsRemaining) {

23 return console.error('Could not load FastComments - could not determine user information (email). Please reach out to FastComments support.');

24 }

25 console.warn('FastComments: No user email found - waiting and trying again.');

26 return setTimeout(tryLoad, attemptsRemaining < 5 ? 3000 : 100); // increase wait time after 5 attempts incase slow internet.

27 }

28 if (profileLink) {

29 // use raw "img" query incase ThriveCart changes image class selector.

30 const avatarImg = profileLink.querySelector('img');

31 if (avatarImg && avatarImg.src) {

32 isAuthenticated = true;

33 simpleSSO.avatar = avatarImg.src;

34 }

35 // use innerText incase ThriveCart changes how profile name is displayed.

36 if (profileLink.innerText) {

37 isAuthenticated = true;

38 simpleSSO.username = profileLink.innerText;

39 } else {

40 const bold = profileLink.querySelector('b');

41 if (bold && bold.innerText) {

42 isAuthenticated = true;

43 simpleSSO.username = bold.innerText;

44 }

45 }

46 } else {

47 if (!attemptsRemaining) {

48 return console.error('Could not load FastComments - could not determine user information (user name/avatar). Please reach out to FastComments support.');

49 }

50 console.warn('FastComments: No user profile info found - waiting and trying again.');

51 attemptsRemaining--;

52 return setTimeout(tryLoad, attemptsRemaining < 5 ? 3000 : 100); // increase wait time after 5 attempts incase slow internet.

53 }

54

55 let url;

56 const selectedNavLink = document.querySelector('.tcc-browse-lesson.active a');

57

58 if (selectedNavLink) {

59 // sometimes TC uses multiple links the same page, so let's de-dupe them.

60 url = getPathnameFromUrl(selectedNavLink.href);

61 } else {

62 // trim marketing parameters and domain name

63 url = window.location.pathname;

64 }

65

66 if (url) {

67 url = url.replace('/starte-hier', '');

68 url = url.replace('/start-here', '');

69 }

70

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

72 tenantId: 'demo',

73 urlId: url,

74 simpleSSO: isAuthenticated ? simpleSSO : null

75 });

76 }

77

78 tryLoad();

79

80 function getPathnameFromUrl(url) {

81 try {

82 const parsedUrl = new URL(url);

83 // trim marketing parameters and domain name

84 return parsedUrl.pathname;

85 } catch (error) {

86 console.error("Invalid URL", url, error);

87 return window.location.pathname; // default to current, so at least it works sometimes

88 }

89 }

90

91 })();

92</script>

93

Zdaj jo prilepite v blok kode na levi strani v ThriveCart urejevalniku. Videti mora biti takole:

Koda dodana

To je vse! Zdaj moramo le še objaviti:

Objava

To je to! Zdaj bi morali pri predogledu videti okvir za komentarje v vašem tečaju, pravi uporabniki pa bodo lahko puščali komentarje brez prijave ali ponovnega vnašanja uporabniškega imena/e-pošte.

Opomba za testiranje!

Če imate onemogočeno anonimno komentiranje (kar je privzeto), ne boste mogli puščati komentarjev v načinu Preview kot uporabnik John Smith. Prejeli boste napako avtentikacije, saj privzeti uporabnik John Smith nima e-pošte. Če želite testirati, priporočamo, da uporabite kodo za kupon in prehodite svojo stran kot pravi uporabnik.

Uspešno! Zdaj bi morali videti FastComments pripomoček za komentarje.

Uspešno!

Čestitamo pri nastavitvi FastComments s ThriveCart! Če ste naleteli na Domain Error, ali bi radi izvedeli, kako prilagoditi območje komentarjev, berite naprej!

FastComments je zasnovan tako, da ga lahko prilagodite vaši spletni strani.

Če želite dodati prilagojeno oblikovanje ali prilagoditi konfiguracijo, Oglejte si našo dokumentacijo o prilagoditvah, da se naučite, kako.