댓글 위젯이 예를 들어 테넌트 ID가 "demo"인 상태로 사용될 수 있다는 것을 알 수 있습니다:

Demo Tenant ID

Copy Run

1

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

3<div id="fastcomments-widget"></div>

4<script>

5window.fcConfigs = [{

6 "tenantId": "demo"

7}];

8</script>

9

이것은 댓글 위젯을 시험해 보거나 가지고 놀아보기 위한 목적일 뿐입니다. 실제 운영 환경에서는 다음과 같이 자신의 테넌트 ID를 전달해야 합니다:

Defining Your Tenant ID

Copy Run

1

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

3<div id="fastcomments-widget"></div>

4<script>

5window.fcConfigs = [{

6 "tenantId": "aKa2Z4Q="

7}];

8</script>

9

귀하의 테넌트 ID는 계정의 댓글 위젯 코드 스니펫에 이미 적용되어 있습니다.

또한 테넌트 ID를 확인하고 API 키를 관리하려면 API 자격 증명 페이지를 확인하세요.

앞으로는 FastComments에 로그인한 상태라면(https://fastcomments.com에 로그인한 경우) 코드 예제들이 실제 테넌트 ID를 사용합니다.

댓글 스레드를 렌더링 하거나 댓글을 남길 때, FastComments는 해당 댓글이 어느 페이지, 기사, 또는 상품에 속하는지 알아야 합니다.

이를 위해 우리는 "URL ID"라고 부르는 것을 사용합니다. 이는 문자열이나 숫자 같은 식별자이거나 또는 URL일 수 있습니다.

기본적으로 urlId를 지정하지 않으면 페이지 URL이 됩니다. 현재 페이지 URL을 가져와 흔히 사용되는 마케팅 파라미터나 추적 식별자는 제거하도록 정리합니다.

WordPress와 같은 서드파티 통합의 경우, 플러그인은 보통 현재 보고 있는 정보를 나타내는 식별자(예: 기사/페이지 id)를 URL ID로 사용합니다.

Defining a Custom URL ID

Copy Run

1

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

3<div id="fastcomments-widget"></div>

4<script>

5window.fcConfigs = [{

6 "tenantId": "demo",

7 "urlId": "https://example.com/page"

8}];

9</script>

10

이 문서에서 자주 참조하는 한 가지는 위젯 사용자화 UI입니다.

이 UI는 코드를 사용하지 않고도 댓글 위젯에 대한 다양한 변경을 적용하는 데 사용할 수 있습니다.

커스터마이즈 규칙을 만들 때, 일반적으로 사이트의 모든 페이지에 적용되도록 하려는 경우가 많습니다. 그러나 경우에 따라 특정 페이지에 대해 댓글 위젯을 맞춤 설정하고 싶을 수 있습니다. 예를 들어 특정 페이지에 대해 사용자 정의 스타일을 적용하거나 해당 페이지의 댓글을 익명으로 처리하도록 할 수 있습니다. 또한 일부 페이지에서는 라이브 댓글을 즉시 표시하고, 다른 페이지에서는 알림 버튼 아래에 숨길 수도 있습니다.

이는 이 페이지의 URL ID 입력 필드를 통해 모두 가능합니다. 해당 필드는 다음과 같이 보입니다:

URL ID Input in The Widget Customization Page

이 필드의 값은 댓글 위젯에 전달되는 urlId 매개변수와 일치해야 합니다. 커스터마이즈 규칙이 urlId에 구애받지 않게 하려면 이 필드를 비워두거나 *를 입력하세요.

As of 2023 the URL ID field in widget customization now also takes patterns! For example you may have */blog/* to add styling specific to your blog and */store/* to have styling specific to your store, all while using the same domain.

주의사항

1. 페이지에 해시 파라미터가 있는 경우(예: example.com#page-1) - 기본적으로 이것은 URL ID의 일부가 됩니다.
2. 마이그레이션 중(예: WordPress에서 Gatsby로) 초기 마이그레이션 이후 URL ID 댓글 값을 이전해야 할 수도 있습니다. 이 경우 저희에게 문의하세요.

FastComments는 맞춤화되도록 설계되었습니다. 댓글 위젯 자체는 보안상 iframe 내부에서 실행되므로, 사용자 정의 스타일을 적용하려면 다음 두 가지 접근 방식 중 하나를 따라야 합니다.

The first, the easiest approach, and preferred by us, is to use the widget customization page.

In the widget customization page, see the "Show Advanced Options" section, under which there is an area labeled "Custom CSS":

Custom CSS Input Area

이 접근 방식의 장점은 다음과 같습니다:

1. 입력한 CSS는 사용자에게 전송되기 전에 minify되며, 편집 UI에서 형식이 일관되게 유지됩니다.
2. 위젯 커스터마이즈 UI의 모든 이점을 누릴 수 있습니다. 예를 들어 사이트마다 댓글 위젯을 쉽게 다르게 커스터마이즈할 수 있습니다.
3. 저희가 댓글 위젯을 변경할 때, 귀하의 맞춤 스타일은 릴리스 프로세스의 일부로 테스트됩니다.

The second approach is to specify the customCSS parameter in the widget configuration, as follows:

Passing Custom CSS

Copy Run

1

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

3<div id="fastcomments-widget"></div>

4<script>

5window.fcConfigs = [{

6 "tenantId": "demo",

7 "customCSS": "button { background: red; }"

8}];

9</script>

10

However, this has limitations:

1. 헤더 크기 때문에, 서버가 요청을 거부하기 전에 전달할 수 있는 사용자 정의 CSS의 양에는 한계가 있습니다.
2. 사용자 정의 CSS는 귀하의 인프라와 빌드 시스템에서 관리해야 합니다. 이는 단점이라기보다 장점일 수도 있습니다.
3. 이 경우 사용자 정의 CSS가 당사 서버로 전송된 후 다시 iframe 콘텐츠로 전송되므로 네트워크를 통해 두 번 전송되는 추가 오버헤드가 발생합니다. 다만 대부분의 페이로드 크기에서는 눈에 띄지 않습니다.
4. 일반적인 최적화는 네트워크 상의 크기를 줄이기 위해 CSS를 미니파이하는 것입니다. 그러나 이 접근 방식을 사용하는 경우 해당 작업을 직접 처리해야 합니다.
5. 저희가 변경을 할 때 귀하의 사용자 정의 CSS는 테스트되지 않습니다.

External CSS Files

You can tell the widget to fetch an external file by using @import!

It's recommended to put the @import in a customization rule. This way, if we ever need to make a change to the comment widget, we can use our automation tooling to verify your setup. So for example, you would create a customization rule in the Widget Customization UI, click Advanced, and enter in Custom CSS:

@import url(https://example.com/styles.css);

In Code - Not Recommended

You can also load an external CSS file via the customCSS property:

External CSS File

Copy Run

1

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

3<div id="fastcomments-widget"></div>

4<script>

5window.fcConfigs = [{

6 "tenantId": "demo",

7 "customCSS": "@import url(https://example.com/styles.css);"

8}];

9</script>

10

However, remember that your CSS won't be able to be tested by us if you do this.

User Profile Modal Styling

User profile modals can also be styled with custom CSS. However, to ensure that custom styling is applied to user profiles, all CSS selectors must be prefixed with .user-profile. Without this prefix, custom styling will be ignored for user profile modals.

For example:

User Profile CSS

Copy Run

1

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

3<div id="fastcomments-widget"></div>

4<script>

5window.fcConfigs = [{

6 "tenantId": "demo",

7 "customCSS": ".user-profile .profile-name { color: blue; }"

8}];

9</script>

10

Backwards Compatibility

At FastComments, we know our customers customize the commenting widget. That's by design - the last thing we want is for our product to cause design inconsistencies in your product.

Since this is an important part of our product, we have a build pipeline that allows us to review changes to the comment widget, per-customer, each release.

If we find minor issues, we will update your account to ensure our release goes smoothly. If we see major breaking changes, this allows us to halt the release.

Pro 또는 Enterprise 계정을 보유한 고객에게는 화이트 라벨링이 허용됩니다. 간단히 문의해 주세요 그러면 저희가 기꺼이 도와드리겠습니다.

댓글 위젯에서 저희 로고만 제거하려는 경우, 이는 Flex 및 Pro 요금제에서 자동으로 활성화됩니다.

이 요금제들은 또한 당사 플랫폼에서 발송되는 이메일에 대해서도 동일한 기능을 제공합니다.

초기 페이지 로드 후 다크 모드를 토글할 수 있는 사이트의 경우, 이는 조금 더 복잡합니다.

먼저, Comment 위젯 라이브러리의 현재 모든 버전(React, Vue)은 각 저장소에 다크 모드 토글 예제를 포함하고 있습니다.

VanillaJS 위젯의 경우에는 좀 더 작업이 필요합니다. 먼저, FastCommentsUI는 "destroy"와 "update" 함수를 가진 객체를 반환합니다.

댓글 위젯 구성을 업데이트할 때마다 update 함수를 단순히 호출하면 됩니다. 다음은 VanillaJS 위젯으로 다크 모드를 토글하는 완전한 작동 예제입니다.

다크 모드 토글 전체 예제

Copy Run

1

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

3<button id="toggle-dark-mode">Toggle Dark Mode</button>

4<div id="fastcomments-widget"></div>

5<script>

6 (function() {

7 const button = document.getElementById('toggle-dark-mode');

8 const config = {

9 tenantId: 'demo',

10 hasDarkBackground: false

11 };

12 const instance = window.FastCommentsUI(document.getElementById('fastcomments-widget'), config);

13 button.addEventListener('click', function() {

14 config.hasDarkBackground = !config.hasDarkBackground;

15 if (config.hasDarkBackground) {

16 document.body.classList.add('dark');

17 } else {

18 document.body.classList.remove('dark');

19 }

20 instance.update(config);

21 });

22 })();

23</script>

24<style>

25 body.dark {

26 background: #000;

27 color: #fff;

28 }

29</style>

30

FastComments를 사용하면 댓글 위젯의 모든 텍스트를 사용자 정의할 수 있습니다.

제출 버튼과 같은 단일 텍스트만 덮어쓸 수도 있고, 댓글 위젯 전체의 모든 텍스트를 덮어쓸 수도 있습니다.

기본적으로 댓글 위젯의 텍스트는 사용자의 로케일을 기준으로 번역됩니다. 그러나, 텍스트를 재정의할 수 있습니다, 만약 우리가 확신한다면 우리 사용자층이 동일한 로케일/언어를 사용하고 있다는 것을, 예를 들면:

Custom Text

Copy Run

1

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

3<div id="fastcomments-widget"></div>

4<script>

5window.fcConfigs = [{

6 "tenantId": "demo",

7 "translations": {

8 "SUBMIT_REPLY": "Reply"

9 }

10}];

11</script>

12

모든 사용자 정의 가능한 번역은 여기의 "고급 옵션" 탭에서 확인할 수 있습니다.

그러나 위젯 사용자 정의 UI를 통해 더 쉬운 방법이 있습니다. 거기에서 우리는 댓글 위젯에 EN_US 로케일로 표시되는 텍스트를 찾아 단순히 대체 텍스트를 지정할 수 있습니다.

Custom Text

현재 모든 번역 재정의는 모든 로케일에 적용됩니다.

사용자가 FastComments로 처음 댓글을 작성할 때, 우리는 그들의 아바타를 http://gravatar.com/에서 가져오려고 시도합니다.

그러나 아바타를 찾지 못하거나 사용자가 계정에서 아바타를 설정하지 않은 경우, 정적 기본 아바타 이미지를 렌더링합니다.

자체 정적 아바타 이미지를 지정하려면 defaultAvatarSrc 설정을 사용할 수 있습니다.

Override The Default Avatar

Copy Run

1

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

3<div id="fastcomments-widget"></div>

4<script>

5window.fcConfigs = [{

6 "tenantId": "demo",

7 "defaultAvatarSrc": "https://example.com/some-image.png"

8}];

9</script>

10

이것은 코드 없이도 할 수 있습니다. 위젯 커스터마이제이션 페이지에서 '기본 아바타' 섹션을 참조하세요.

Customizing The Default Avatar

특정 사용자(예: SSO)를 위한 아바타 정의는 별도의 섹션에서 다룹니다.

사용자가 자신만의 아바타를 설정했더라도 댓글 위젯에서 아바타를 완전히 제거할 수 있습니다.

Hiding Avatars

Copy Run

1

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

3<div id="fastcomments-widget"></div>

4<script>

5window.fcConfigs = [{

6 "tenantId": "demo",

7 "hideAvatars": true

8}];

9</script>

10

이 설정은 코드 없이 위젯 맞춤 설정 페이지에서 변경할 수 있습니다:

Hiding Avatars

더 큰 맞춤 스타일링 프로젝트에서는 깨끗한 상태에서 시작하여 기본 스타일을 전혀 사용하지 않는 것이 바람직할 수 있습니다.

모든 기본 스타일은 다음과 같이 noStyles 매개변수를 true로 설정하여 제거할 수 있습니다:

Disabling All Default Styles

Copy Run

1

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

3<div id="fastcomments-widget"></div>

4<script>

5window.fcConfigs = [{

6 "tenantId": "demo",

7 "noStyles": true

8}];

9</script>

10

이 설정은 코드 없이도 위젯 커스터마이즈 페이지의 고급 옵션(Advanced Options)에서 변경할 수 있습니다:

Disabling All Default Styles

기본적으로 최상위 댓글의 답글이 표시됩니다.

사용자가 자식 댓글을 보려면 최상위 댓글에서 '답글 보기'를 클릭해야 하도록 구성할 수 있습니다.

Collapse Replies to Top Level Comments

Copy Run

1

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

3<div id="fastcomments-widget"></div>

4<script>

5window.fcConfigs = [{

6 "tenantId": "demo",

7 "collapseReplies": true

8}];

9</script>

10

이 설정은 코드 없이 위젯 맞춤 설정 페이지에서 변경할 수 있습니다:

Collapse Replies

이 설정은 처음 로드되는 최상위 댓글의 수에는 영향을 주지 않습니다. 예를 들어 최상위 댓글이 1개이고 자식 댓글이 29개인 경우, 이 설정을 켜면:

• 최상위 댓글을 볼 수 있습니다.
• 이 댓글 아래에 '답글 보기 (29)'가 표시됩니다.

이 옵션과 함께 모든 최상위 댓글을 표시하려면 시작 페이지를 -1로 설정하십시오.

기본적으로 FastComments의 서식 기능은 텍스트 주변에 <b></b> 같은 눈에 보이는 앵커 태그를 추가하는 방식으로 이루어집니다. 툴바를 클릭하거나 단축키를 사용하면 이러한 처리가 자동으로 적용됩니다. 그러나 일부 커뮤니티는 앵커 태그 없이 서식을 적용하도록 선택할 수 있습니다. 이를 WYSIWYG(보이는 것이 실제 결과인) 편집기를 활성화한다고 합니다. 이 편집기는 기본 편집기와 외형상 동일하지만, 눈에 보이는 앵커 태그 없이 사용자가 텍스트를 굵게, 밑줄 등으로 꾸밀 수 있도록 추가 코드를 로드합니다.

Enabling WYSIWYG Editing

Copy Run

1

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

3<div id="fastcomments-widget"></div>

4<script>

5window.fcConfigs = [{

6 "tenantId": "demo",

7 "enableWYSIWYG": true

8}];

9</script>

10

이 작업은 코드 없이도 할 수 있습니다. 위젯 맞춤 설정 페이지에서 '고급 서식 사용' 옵션을 확인하세요.

Enable WYSIWYG

기본적으로 FastComments는 댓글을 작성할 때 텍스트 꾸미기 및 업로드 이미지를 위한 단축 버튼을 제공하기 위해 도구 모음을 표시합니다.

이 도구 모음은 코드에서 또는 맞춤 설정 UI를 통해 비활성화할 수 있습니다.

Disabling The Toolbar

Copy Run

1

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

3<div id="fastcomments-widget"></div>

4<script>

5window.fcConfigs = [{

6 "tenantId": "demo",

7 "disableToolbar": true

8}];

9</script>

10

코드를 사용하지 않고도 이 작업을 수행할 수 있습니다. 위젯 맞춤 설정 페이지에서 "답글 도구 모음 비활성화" 옵션을 확인하세요.

Disabling The Toolbar

기본적으로 FastComments는 사용자가 다른 사용자를 차단할 수 있도록 허용합니다. 사용자를 차단하면 해당 사용자의 댓글이 마스킹되고, 사용자들 간의 알림이 차단되는 등 여러 영향이 있습니다.

이 기능을 비활성화하는 것이 바람직할 수 있습니다. 다음과 같이 할 수 있습니다:

Disable Blocking

Copy Run

1

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

3<div id="fastcomments-widget"></div>

4<script>

5window.fcConfigs = [{

6 "tenantId": "demo",

7 "disableBlocking": true

8}];

9</script>

10

이 작업은 코드 없이도 수행할 수 있으며, 이렇게 하면 서버 측 유효성 검사도 적절히 활성화됩니다. 위젯 사용자 지정 UI를 통해 다음과 같이 할 수 있습니다:

Disable Blocking

기본적으로 로컬화된 상대 날짜가 사용됩니다. 예를 들어, 방금 남긴 댓글 옆에는 "11분 전"과 같은 문구가 표시될 수 있습니다.

절대 날짜를 사용해야 하거나 사용하려는 경우가 있을 수 있으며, 이 경우 이 매개변수를 true로 설정합니다.

Use Absolute Dates

Copy Run

1

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

3<div id="fastcomments-widget"></div>

4<script>

5window.fcConfigs = [{

6 "tenantId": "demo",

7 "absoluteDates": true

8}];

9</script>

10

이 설정은 위젯 사용자화 페이지의 고급 옵션에서 코드 없이 사용자화할 수 있습니다:

Use Absolute Dates

기본적으로 지역화된 상대 날짜가 사용됩니다. 예를 들어, 최근에 남긴 댓글 옆에 "11 minutes ago"가 표시될 수 있습니다.

이 상대 날짜 형식을 유지하면서 전체 날짜도 함께 표시해야 할 경우가 있을 수 있으며, 이 경우 이 매개변수를 true로 설정합니다.

Use Both Absolute and Relative Dates

Copy Run

1

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

3<div id="fastcomments-widget"></div>

4<script>

5window.fcConfigs = [{

6 "tenantId": "demo",

7 "absoluteAndRelativeDates": true

8}];

9</script>

10

코드 없이도 위젯 사용자화 페이지의 고급 옵션에서 이 설정을 사용자화할 수 있습니다. UI에서 이 옵션을 보려면 먼저 절대 날짜(Absolute Dates)를 활성화해야 합니다.

Use Both Absolute and Relative Dates

헤더나 메시지와 같은 일부 텍스트는 댓글 수 아래이지만 로그인 상태 텍스트 위에 표시될 수 있습니다.

이를 헤더라고 하며 기본적으로 숨겨져 있습니다.

Specifying Header HTML

Copy Run

1

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

3<div id="fastcomments-widget"></div>

4<script>

5window.fcConfigs = [{

6 "tenantId": "demo",

7 "headerHTML": "<h1>Leave a Comment!</h1>"

8}];

9</script>

10

이 항목은 코드 없이 위젯 사용자화 페이지의 고급 옵션에서 사용자화할 수 있습니다:

Specifying Header HTML

기본적으로 FastComments는 다음과 같이 링크를 렌더링합니다: https://exmaple.com - 여기서 링크 URL은 클릭 가능한 HTML 앵커 태그가 됩니다.

일부 사이트는 예를 들어 사기꾼을 억제하기 위해 이를 비활성화하고 싶을 수 있습니다. 우리는 이를 Comment HTML Rendering Option을 Links as Text로 설정하여 제공합니다.

이 설정은 위젯 사용자화 페이지에서 코드 없이 도메인 전체 또는 개별 페이지에 대해 사용자화할 수 있습니다:

Render Links as Text

By default, FastComments will render the comment input box and comment thread at the same time. To save some vertical space, 세로 공간을 절약하기 위해, it will also hide any other required fields until the widget is interacted with. 위젯과 상호작용할 때까지 다른 필수 필드들도 숨깁니다.

However, the comment widget can be hidden behind a button, for example: 그러나 댓글 위젯은 예를 들어 버튼 뒤에 숨길 수 있습니다:

Click to Show Comments

The button uses different translated text based on whether the comments are currently shown or not. If the comments are hidden, it uses translations.SHOW_COMMENTS_BUTTON_TEXT. If the 버튼은 댓글이 현재 표시되어 있는지 여부에 따라 서로 다른 번역된 텍스트를 사용합니다. 댓글이 숨겨져 있으면 translations.SHOW_COMMENTS_BUTTON_TEXT를 사용합니다. 만약 comments are shown, it uses translations.HIDE_COMMENTS_BUTTON_TEXT. The translations can contain the text [count] which will 댓글이 표시되어 있으면 translations.HIDE_COMMENTS_BUTTON_TEXT를 사용합니다. 번역 문자열은 [count] 텍스트를 포함할 수 있으며 be replaced by the localized count. 이는 지역화된 카운트로 대체됩니다.

Click to Show or Hide Comments

Copy Run

1

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

3<div id="fastcomments-widget"></div>

4<script>

5window.fcConfigs = [{

6 "tenantId": "demo",

7 "useShowCommentsToggle": true

8}];

9</script>

10

This is designed to replace the hideCommentsUnderCountTextFormat configuration. 이 기능은 hideCommentsUnderCountTextFormat 구성 옵션을 대체하도록 설계되었습니다.

The count is updated live with the comment thread. The button is not shown if there are no comments. 카운트는 댓글 스레드와 실시간으로 업데이트됩니다. 댓글이 없으면 버튼은 표시되지 않습니다.

This can be enabled without code by creating a customization rule and enabling "Click to Show Comments": 이 기능은 커스터마이제이션 규칙을 생성하고 "클릭하여 댓글 표시"를 활성화하면 코드 없이 사용 설정할 수 있습니다:

Enable Click to Show Comments

댓글 위젯 상단에 표시되는 댓글 수는 사용자 지정할 수 있습니다.

이 문자열은 임의의 문자열로 바꿀 수 있으며, 값 [count] 은 사용자에 맞게 현지화된 카운트 값으로 대체됩니다.

Customizing The Comment Count Text

Copy Run

1

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

3<div id="fastcomments-widget"></div>

4<script>

5window.fcConfigs = [{

6 "tenantId": "demo",

7 "commentCountFormat": "There are [count] comments."

8}];

9</script>

10

이 설정은 코드 없이 위젯 사용자 지정 페이지에서 변경할 수 있습니다:

Customizing The Comment Count Text

사용자가 #someexampletag 형식으로 해시태그를 입력하면, FastComments는 해당 HashTag를 자동으로 생성하고 댓글에서 강조 표시합니다.

경우에 따라 이 기능을 비활성화하거나 API를 통해 사용할 수 있는 해시태그를 제어하는 것이 바람직할 수 있습니다.

이를 위해 위젯 사용자 지정 UI에서 Disable Automatic #hashtag Creation을 활성화하면 됩니다.

Disabling Automatic HashTag Creation

기본적으로 FastComments는 댓글 영역의 오른쪽 상단에 알림 벨 아이콘을 표시합니다.

이 벨은 빨간색으로 바뀌고 사용자가 가진 알림 수를 표시합니다. 몇 가지 예시 알림은 다음과 같습니다:

• 사용자가 귀하에게 답글을 남겼습니다.
• 사용자가 당신이 댓글을 단 스레드에 답글을 남겼습니다.
• 사용자가 귀하의 댓글에 찬성(업보트)했습니다.
• 사용자가 당신이 구독한 페이지에 답글을 남겼습니다.

알림 벨은 페이지 전체를 구독할 수 있는 기능도 제공합니다.

하지만 알림 벨을 완전히 비활성화할 수 있습니다:

Disable Notification Bell

Copy Run

1

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

3<div id="fastcomments-widget"></div>

4<script>

5window.fcConfigs = [{

6 "tenantId": "demo",

7 "disableNotificationBell": true

8}];

9</script>

10

이것은 코드 없이도 설정할 수 있습니다. 위젯 사용자화 페이지에서 '알림 벨 비활성화' 섹션을 참조하세요.

Disable Notification Bell

기본적으로 FastComments는 사용자의 아바타를 클릭하면 사용자의 프로필을 표시합니다.

그러나 이 기능은 비활성화할 수 있습니다:

Disable Profiles

Copy Run

1

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

3<div id="fastcomments-widget"></div>

4<script>

5window.fcConfigs = [{

6 "tenantId": "demo",

7 "disableProfiles": true

8}];

9</script>

10

이것은 코드 없이도 할 수 있습니다. 위젯 커스터마이징 페이지에서 "프로필 비활성화" 섹션을 확인하세요.

Disable Profiles

기본적으로 FastComments는 사용자 프로필에 "Profile Comments" 탭을 표시하여 방문자가 다른 사람의 프로필에 댓글을 남길 수 있도록 합니다.

하지만 이 탭은 비활성화할 수 있습니다:

Disable Profile Comments

Copy Run

1

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

3<div id="fastcomments-widget"></div>

4<script>

5window.fcConfigs = [{

6 "tenantId": "demo",

7 "disableProfileComments": true

8}];

9</script>

10

이 작업은 코드 없이도 할 수 있습니다. 위젯 맞춤 설정 페이지에서 "Disable Profile Comments" 섹션을 참조하세요.

Disable Profile Comments

기본적으로 FastComments는 사용자 프로필에 "다이렉트 메시지" 탭을 표시하여 방문자가 사용자에게 다이렉트 메시지를 보낼 수 있도록 합니다.

그러나 이 탭을 비활성화할 수 있습니다:

Disable Profile Direct Messages

Copy Run

1

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

3<div id="fastcomments-widget"></div>

4<script>

5window.fcConfigs = [{

6 "tenantId": "demo",

7 "disableProfileDirectMessages": true

8}];

9</script>

10

이 작업은 코드 없이도 수행할 수 있습니다. 위젯 맞춤 설정 페이지에서 "다이렉트 메시지 비활성화" 섹션을 확인하세요.

Disable Profile Direct Messages

기본적으로 FastComments는 댓글 작성 후 성공 메시지를 표시합니다. 다음과 같이 이 기능을 비활성화할 수 있습니다:

Disable Success Message

Copy Run

1

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

3<div id="fastcomments-widget"></div>

4<script>

5window.fcConfigs = [{

6 "tenantId": "demo",

7 "disableSuccessMessage": true

8}];

9</script>

10

코드를 사용하지 않고도 이 작업을 수행할 수 있습니다. 위젯 사용자 지정 페이지에서:

Disable Success Message

기본적으로 FastComments 댓글 위젯은 gif rating을 pg로 설정합니다.

사용 가능한 옵션은 g, pg, pg-13, 및 r입니다.

이 설정은 코드에서 또는 UI를 통해 설정할 수 있습니다. 코드에서는 다음과 같이 할 수 있습니다:

Set Gif Rating

Copy Run

1

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

3<div id="fastcomments-widget"></div>

4<script>

5window.fcConfigs = [{

6 "tenantId": "demo",

7 "gifRating": "pg-13"

8}];

9</script>

10

UI에서는 Disable Image Uploads?가 체크되어 있지 않은 한 Gif Picker Rating에서 이것을 찾을 수 있습니다.

Setting The Gif Rating

기본적으로 FastComments 댓글 위젯의 이미지 콘텐츠 모더레이션은 off로 설정되어 있습니다.

사용 가능한 옵션은 off, low, medium, 및 high입니다.

위젯 사용자 지정 UI에서 Disable Image Uploads?가 선택되어 있지 않은 한, 이 설정은 Image Content Moderation Level 아래에 있습니다.

Setting The Image Content Moderation Level

기본적으로 FastComments는 투표 옵션을 위/아래 화살표로 렌더링하여 사용자가 댓글에 찬성 또는 반대 투표를 할 수 있게 합니다.

하지만 투표 도구 모음의 스타일을 변경할 수 있습니다. 현재 옵션은 기본 위/아래 버튼 또는 하트 스타일 투표 방식입니다.

다음과 같이 voteStyle 플래그를 사용합니다:

Enable Heart Button

Copy Run

1

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

3<div id="fastcomments-widget"></div>

4<script>

5window.fcConfigs = [{

6 "tenantId": "demo",

7 "voteStyle": 1

8}];

9</script>

10

이 작업은 서버 측 검증도 활성화되므로 코드 없이 수행할 것을 강력히 권장합니다. 위젯 사용자화 페이지의 "투표 스타일" 섹션을 참조하세요.

Change Voting Style

투표는 비활성화할 수도 있습니다. 스타일 옵션 위의 Disable Voting을 참조하세요.

기본적으로 FastComments는 사용자가 자신의 댓글을 삭제할 수 있도록 허용합니다.

하지만 이를 방지할 수 있습니다.

위젯 맞춤 설정 페이지에서 '삭제 비활성화' 옵션을 확인하세요.

Disable Comment Deleting

• 이것은 일반 댓글 작성자에게만 영향을 미치며, 중재자나 관리자들은 여전히 삭제할 수 있습니다.
• 이것은 contextUserId가 전달되는 경우 API 통합에도 영향을 미칩니다.

기본적으로 FastComments는 사용자가 자신의 댓글을 수정할 수 있도록 허용합니다.

그러나 이를 방지할 수 있습니다.

위젯 맞춤 설정 페이지에서 "편집 비활성화" 옵션을 확인하세요.

Disable Comment Editing

• 이 설정은 일반 댓글 작성자에게만 영향을 미치며, 중재자(moderators)나 관리자(admins)는 여전히 댓글을 수정할 수 있습니다.
• 이 설정은 contextUserId가 전달되는 경우의 API 통합에도 영향을 미칩니다.

기본적으로 FastComments의 페이지 크기는 30입니다. 여기에는 스레드 내 답글도 포함됩니다.

페이지 크기는 위젯 구성 UI에서 10부터 200까지 다양한 크기로 사용자 지정할 수 있습니다.

페이지 크기를 변경하면 계정의 모든 댓글 스레드를 재계산해야 합니다. 이 작업은 몇 분 정도 걸릴 수 있습니다.

페이지는 서버 측에서 계산되므로 클라이언트 측 위젯에서 구성할 수 없습니다.

예시 구성은 아래에 표시됩니다:

Custom Page Sizes

페이지 크기는 전역, 도메인별, 페이지별로 서로 다른 사용자 지정 규칙을 만들어 설정할 수 있습니다.

이는 플랫폼을 통해 댓글을 표시하는 데 사용하는 모든 클라이언트, 통합 및 프레임워크에 영향을 미칩니다.

기본적으로 FastComments는 사용자가 입력한 이름 또는 SSO를 통해 전달된 이름을 표시합니다.

그러나 사용자의 이름을 마스킹하거나 다르게 표시하는 것이 바람직할 수 있습니다. 예를 들어 사용자의 이름이 Allen Rex라면 "Allen R."만 표시하고 싶을 수 있습니다.

이것은 코드 없이 위젯 사용자화 UI에서 Commenter Name Format이라는 설정으로 수행할 수 있습니다:

Change Name Format

사용 가능한 형식은 다음과 같습니다:

• Capitalize (예시 사용자명을 Example User로 표시)
• Last Initial (예시 사용자명을 Example U.로 표시)
• All Initials (예시 사용자명을 E. U.로 표시)
• Show "Anonymous"

이 설정 변경의 효과는 즉시 반영됩니다. 사용자는 자신에게는 코멘트 영역 상단에 전체 사용자 이름이 그대로 보이지만, 그들이 올린 코멘트에는 수정된 사용자 이름이 표시됩니다.

사용자 이름은 사용자를 보호하기 위해 서버 측에서 마스킹됩니다.

기본적으로 FastComments는 이미지 업로드를 허용합니다. 이는 noImageUploads 플래그를 true로 설정하여 비활성화할 수 있습니다.

Disabling Image Uploads

Copy Run

1

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

3<div id="fastcomments-widget"></div>

4<script>

5window.fcConfigs = [{

6 "tenantId": "demo",

7 "noImageUploads": true

8}];

9</script>

10

이 설정은 코드 없이 위젯 사용자화 페이지에서 맞춤 설정할 수 있습니다:

Disabling Image Uploads

기본적으로 댓글 위젯에는 검색 상자가 표시되지 않습니다.

하지만 enableSearch 플래그를 true로 설정하여 이를 활성화할 수 있습니다:

Enabling Search

Copy Run

1

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

3<div id="fastcomments-widget"></div>

4<script>

5window.fcConfigs = [{

6 "tenantId": "demo",

7 "enableSearch": true

8}];

9</script>

10

이 작업은 코드 없이도 할 수 있습니다. 위젯 사용자 지정 페이지에서 "검색 상자 활성화" 옵션을 확인하세요.

Enable Search Box

스포일러 지원은 enableSpoilers 플래그를 true로 설정하여 활성화할 수 있습니다:

Enabling Spoilers

Copy Run

1

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

3<div id="fastcomments-widget"></div>

4<script>

5window.fcConfigs = [{

6 "tenantId": "demo",

7 "enableSpoilers": true

8}];

9</script>

10

이 작업은 코드 없이도 할 수 있습니다. 위젯 사용자 지정 페이지에서 "Enable Spoilers" 옵션을 확인하세요.

Enable Spoilers

텍스트를 강조 표시한 후 표시된 SPOILER 버튼을 클릭하면, 사용자가 마우스를 올릴 때까지 텍스트가 가려집니다. 다크 모드에서는 동일한 동작을 수행하지만 다크 모드에 더 어울리는 다른 색상을 사용합니다.

이는 WYSIWYG 편집기와도 호환됩니다.

기본적으로 FastComments는 각 댓글을 누가 보았는지 추적하거나 이에 대한 통계를 제공하지 않습니다.

하지만 이 기능을 활성화하면 사용자가 댓글로 스크롤할 때 시스템이 이를 추적하기 시작합니다.

이렇게 되면 각 댓글에 표시된 눈 아이콘 옆의 카운트가 증가합니다. 카운트는 실시간으로 업데이트되며 사용자의 로케일에 따라 축약되어 표시됩니다.

다음과 같이 enableViewCounts 플래그를 true로 설정하여 이 기능을 활성화할 수 있습니다:

Enabling Comment View Counts

Copy Run

1

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

3<div id="fastcomments-widget"></div>

4<script>

5window.fcConfigs = [{

6 "tenantId": "demo",

7 "enableViewCounts": true

8}];

9</script>

10

이 설정은 위젯 맞춤화 페이지에서 코드 없이도 사용자화할 수 있습니다:

Enabling Comment View Counts

We track the user id* that viewed the comment, so that if you view the comment again it does not increment. If you view the comment again after two years, the count will increment more.

• *Note: or the anon session id, or the user's IP as a hashed value.

기본적으로 라이브 댓글 기능이 활성화되어 있습니다. 즉, 댓글이 추가, 삭제, 수정되거나 고정되면 해당 변경 사항이 댓글 스레드를 보고 있는 모든 사용자에게 동시에 표시됩니다.

그러나 기본적으로 새 댓글은 "새 댓글 2개 보기"와 유사한 텍스트를 가진 동적으로 표시되는 버튼 아래에 나타납니다.

If the new comments are replies directly to the page, the button will show at the top of the comment thread. If they are replies to a particular comment, the button will show under that comment.

이는 사용자가 스크롤바를 잡으려 할 때 페이지 크기가 계속 변경되어 좌절감을 줄 수 있는 상황을 방지하기 위한 것입니다.

For some use cases, like live bidding, or online events, this is not the desired behavior - you may want the commenting widget to be more like a "채팅" 상자 where new comments "즉시 표시".

Hence, the name of the flag that enables that feature: showLiveRightAway.

We can turn it on as follows:

Show Live Comments Right Away

Copy Run

1

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

3<div id="fastcomments-widget"></div>

4<script>

5window.fcConfigs = [{

6 "tenantId": "demo",

7 "showLiveRightAway": true

8}];

9</script>

10

This can be customized without code, on the widget customization page:

Show Live Comments Right Away

기본적으로 FastComments는 실시간 댓글 기능이 활성화되어 있습니다.

즉, 댓글 스레드를 보는 모든 사용자는 동일한 내용을 보게 됩니다.

예를 들어, 댓글이 추가되면 해당 댓글이 표시됩니다. 댓글이 수정되거나 삭제되면, 그 댓글들은 스레드를 보는 모든 사용자에게도 수정되거나 삭제됩니다. 투표 및 모든 모더레이션 작업도 마찬가지입니다.

하지만, 이를 비활성화할 수 있습니다:

Disable Live Commenting

Copy Run

1

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

3<div id="fastcomments-widget"></div>

4<script>

5window.fcConfigs = [{

6 "tenantId": "demo",

7 "disableLiveCommenting": true

8}];

9</script>

10

코드를 사용하지 않고도 이 작업을 할 수 있습니다. 위젯 맞춤설정 페이지에서 "실시간 댓글 비활성화" 섹션을 확인하세요.

Disable Live Commenting

기본적으로 FastComments는 댓글을 "가장 관련성 높은" 정렬 방향으로 정렬합니다.

가장 관련성 높은 정렬은 댓글이 남겨진 시간과 추천 수를 정렬에 반영합니다.

사용자는 댓글 위젯 UI에서 정렬 방향을 '가장 오래된' 또는 '최신 순'으로 변경할 수 있습니다.

하지만 기본값은 세 가지 중 어떤 것으로든 변경할 수 있습니다. 예를 들어 가장 오래된 댓글을 먼저 표시하려면:

Changing The Default Sort To Oldest First

Copy Run

1

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

3<div id="fastcomments-widget"></div>

4<script>

5window.fcConfigs = [{

6 "tenantId": "demo",

7 "defaultSortDirection": "OF"

8}];

9</script>

10

defaultSortDirection의 값을 "OF"로 설정하여 정렬 방향을 "OF"로 설정합니다.

최신 순 정렬 방향의 경우에는 다음과 같이 합니다:

Changing The Default Sort To Newest First

Copy Run

1

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

3<div id="fastcomments-widget"></div>

4<script>

5window.fcConfigs = [{

6 "tenantId": "demo",

7 "defaultSortDirection": "NF"

8}];

9</script>

10

defaultSortDirection의 유효한 값은 다음과 같습니다:

• MR: "가장 최근"
• NF: "최신 순"
• OF: "가장 오래된 순"

이 작업은 코드 없이도 할 수 있습니다. 위젯 맞춤 설정 페이지에서 '기본 정렬 방향' 섹션을 참조하세요.

Changing The Default Sort Direction

참고로, 각 페이지의 댓글은 각 정렬 방향에 대해 미리 계산되어 있으므로 모든 정렬 방향에서 성능은 동일합니다.

기본적으로 댓글 입력 영역은 댓글 스레드의 앞에 있습니다. 그러나 이 구성 매개변수를 true로 설정하면 이를 뒤로 이동할 수 있습니다.

Moving The Reply Box to The Bottom

Copy Run

1

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

3<div id="fastcomments-widget"></div>

4<script>

5window.fcConfigs = [{

6 "tenantId": "demo",

7 "inputAfterComments": true

8}];

9</script>

10

이것은 코드 없이 위젯 사용자 지정 페이지에서 맞춤 설정할 수 있습니다:

Moving The Reply Box to The Bottom

댓글 입력 필드에 입력할 수 있는 최대 문자 수는 maxCommentCharacterLength 매개변수로 제한할 수 있습니다.

기본값은 2000입니다.

이미지 URL과 같은 항목은 길이 계산에 포함되지 않습니다.

Limit Comment Length

Copy Run

1

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

3<div id="fastcomments-widget"></div>

4<script>

5window.fcConfigs = [{

6 "tenantId": "demo",

7 "maxCommentCharacterLength": 500

8}];

9</script>

10

이 설정은 위젯 맞춤 설정 페이지에서 코드 없이 사용자화할 수 있습니다:

Limit Comment Length

기본적으로 FastComments는 사용자가 기본 문자 수 제한 내에서 원하는 만큼 여러 줄로 댓글을 입력할 수 있도록 허용합니다.

그러나 사용자가 한 줄의 텍스트만 입력하도록 제한해야 할 경우가 있습니다. 예시 사용 사례로는 온라인 입찰이나 실시간 채팅이 있으며, FastComments 는 이러한 용도로 사용될 수 있습니다.

다음과 같이 useSingleLineCommentInput 플래그를 활성화합니다:

Enable Single-Line Comment Input

Copy Run

1

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

3<div id="fastcomments-widget"></div>

4<script>

5window.fcConfigs = [{

6 "tenantId": "demo",

7 "useSingleLineCommentInput": true

8}];

9</script>

10

이 작업은 코드 없이도 수행할 수 있습니다. 위젯 사용자화 페이지에서 "Enable Single-Line Comment Input" 섹션을 참조하세요.

Enable Single-Line Comment Input

참고로, 각 페이지에 대한 댓글은 각 정렬 방향별로 미리 계산되므로 모든 정렬 방향이 동일한 성능을 보입니다.

기본적으로 각 사용자는 동일한 1분 동안 최대 5 comments를 제출할 수 있습니다.

이것은 user id, anon user id, and ip address (hashed)로 추적됩니다.

이는 코드 없이 위젯 맞춤 설정 페이지에서 사용자화할 수 있습니다:

Limiting Comment Volume Per User

참고로 comment creation API를 사용 중인 경우, 요청에 사용자의 원래 ip 주소를 당사 백엔드로 전달하는 것이 좋습니다. 이렇게 하면 속도 제한이 적용 사용자별로 적용되고 귀하의 계정에 전역적으로 적용되지 않습니다.

FastComments는 처음 댓글을 다는 사용자가 댓글을 제출하기 전에 이용 약관에 동의하도록 요구할 수 있게 합니다.

활성화하면:

• 익명 사용자는 댓글을 달 때마다 이용 약관 체크박스를 보게 됩니다
• 인증된 사용자는 첫 댓글에서만, 또는 이용 약관을 업데이트할 때 체크박스를 보게 됩니다

설정

위젯 사용자 지정 페이지로 이동하여 "이용 약관 동의 필요" 체크박스를 활성화하세요. 활성화하면 다음 옵션을 보게 됩니다:

이용 약관 옵션

• 이용 약관 텍스트 모드: 기본적으로 체크박스는 "이용 약관 및 개인정보처리방침에 동의합니다"라는 문구를 두 문서에 대한 링크와 함께 표시합니다. "언어별 텍스트 맞춤"을 선택하면 각 언어에 대해 자체 문구를 제공할 수 있습니다.
• 이용 약관 최종 업데이트 날짜: 이용 약관을 업데이트할 때 이 날짜를 설정하세요. 이 날짜 이전에 동의한 사용자는 다시 동의해야 합니다.

작동 방식

• 이용 약관 동의 타임스탬프는 사용자별 및 댓글별로 저장됩니다
• 사용자가 이용 약관에 동의하면 해당 날짜가 사용자 프로필(테넌트별)에 기록됩니다
• 만약 "최종 업데이트" 날짜가 사용자의 동의 날짜보다 이후라면, 사용자는 다시 동의해야 합니다
• 추적할 수 없는 익명 사용자의 경우, 체크박스는 모든 댓글 제출 시마다 나타납니다

FastComments Secure SSO는 SSO를 구현하는 메커니즘으로 HMAC-SHA256 암호화를 사용합니다. 먼저 전체 아키텍처를 살펴보고 예제와 상세 단계를 제공합니다.

유사한 SSO 메커니즘을 사용하는 다른 제공업체에서 마이그레이션하는 방법 및 차이점에 관한 문서도 있습니다.

The flow looks like this:

Secure SSO Flow

Secure SSO는 풀스택 개발을 포함하므로 Java/Spring, NodeJS/Express, 그리고 순수 PHP의 전체 동작 코드 예제가 현재 on GitHub.

NodeJS 예제에서는 ExpressJS를, Java 예제에서는 Spring을 사용했지만 FastComments SSO를 구현하는 데 이 런타임에서 특정 프레임워크나 라이브러리가 필요하지 않습니다 - 네이티브 암호화 패키지로 충분합니다.

FastComments SSO로 새로운 API 엔드포인트를 작성할 필요가 없습니다. 단순히 비밀 키로 사용자의 정보를 암호화하고 페이로드를 댓글 위젯에 전달하면 됩니다.

API 시크릿 키 받기

Your API Secret can be retrieved from this page. 이 페이지는 내 계정(My Account)에서 API/SSO 타일을 클릭한 다음 "API 시크릿 키 받기"를 클릭해서도 찾을 수 있습니다.

댓글 위젯 매개변수

댓글 위젯에 대한 상위 수준 API 문서는 here에서 찾을 수 있습니다.

이제 이 매개변수들이 무엇을 의미하는지 자세히 살펴보겠습니다.

댓글 위젯은 구성 객체를 사용합니다 - FastComments를 사용하여 고객 id(tenantId)를 전달하고 있다면 이미 이 객체를 전달하고 있는 것입니다.

SSO를 활성화하려면 새로운 "sso" 객체를 전달하세요. 이 객체는 다음 매개변수를 포함해야 합니다. 값들은 서버 측에서 생성되어야 합니다.

• userDataJSONBase64: 사용자의 데이터(JSON 형식)를 Base64로 인코딩한 값.
• verificationHash: UNIX_TIME_MILLIS + userDataJSONBase64로 생성된 HMAC-SHA256 해시.
• timestamp: Epoch 타임스탬프, 밀리초 단위. 미래여서는 안 되며, 과거 2일을 초과해서는 안 됩니다.
• loginURL: 댓글 위젯이 사용자 로그인을 위해 표시할 수 있는 URL.
• logoutURL: 댓글 위젯이 사용자 로그아웃을 위해 표시할 수 있는 URL.
• loginCallback: 로그인 URL 대신 제공될 경우, 댓글 위젯이 로그인 버튼을 클릭할 때 호출할 함수.
• logoutCallback: 로그아웃 URL 대신 제공될 경우, 댓글 위젯이 로그아웃 버튼을 클릭할 때 호출할 함수.

Secure SSO Client Code

Copy

1

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

3<div id="fastcomments-widget"></div>

4<script>

5window.fcConfigs = [{

6 "tenantId": "demo",

7 "sso": {

8 "userDataJSONBase64": "...",

9 "verificationHash": "...",

10 "timestamp": 1779941492454.0,

11 "loginURL": "https://example.com/login",

12 "logoutURL": "https://example.com/logout",

13 "loginCallback": null,

14 "logoutCallback": null

15 }

16}];

17</script>

18

사용자 객체

사용자 객체

Copy

1

2interface SSOUser {

3 /** 필수. 최대 1k자. **/

4 id: string;

5 /** 필수. 최대 1k자. 참고: 고유해야 합니다. **/

6 email: string;

7 /** 필수. 최대 1k자. 참고: 사용자 이름은 이메일일 수 없습니다. 반드시 고유할 필요는 없습니다. **/

8 username: string;

9 /** 선택사항. URL의 경우 최대 3k자. 기본값은 이메일 기반의 gravatar입니다. 64로 인코딩된 이미지를 지원하며, 이 경우 제한은 50k자입니다. **/

10 avatar?: string;

11 /** 선택사항. 기본값 false. **/

12 optedInNotifications?: boolean;

13 /** 선택사항. 기본값 false. **/

14 optedInSubscriptionNotifications?: boolean;

15 /** 선택사항. 최대 100자. 이 라벨은 이름 옆에 표시됩니다. 해당되는 경우 기본값은 관리자/모더레이터입니다. **/

16 displayLabel?: string;

17 /** 선택사항. 최대 500자. 사용자 이름 대신 표시됩니다. **/

18 displayName?: string;

19 /** 선택사항. 최대 2k자. 사용자의 이름이 이 링크로 연결됩니다. **/

20 websiteUrl?: string;

21 /** 선택사항. 사용자당 최대 100개 그룹. 그룹 id는 50자 이하이어야 합니다. **/

22 groupIds?: string[];

23 /** 선택사항. 사용자를 관리자임을 표시합니다. **/

24 isAdmin?: boolean;

25 /** 선택사항. 사용자를 모더레이터임을 표시합니다. **/

26 isModerator?: boolean;

27 /** 선택사항, 기본값 true. false로 설정하면 사용자 프로필의 "activity" 탭을 활성화합니다. **/

28 isProfileActivityPrivate?: boolean;

29 /** 선택사항, 기본값 false. true로 설정하면 프로필 댓글을 비활성화합니다. **/

30 isProfileCommentsPrivate?: boolean;

31 /** 선택사항, 기본값 false. true로 설정하면 이 사용자에게 다이렉트 메시지 전송을 비활성화합니다. **/

32 isProfileDMDisabled?: boolean;

33 /** 사용자 배지에 대한 선택 구성. **/

34 badgeConfig?: {

35 /** 할당할 전역 배지 ID 배열. 최대 30개 배지로 제한됩니다. 순서가 유지됩니다. **/

36 badgeIds: string[];

37 /** 현재 페이지(urlId)에 범위가 지정된 배지 ID 배열. 지정된 페이지에서만 표시됩니다. **/

38 pageBadgeIds?: string[];

39 /** true이면 기존에 표시된 배지를 교체합니다. 전역 및 페이지 범위 배지는 독립적으로 덮어써집니다. **/

40 override?: boolean;

41 /** true이면 테넌트 구성에서 배지 표시 속성을 업데이트합니다. **/

42 update?: boolean;

43 };

44}

