인앱메시지 연동 가이드

웹사이트에 머무는 방문자에게 배너·모달·토스트·전면 메시지를 실시간으로 노출합니다.

동작 방식

인앱메시지는 푸시가 아닙니다. 앱푸시·SMS·이메일이 사용자를 밖에서 불러오는 채널이라면, 인앱메시지는 이미 사이트에 들어와 있는 방문자에게 화면 안에서 말을 거는 채널입니다. 수신동의도, 발송 시각도 필요 없고 사용자가 페이지를 보고 있는 순간에 바로 노출됩니다.

표시 유형

4가지 유형을 제공하며, 콘솔에서 유형별로 위치와 색상을 조정할 수 있습니다.

메시지 구성 요소

콘솔에서 입력하는 항목입니다.

설치 확인

Web SDK가 설치되어 있으면 그대로 동작합니다. 아직 설치 전이라면 아래처럼 초기화합니다.

<script src="https://fplink.net/sdk/v1/fplink-tracker.js"></script>
<script>
  const tracker = new FPLinkTracker({
      appId: 'YOUR_APP_ID',
      apiKey: 'YOUR_API_KEY'
      // enableInAppMessaging 기본값 true — 별도 설정 불필요
  });
</script>

인앱메시지를 일시적으로 끄고 싶을 때만 아래 옵션을 사용합니다.

const tracker = new FPLinkTracker({
    appId: 'YOUR_APP_ID',
    apiKey: 'YOUR_API_KEY',
    enableInAppMessaging: false   // 이 페이지에서는 인앱메시지를 표시하지 않음
});

누구에게 보낼지 정하기

대상은 주소록 전체, 특정 그룹, 또는 세그먼트로 지정합니다. "최근 30일 안에 구매한 적 없는 회원"처럼 조건으로 대상을 좁히려면 세그먼트를 사용하세요.

→ 세그먼트 사용자 속성 가이드에서 조건 만드는 방법을 확인하세요.

노출 동작 상세

토스트는 몇 초 뒤 자동으로 사라지고, 나머지 유형은 사용자가 닫을 때까지 유지됩니다. 모달·전면 메시지는 키보드 초점이 메시지 안에 머물도록 처리되어 있어 스크린리더 사용자도 조작할 수 있습니다.

미리보기로 확인하기

실제 캠페인을 만들지 않고 디자인만 확인하고 싶을 때 브라우저 콘솔에서 바로 띄워볼 수 있습니다. 개발 중 위치·색상을 조정할 때 유용합니다.

// 브라우저 개발자도구 콘솔에서 실행
FPLinkInApp.preview({
    displayType: 'MODAL',              // BANNER | MODAL | TOAST | FULLSCREEN
    title: '첫 구매 10% 할인',
    body: '지금 가입하면 즉시 사용 가능한 쿠폰을 드려요.',
    ctaText: '쿠폰 받기',
    landingUrl: '/promotion',
    imageUrl: 'https://example.com/banner.png',
    backgroundColor: '#ffffff',
    buttonColor: '#2563eb'
});

성과 확인

콘솔 캠페인 상세에서 노출 수, 클릭 수, 닫기 수를 확인할 수 있습니다.

• 노출 — 메시지가 화면에 표시된 횟수
• 클릭 — 버튼 또는 메시지 영역을 눌러 랜딩 URL로 이동한 횟수
• 닫기 — 사용자가 닫기 버튼을 누른 횟수

랜딩 URL에 단축URL을 사용하면 인앱메시지 이후의 이동 경로와 전환까지 함께 추적됩니다.

과금

트러블슈팅