Ajouter des commentaires avec MemberSpace

Nous pouvons facilement connecter FastComments avec MemberSpace avec un petit extrait de code:

FastComments MemberSpace Snippet

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 const tenantId = 'demo';

7 const ALLOW_ANON = false;

8 const LOGIN_URL = 'https://example.com/login';

9 const PLAN_DISPLAY_LABELS = {

10 'VIP Plan': 'VIP'

11 };

12 let lastInstance;

13

14 function tick() {

15 if (!window.MemberSpace) {

16 return setTimeout(tick, 100);

17 }

18 if (!window.FastCommentsUI) {

19 return setTimeout(tick, 100);

20 }

21 const target = document.getElementById('fastcomments-widget');

22 if (!target) {

23 return setTimeout(tick, 100);

24 }

25 const data = MemberSpace.getMemberInfo();

26 if (data.isLoggedIn && data.memberInfo) {

27 lastInstance = FastCommentsUI(target, {

28 tenantId: tenantId,

29 urlId: window.location.pathname,

30 simpleSSO: {

31 displayLabel: getDisplayLabel(data.memberInfo),

32 username: data.memberInfo.name,

33 email: data.memberInfo.email,

34 avatar: data.memberInfo.profileImageUrl

35 }

36 });

37 } else if (lastInstance) {

38 lastInstance.destroy();

39 lastInstance = FastCommentsUI(target, {

40 tenantId: tenantId,

41 urlId: window.location.pathname,

42 simpleSSO: getAnonSSOConfig()

43 });

44 }

45 }

46

47 function getAnonSSOConfig() {

48 if (ALLOW_ANON) {

49 return undefined;

50 }

51 return {

52 loginURL: LOGIN_URL

53 };

54 }

55

56 function getDisplayLabel(memberInfo) {

57 if (!memberInfo.memberships) {

58 return;

59 }

60 for (const membership of memberInfo.memberships) {

61 const label = PLAN_DISPLAY_LABELS[membership.name];

62 if (label) {

63 return label

64 }

65 }

66 }

67

68 tick();

69 })();

70</script>

71

Lorsque l'utilisateur visite votre site ou application tout en étant connecté via MemberStack, il sera automatiquement connecté à FastComments et ses commentaires seront marqués comme Verified.

De plus, dans l'exemple ci-dessus, si vous avez un plan d'abonnement appelé VIP Plan, nous afficherons un badge VIP à côté du nom de l'utilisateur. Vous pouvez modifier l'exemple pour ajouter plus de plans. Contactez le support si vous avez des questions.

Autoriser les commentaires anonymes

Si vous souhaitez également avoir des commentaires anonymes, définissez ALLOW_ANON sur true comme ceci:

const ALLOW_ANON = true;

N'oubliez pas également de changer https://example.com/login vers l'endroit où vous voulez que les utilisateurs aillent lorsqu'ils cliquent sur le bouton Login:

De cette façon, les utilisateurs auront la possibilité d'entrer leur nom et leur e-mail pour commenter s'ils ne sont pas connectés à votre site membre.

FastComments est conçu pour être personnalisé afin de correspondre à votre site.

Si vous souhaitez ajouter un style personnalisé ou modifier la configuration, consultez notre documentation de personnalisation pour apprendre comment.