45

Moderators and Administrators

관리자 및 모더레이터의 경우, SSOUser 객체에 각각 isAdmin 또는 isModerator 플래그를 전달하세요.

알림

알림을 활성화하거나 비활성화하려면 optedInNotifications 값을 각각 true 또는 false로 설정하세요. 사용자가 이 값이 포함된 SSO 페이로드로 페이지를 처음 로드하면 알림 설정이 업데이트됩니다.

또한, 사용자가 구독한 페이지에서의 활동에 대해 (인앱 알림뿐만 아니라) 이메일 알림을 받게 하려면 optedInSubscriptionNotifications를 true로 설정하세요.

VIP 사용자 및 특수 라벨

선택적 "displayLabel" 필드를 사용하여 사용자 이름 옆에 특수 라벨을 표시할 수 있습니다.

인증되지 않은 사용자

인증되지 않은 사용자를 나타내려면 userDataJSONBase64, verificationHash, 또는 timestamp를 채우지 마세요. loginURL을 제공하세요.

이 사용자들은 댓글을 달 수 없으며, 대신 로그인 메시지(구성에 따라 메시지, 링크 또는 버튼)가 표시됩니다.

사용자 데이터 직렬화 및 해싱에 대한 직접 예제

자세한 예제는 여기 (js), 여기 (java) 및 여기 (php)를 참조하세요.

