Add Comments to Shopify Sites

FastComments를 Shopify와 함께 사용하기 위한 첫 번째 단계는 Shopify의 시스템을 비활성화하는 것입니다.

참고 FastComments Support는 기존 댓글 스레드 이전을 도와드릴 수 있습니다.

Shopify 댓글 시스템을 교체하려면, 스토어 대시보드로 이동하여 왼쪽 아래의 Blog posts를 클릭합니다:

블로그 게시물 관리자 열기

그런 다음 오른쪽 상단의 Manage blogs를 클릭합니다:

블로그 관리

관리하려는 블로그를 클릭합니다. Comments are disabled라고 표시되면 이 단계를 건너뛰고 Step Two로 이동할 수 있습니다.

블로그 관리

그렇지 않다면 블로그를 선택하고 오른쪽 패널에서 Comments are disabled가 선택되어 있는지 확인합니다:

댓글 비활성화

이제 저장을 클릭합니다.

이제 FastComments를 추가하기 위해 스토어의 테마를 편집하겠습니다.

In the left panel, open Themes:

테마 열기

Under Current theme, select Actions and then Edit code:

코드 편집

This will open up a code editor, with a file browser on the left and the code on the right.

All we need to do is copy a small piece of code that adds FastComments and paste it on the right line in the right file.

In the file browser on the left, scroll down and click Sections:

Sections 선택

Now we're going to scroll down and select main-article.liquid:

main-article 선택

This will open the theme template used to render a single blog article.

You should now see something similar to the following, with main-article.liquid selected at the top:

main-article 열림

다음으로 100번째 줄로 스크롤합니다:

100번째 줄로 스크롤

이제 다음 코드 스니펫을 복사합니다. 이 스니펫은 Shopify 전용으로 설계되었으므로 다른 튜토리얼의 코드 스니펫을 사용하지 마십시오:

Shopify용 FastComments 스니펫

Copy

1

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

3<div id="fastcomments-widget" class="page-width page-width--narrow"></div>

4<script>

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

6 tenantId: "demo",

7 urlId: window.location.pathname

8 });

9</script>

10

이제 커서를 101번째 줄 - </div> 바로 다음 - 에 놓고 붙여넣습니다. 다음과 같은 모습이어야 합니다:

FastComments 코드 추가

이제 저장합니다:

저장

이제 블로그 게시물을 보면 FastComments를 볼 수 있습니다!

성공!

Shopify에 FastComments를 설정한 것을 축하드립니다! 만약 Domain Error가 발생했거나 댓글 영역을 사용자화하는 방법을 알고 싶다면 계속 읽어보세요!

FastComments는 귀하의 사이트에 맞게 맞춤화되도록 설계되었습니다.

사용자 지정 스타일을 추가하거나 구성을 조정하려면, 맞춤화 및 구성 문서 확인하여 방법을 알아보세요.