Typeflo.io 블로그에 실시간 댓글 추가

이 가이드에서 다루는 내용

이 가이드는 Typeflo.io 블로그에서 FastComments를 사용한 실시간 댓글 설정 방법을 다룹니다.

1. 코드 입력 찾기

Typeflo.io 블로그에 FastComments를 추가하려면 먼저 블로그의 대시보드로 이동한 다음 왼쪽 사이드바에서 설정을 클릭하세요.

설정 클릭

다음으로 설정 페이지 상단에서 사용자 지정 코드 탭을 클릭하세요.

사용자 지정 코드 탭 클릭

사용자 지정 코드를 추가할 수 있는 세 섹션(헤더, 본문, 푸터)이 표시됩니다. FastComments는 푸터 섹션을 사용합니다.

2. 코드 삽입

Custom Code 탭의 Footer 섹션에 다음 코드를 붙여넣으세요:

Typeflo.io 라이브 댓글 코드 스니펫

Copy

<script src="https://cdn.fastcomments.com/js/embed-v2.min.js" async></script>
<script>
    (function () {
        function load() {
            let target = null;
            let lastInstance;
            if (document.querySelector('.fastcomments-widget')) {
                setTimeout(load, 1000);
                return;
            }
            if (lastInstance) {
                lastInstance.destroy();
            }
            if (window.FastCommentsUI) {
                const newElement = document.createElement('div');
                newElement.classList.add('fastcomments-widget');
                const subscribeSection = document.querySelector('.nc-SectionSubscribe2');
                if (subscribeSection) {
                    subscribeSection.parentNode.insertBefore(newElement, subscribeSection);
                    target = newElement;
                } else {
                    const fullWidthSection = document.querySelector('.container.w-full');
                    if (fullWidthSection) {
                        fullWidthSection.prepend(newElement);
                        target = newElement;
                    }
                }
            }
            if (target) {
                lastInstance = FastCommentsUI(target, {
                    "tenantId": "demo"
                });
            }
            setTimeout(load, 1000);
        }
        load();
    })();
</script>

Footer 섹션에 코드 붙여넣기

코드를 붙여넣은 후 변경 사항을 적용하려면 Save 버튼을 클릭하세요.

참고: 이 코드는 Typeflo.io 블로그 게시물에서 FastComments 위젯을 동적으로 최적의 위치에 배치하는 로직을 포함합니다. 다른 코드 스니펫은 Typeflo.io의 레이아웃에서 제대로 작동하지 않을 수 있습니다.

가입 후 실제 FastComments 테넌트 ID로 'demo'를 교체해야 합니다. FastComments.com에 로그인한 상태라면 이미 교체되어 있을 것입니다.

성공

잘하셨습니다! Typeflo.io 블로그에 실시간 댓글 기능을 추가하셨습니다.

이제 FastComments가 블로그의 모든 게시물에 표시되어 독자들이 토론에 참여할 수 있습니다.

권한 거부 오류가 발생했거나 FastComments를 맞춤 설정하려면 계속 읽어보세요.

맞춤 설정

FastComments는 블로그 디자인에 맞게 맞춤화되도록 설계되었습니다.

맞춤 스타일을 추가하거나 구성을 조정하려면, 맞춤 설정 문서 확인하기에서 방법을 확인하세요.

Typeflo.io 블로그의 경우, FastComments 스크립트를 추가했던 동일한 Custom Code 섹션에 사용자 지정 CSS 스타일을 추가할 수 있습니다.

도메인 오류

다음과 같은 권한 오류가 발생할 수 있습니다:

도메인 구성 누락

이는 FastComments가 이 도메인에서 귀하의 계정을 사용하도록 허용해야 하는지 알지 못하기 때문입니다.

이 경우 해결 방법은 간단합니다. Typeflo.io 블로그 도메인을 FastComments.com 계정에 추가하면 됩니다.

계정에 사이트를 추가하려면 여기를 방문하세요.

참고: FastComments가 모든 상황에서 정상 작동하도록 하려면 맞춤 도메인(있는 경우)과 Typeflo.io 서브도메인 둘 다를 추가했는지 확인하세요.

Typeflo.io 블로그에 설문 추가

FastComments가 Typeflo.io 블로그에 설치되면, 댓글 안에서 실시간 설문조사를 실행할 수 있습니다. 위젯 맞춤 설정에서 Enable Polls 를 켜면 설문조사 버튼이 댓글 도구 모음에 나타납니다. 설문조사는 2~10개의 옵션을 가질 수 있으며, 결과는 페이지에 있는 모든 사람에게 실시간으로 업데이트되고, 누가 설문조사를 만들 수 있는지와 투표에 로그인 필요 여부를 선택할 수 있습니다. Typeflo.io에 추가로 설치할 것이 없습니다.

Live 설문조사 데모 보기 또는 설문조사 문서를 읽고 설정하세요.

언어 🇰🇷 한국어

설치

설문