어떤 통합 작업도 복잡하고 어려울 수 있다는 것을 이해합니다. 담당자에게 문의하거나 support page를 이용하는 것을 주저하지 마세요.

FastComments SSO (자세한 내용)는 사용자가 다른 플랫폼에 로그인하지 않고도 댓글을 남길 수 있는 방법을 제공합니다.

그러나 이 설정만으로는 댓글 스레드가 안전해지지 않습니다. 기본적으로 댓글 데이터는 공개 정보이므로 페이지를 볼 수 있는 누구나 댓글을 볼 수 있습니다.

설정을 변경하면 관리자나 유효한 SSO 사용자에 의해서만 댓글을 가져오도록 제한할 수 있습니다.

코드 없는 설정

SSO가 설정된 경우, 댓글 스레드의 보기 및 상호작용을 방지하려면 사용자 지정 규칙을 생성하면 됩니다.

해당 작업을 수행할 때 SSO를 검색하면 다음 옵션을 찾을 수 있습니다:

Require SSO To View Comments

해당 옵션을 활성화하고 사용자 지정 규칙을 저장하세요.

특정 도메인 또는 페이지만 보호하기

특정 도메인 또는 페이지만 보호하려면 사용자 지정 규칙을 간단히 구성하면 됩니다.

사용자 지정 UI 상단에서 두 입력 필드, Domain 및 URL ID를 찾을 수 있습니다.

