FastComments.com

Add Comments With Memberstack


FastComments を使用すると、Memberstack と組み合わせて、メンバー限定のコメント機能を設定できます!

コード Internal Link

小さなコードスニペットでFastCommentsをMemberstackと簡単に接続できます:

FastComments Memberstack Snippet
Copy Copy
1
2<script src="https://cdn.fastcomments.com/js/embed-v2.min.js"></script>
3<div id="fastcomments-widget"></div>
4<script>
5 window.$memberstackDom.getCurrentMember().then(({data: member}) => {
6 if (member) {
7 FastCommentsUI(document.getElementById('fastcomments-widget'), {
8 tenantId: "demo",
9 urlId: window.location.pathname,
10 simpleSSO: {
11 username: member.customFields.name || member.auth.email.replace(/@.+/, ''),
12 email: member.auth.email,
13 avatar: member.customFields.avatar
14 }
15 });
16 } else {
17 FastCommentsUI(document.getElementById('fastcomments-widget'), {
18 tenantId: "demo",
19 urlId: window.location.pathname,
20 simpleSSO: null
21 });
22 }
23 })
24</script>
25

ユーザーがMemberstackでログインした状態であなたのサイトやアプリケーションを訪問すると、自動的にFastCommentsにログインし、そのコメントは Verifiedとマークされます。

ログインしていない場合でも、名前とメールアドレスを残してコメントすることができます。

メンバー限定コメント

メンバー限定コメントを設定したい場合は、以下のコードスニペットを試してください。ただし、https://example.com/loginを、ユーザーがLoginボタンをクリックしたときに移動させたい場所に変更してください:

Exclusive FastComments Memberstack Snippet
Copy Copy
1
2<script src="https://cdn.fastcomments.com/js/embed-v2.min.js"></script>
3<div id="fastcomments-widget"></div>
4<script>
5 window.$memberstackDom.getCurrentMember().then(({data: member}) => {
6 if (member) {
7 FastCommentsUI(document.getElementById('fastcomments-widget'), {
8 tenantId: "demo",
9 urlId: window.location.pathname,
10 simpleSSO: {
11 username: member.customFields.name || member.auth.email.replace(/@.+/, ''),
12 email: member.auth.email,
13 avatar: member.customFields.avatar
14 }
15 });
16 } else {
17 FastCommentsUI(document.getElementById('fastcomments-widget'), {
18 tenantId: "demo",
19 urlId: window.location.pathname,
20 simpleSSO: {
21 loginURL: 'https://example.com/login'
22 }
23 });
24 }
25 })
26</script>
27

カスタマイズ Internal Link

FastCommentsは、あなたのサイトに合わせてカスタマイズできるように設計されています。

カスタムスタイリングを追加したり、設定を調整したりしたい場合は、カスタマイズドキュメントをご覧ください。