Add Comments to Ionos Sites

FastComments를 사용하면 Ionos로 구축된 모든 사이트에 라이브 댓글 기능을 쉽게 추가할 수 있습니다.

이 튜토리얼은 FastComments 계정이 필요합니다. 먼저 가입한 다음 다시 이곳으로 돌아오는 것을 권장합니다. 여기에서 계정을 생성할 수 있습니다.

1단계: 문의 양식 추가

먼저 FastComments가 대체할 연락처 양식을 추가하겠습니다.

이를 위해 사이트 편집기를 열고 원하는 페이지에서 Add Section을 클릭하세요.

그런 다음 왼쪽에서 Content -> Contact -> Contact Form으로 이동합니다(아래와 같이):

연락처 양식 추가

다음으로 FastComments가 양식을 대체하도록 알려야 합니다. 기본 양식 제목을 클릭하세요:

양식 제목 설정

FastComments Goes Here로 제목을 설정합니다. 대소문자 및 공백이 정확히 같아야 하며, 그렇지 않으면 작동하지 않으므로 이 텍스트를 복사하여 붙여넣을 것을 권장합니다.

완료되면 다음과 같이 표시됩니다:

제목 설정 완료

1단계가 끝났습니다!

2단계: FastComments.com 코드 추가

다음으로 FastComments 위젯 코드를 사이트에 추가하겠습니다. 이 코드는 제목이 FastComments Goes Here인 모든 폼을 찾아 FastComments로 교체합니다.

그럼 사이트 편집기 왼쪽 하단의 Settings로 이동해 보겠습니다:

설정 열기

Custom Head Code 섹션을 엽니다:

사용자 헤드 코드 열기

Ionos의 경우 FastComments 위젯 코드의 특별한 버전이 필요합니다. 다른 튜토리얼의 코드 스니펫은 작동하지 않습니다.

이제 다음 코드를 복사하세요:

Ionos FastComments 스니펫

Copy

<script src="https://cdn.fastcomments.com/js/embed-v2.min.js"></script>
<script>
    (function () {
        let loaded = false;
        let interval = null;
        function attemptLoad() {
            const nodes = document.querySelectorAll('h2');
            nodes.forEach(function (node) {
                if (node.innerText && node.innerText.trim() === 'FastComments Goes Here') {
                    // 전체 너비가 아닌 요소를 가져옵니다
                    const target = node.parentNode.parentNode.parentNode.parentNode.parentNode;
                    target.innerHTML = '';
                    FastCommentsUI(target, {
                        tenantId: "demo"
                    });
                    interval && clearInterval(interval);
                    loaded = true;
                }
            });
        }
        attemptLoad();
        if (!loaded) {
            interval = setInterval(attemptLoad, 300);
        }
    })();
</script>