특정 도메인만 보호하려면 해당 도메인을 "domain" 필드에 입력하세요.

특정 페이지를 보호하려면 페이지 URL을 "URL ID" 필드에 입력하세요. FastComments와의 사용자 지정 통합이 있는 경우 URL 대신 여기에서 ID 유형을 입력할 수 있습니다.

보안 수준

SSO를 요구할 때 Simple SSO 또는 Secure SSO 중 어느 것을 요구할지 결정해야 합니다. Simple SSO를 요구하면 둘 다 허용되지만, Secure SSO를 요구하면 해당 콘텐츠는 보기 위해 API key로 해시된 Secure SSO 페이로드로 가져와야 합니다.

보안 수준 옵션은 "Require SSO To View Comments"를 선택하면 표시됩니다.

읽기 이상의 보호

이 옵션을 활성화하면 사용자가 SSO로 로그인하지 않은 경우 해당 페이지나 도메인에 댓글을 달 수 없도록 보호합니다.

주의사항

SSO 통합 이전에 댓글을 작성한 사용자는 SSO 통합을 통해 로그인하지 않는 한 그 댓글을 볼 수 없습니다.

기본적으로 FastComments는 댓글 작성 시 이메일을 요구합니다. 유효한 이메일일 필요는 없지만, 사용자가 그들에게 전송된 링크를 클릭할 때까지, 그들의 댓글에는 "확인되지 않은 댓글" 라벨이 표시됩니다.

하지만 이메일 요구 사항을 제거할 수 있습니다. 이메일 입력란은 계속 표시되지만 더 이상 필수 항목은 아닙니다.

이 설정은 위젯 사용자 지정 UI를 통해 구성할 수 있습니다:

Enabling Anonymous Comments

FastComments는 원하는 일수 후에 인증되지 않은 댓글을 삭제하도록 구성할 수 있습니다. 이는 스팸 방지에 도움이 됩니다.

기본적으로는 삭제되지 않습니다.

이는 중재 설정 페이지에서 구성하거나 비활성화할 수 있습니다.

Moderation Settings

사용자가 댓글을 달 때 로그인되어 있지 않으면 이메일을 제공하라는 요청을 받습니다.

이렇게 하면 해당 사용자에 대해 "확인되지 않은 세션"이 생성되며, 이메일을 통해 해당 세션을 확인하도록 요청합니다.

일부 사이트나 애플리케이션에서는 댓글을 달거나 투표할 때 사용자에게 이메일을 요청하지 않는 것이 바람직할 수 있습니다.

익명 댓글 쓰기를 활성화하면 이메일 입력 필드가 선택 사항이 됩니다. 그러나 완전히 비활성화할 수도 있습니다. 먼저 익명 댓글 쓰기를 활성화하면 이메일 입력 필드를 비활성화하는 옵션이 나타납니다.

Disable Email Inputs

이 설정을 켜면 이메일 필드는 모든 댓글 제품에서 전혀 표시되지 않습니다.

참고: 이 구성에서는 사용자가 계정을 생성하고 https://fastcomments.com에 로그인하지 않는 한 모든 댓글이 확인되지 않은 상태가 됩니다.

다음 항목을 고려할 수 있습니다: 미확인 라벨 비활성화.

기본적으로 FastComments는 확인되지 않은 브라우저 세션을 가진 사용자에게 남겨진 댓글에 대해 "Unverified Comment" 라벨을 표시합니다. 확인되지 않은 댓글 작성에 대해 자세히 알아보려면 여기를 참조하세요.

Disable The Unverified Label

Copy Run

1

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

3<div id="fastcomments-widget"></div>

4<script>

5window.fcConfigs = [{

6 "tenantId": "demo",

7 "disableUnverifiedLabel": true

8}];

9</script>

10

또한, 이 기능은 코드를 작성하지 않고 Customization UI에서 사용할 수 있습니다:

Disable The Unverified Label

사용자가 댓글에 투표하려고 할 때 로그인되어 있지 않으면 사용자 이름과 이메일을 제공하라는 요청을 받습니다.

이 요구사항을 제거하면 누구나 정보를 남기지 않고 댓글에 투표할 수 있습니다.

Allow Anonymous Votes

사용자가 댓글을 남기거나 투표할 때 로그인되어 있지 않은 경우 이메일과 사용자 이름을 입력하라는 요청을 받습니다.

익명으로 댓글을 작성하는 경우, 때로는 댓글을 작성할 때의 마찰을 줄이기 위해 기본 사용자 이름을 정의하는 것이 바람직할 수 있습니다. 이는 맞춤 설정 UI에서 할 수 있습니다. 먼저 익명 댓글 기능을 활성화해야 합니다.

Setting The Default Username

기본적으로 FastComments는 사용자의 시스템 및 브라우저에서 결정된 로케일에 따라 댓글 위젯을 렌더링합니다.

사용자가 댓글을 작성하거나 로그인하면, 저희는 사용자가 마지막으로 사용한 로케일을 업데이트하고 이메일 전송 시에도 이를 사용합니다.

이는 댓글 위젯이 사용자에게 어떻게 번역되어 표시되는지에 영향을 줍니다. 로케일은 사용자의 언어와 지역으로 구성되므로, 로케일을 구성하면 일반적으로 사용자에게 표시되는 텍스트의 언어가 변경됩니다.

Via The UI

위젯 커스터마이징 UI에서 이 값을 정의할 수 있습니다. "Locale / Language" 옵션을 참조하세요:

Changing The Locale / Language

Via Code

원하는 로케일로 이를 재정의할 수 있습니다.

Manually Defining the User's Locale

Copy Run

1

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

3<div id="fastcomments-widget"></div>

4<script>

5window.fcConfigs = [{

6 "tenantId": "demo",

7 "locale": "ru_ru"

8}];

9</script>

10

지원되는 언어 및 로케일 코드

지원되는 언어와 해당 로케일 코드의 전체 목록은 여기에서 확인할 수 있습니다.

SSO 참고

SSO를 사용하는 경우, 이메일 등 다른 항목들이 사용자에게 올바르게 현지화되도록 user 객체에 사용자의 locale을 전달하는 것이 좋습니다.

기본적으로 FastComments는 댓글 작성에 사용하는 언어를 제한하지 않습니다.

커뮤니티에서 사용하는 언어를 제한하는 것이 바람직할 수 있습니다.

이 설정은 위젯 맞춤 설정 페이지에서 코드 없이 구성할 수 있습니다:

Allowed Languages

시스템은 댓글을 분석하여 언어를 식별한 후 허용된 목록과 대조합니다.

댓글이 허용되지 않은 언어로 작성된 경우, 해당 언어로 된 오류 메시지가 표시됩니다.

readonly 플래그를 true로 설정하면 새 댓글이나 투표를 남길 수 없도록 댓글 달기를 잠글 수 있습니다.

댓글도 편집하거나 삭제할 수 없습니다.

Making The Comment Thread Readonly

Copy Run

1

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

3<div id="fastcomments-widget"></div>

4<script>

5window.fcConfigs = [{

6 "tenantId": "demo",

7 "readonly": true

8}];

9</script>

10

코드를 사용하지 않고도 위젯 맞춤 설정 페이지에서 도메인 전체 또는 페이지별로 이 설정을 변경할 수 있습니다:

Making The Comment Thread Readonly

업데이트!

2022년 11월부터는 관리자가 답글 입력란 위의 점 3개 메뉴를 통해 스레드를 라이브로 잠그거나 잠금을 해제할 수 있습니다.

이렇게 하면 새 댓글은 차단되지만 투표는 계속 허용되고 사용자가 원할 경우 자신의 댓글을 삭제할 수도 있습니다. 반면 readonly는 이러한 것들을 허용하지 않습니다.

이것은 Page API의 isClosed 필드에 해당합니다.

기본적으로 FastComments는 모든 외부 사이트로의 링크를 허용합니다.

This can be restricted to instead a desired list of sites, or domains. Attempting to post a link to a site, or domain, 정의된 목록에 없는 사이트나 도메인으로 링크를 게시하려고 하면 사용자에게 오류가 표시됩니다.

이 검증은 댓글 위젯과 API에만 적용됩니다. 임포트에는 영향을 주지 않습니다.

이 설정은 코드 없이 위젯 사용자화 페이지에서 수행됩니다:

Restrict External Link Domains

기본적으로 FastComments는 사용자에게 댓글 내용, 사용자 이름, 그리고 이메일만 요청합니다.

하지만 경우에 따라 사용자가 자신의 블로그나 웹사이트 링크를 남기도록 하고 싶을 수 있습니다.

사용자의 웹사이트 URL을 입력할 수 있는 추가 입력 필드를 표시하려면 enableCommenterLinks 플래그를 true로 설정하면 됩니다:

Enabling Commenter Links

Copy Run

1

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

3<div id="fastcomments-widget"></div>

4<script>

5window.fcConfigs = [{

6 "tenantId": "demo",

7 "enableCommenterLinks": true

8}];

9</script>

10

해당 URL이 제공되면 사용자의 계정이 업데이트되고 과거 및 향후 모든 댓글에서 해당 사용자의 이름은 이 URL로 링크됩니다.

이 설정은 위젯 커스터마이즈 페이지에서 코드 없이도 변경할 수 있습니다:

Enabling Commenter Links

이 목록은 모더레이션 그룹 페이지에서 생성된 ID들의 목록입니다.

지정하면, 해당 설정을 사용하여 남긴 댓글에는 동일한 moderationGroupIds 세트가 포함됩니다.

만약 Moderator가 하나 이상의 모더레이션 그룹 을 정의해 둔 경우, 그들은 자신의 그룹과 연관된 댓글만 Moderate Comments 페이지에서 보게 됩니다.

Specify Moderation Groups

Copy Run

1

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

3<div id="fastcomments-widget"></div>

4<script>

5window.fcConfigs = [{

6 "tenantId": "demo",

7 "moderationGroupIds": [

8 "mxZAhjzdb",

9 "FT19nXbqA"

10 ]

11}];

12</script>

13

인증을 위해 FastComments는 브라우저에서 타사 쿠키가 활성화되어 있어야 합니다. 쿠키가 없으면(이메일 입력 필드가 숨겨져 있지 않은 한) 사용자는 항상 댓글을 남길 때 이메일을 입력해야 하며, 댓글은 기본적으로 항상 검증되지 않은 상태로 표시됩니다.

이를 우회하려면 타사 쿠키 우회를 활성화할 수 있습니다.

이 설정이 활성화되면 사용자가 로그인되고 있음을 알리는 작은 팝업이 표시됩니다. 이 팝업은 사용자가 댓글 위젯과 상호작용할 때마다 표시됩니다; 예를 들어 댓글을 남길 때 표시됩니다.

코드에서는 enableThirdPartyCookieBypass 플래그를 true로 설정하여 이 기능을 활성화할 수 있습니다:

Enabling Third-Party Cookie Bypass

Copy Run

1

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

3<div id="fastcomments-widget"></div>

4<script>

5window.fcConfigs = [{

6 "tenantId": "demo",

7 "enableThirdPartyCookieBypass": true

8}];

9</script>

10

또한 위젯 사용자화 UI에서 Enable Third-Party Cookie Popup 항목을 통해 이 설정을 구성할 수도 있습니다:

Enabling Third-Party Cookie Bypass

기본적으로 사용자는 자신의 댓글을 삭제할 수 있습니다. 또한, 댓글을 삭제하면 해당 스레드의 모든 하위 및 임시 댓글이 자동으로 삭제됩니다. 이 동작은 실시간으로 적용됩니다.

You can restrict this in the following ways:

• 대신 삭제된 댓글을 익명 처리하여 이름과 내용을 [deleted] 또는 사용자 지정 값으로 설정합니다.
• 답글이 있는 경우 댓글 삭제를 허용하지 않습니다. 사용자 지정 가능한 오류 메시지가 표시됩니다.
• 댓글에 답글이 있는 경우 삭제 권한을 관리자와 중재자에게만 제한합니다.

This can be configured via the Comment Thread Deletion section in the Widget Customization UI.

Customize Delete Behavior for Replies

기본적으로 FastComments는 사용자 배지를 댓글 스레드 내의 사용자 댓글에만 표시합니다.

그러나 위젯 사용자화 페이지에서 이 기능을 활성화하면 댓글 작성 양식 위에 있는 이름 옆에 사용자 배지를 표시할 수 있습니다:

Show Badges in Top Bar Option

이렇게 하면 사용자가 댓글을 작성할 때 상단 바 영역에서 이름 옆에 배지가 표시되어 업적과 상태가 더 눈에 띄게 됩니다.

이 기능은 작동하려면 위젯 사용자화 UI에서 활성화되어 있어야 합니다. 서버 수준에서 켜져 있어도 코드 구성에서 showBadgesInTopBar 플래그를 false로 설정하여 선택적으로 비활성화할 수 있습니다:

Disable Show Badges in Top Bar

Copy Run

1

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

3<div id="fastcomments-widget"></div>

4<script>

5window.fcConfigs = [{

6 "tenantId": "demo",

7 "showBadgesInTopBar": false

8}];

9</script>

10

기본적으로 FastComments는 페이지에 사용자 목록을 표시하지 않습니다.

댓글 위젯과 함께 현재 페이지를 보고 있는 사람들의 목록을 렌더링할 수 있습니다. 이 목록은 사용자가 들어오고 나갈 때 실시간으로 업데이트되며, 이름, 아바타 및 온라인 표시기를 보여줍니다.

레이아웃 옵션은 세 가지가 있습니다:

• 1 - 상단: 댓글 위에 겹쳐진 아바타가 가로로 표시됩니다.
• 2 - 왼쪽: 위젯 왼쪽에 이름과 온라인 점이 있는 사이드바가 표시됩니다.
• 3 - 오른쪽: 위젯 오른쪽에 동일한 사이드바가 표시됩니다.

기능을 활성화하려면 usersListLocation 플래그를 설정하세요:

Show Users List on the Right

Copy Run

1

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

3<div id="fastcomments-widget"></div>

4<script>

5window.fcConfigs = [{

6 "tenantId": "demo",

7 "usersListLocation": 3

8}];

9</script>

10

기본적으로 목록은 현재 온라인 상태인 사용자만 표시합니다. 과거에 페이지에 댓글을 남겼지만 현재 보고 있지 않은 사람들도 포함하려면 usersListIncludeOffline을 true로 설정하세요:

Include Past Commenters

Copy Run

1

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

3<div id="fastcomments-widget"></div>

4<script>

5window.fcConfigs = [{

6 "tenantId": "demo",

7 "usersListLocation": 3,

8 "usersListIncludeOffline": true

9}];

10</script>

11

과거 댓글 작성자는 초록색 온라인 점 없이 렌더링되어 누가 지금 접속해 있는지 명확하게 보여줍니다.

비공개 프로필을 가진 사용자는 일반 아바타와 "Private Profile" 레이블로 표시되어 신원을 밝히지 않으면서도 집계 수는 정확하게 유지됩니다.

코드 없이도 구성할 수 있습니다. 위젯 커스터마이즈 페이지에서 "Users List Location" 옵션을 참조하세요. 위치가 Off가 아닌 값으로 설정되면 그 아래에 "Include past commenters" 체크박스가 나타납니다.

Users List Settings

실시간 사용자 500명 이후에는 목록이 최대 30초까지 최신이 아닐 수 있습니다.