콘텐츠로 건너뛰기

내장 편집기에서 인앱 메시지 만들기

Pushwoosh 내장 편집기에서 코드를 작성하지 않고 인앱 메시지 템플릿을 만드세요. 콘텐츠 블록, 이미지, 버튼, 개인화된 텍스트가 포함된 재사용 가능한 레이아웃을 얻을 수 있으며, 이를 Customer Journey, 일회성 인앱 또는 푸시에서 표시할 수 있습니다.

새 인앱 템플릿 만들기

Anchor link to

인앱 템플릿은 한 번 만들고 캠페인에서 사용자에게 보여주는 재사용 가능한 디자인입니다. 내장 편집기에서 만들거나, 사용자 지정 HTML ZIP을 업로드하거나, 네이티브 리치 미디어 템플릿을 빌드할 수 있습니다. 이 문서에서는 내장 편집기에서 처음부터 템플릿을 만드는 방법을 다룹니다. 기존 템플릿을 사용자 지정하려면 동일한 단계를 따르세요.

  1. 콘텐츠인앱으로 이동합니다.
  2. 인앱 만들기를 클릭합니다.
템플릿 목록 오른쪽 상단에 인앱 만들기 버튼이 있는 콘텐츠 인앱 페이지
  1. 템플릿 이름을 입력합니다.
  2. 템플릿 생성 방법을 선택합니다:
    • 새 템플릿 만들기: 내장 편집기에서 템플릿을 빌드합니다.
    • ZIP 업로드: HTML 인앱 메시지가 포함된 ZIP 파일 업로드
    • 네이티브 리치 미디어 만들기: SDK 렌더링 네이티브 인앱을 빌드합니다. 자세히 알아보기
  3. 새 템플릿 만들기를 선택합니다.
  4. 인앱 만들기를 클릭합니다.
이름 필드, 새 템플릿 만들기 선택, ZIP 업로드 및 네이티브 리치 미디어 만들기 옵션이 있는 새 템플릿 추가 대화 상자

편집기 레이아웃 살펴보기

Anchor link to

내장 편집기에는 네 가지 영역이 있습니다. 각 영역에는 명확한 역할이 있습니다.

상단 바

Anchor link to

상단 바는 템플릿 전체를 관리하는 곳입니다: 이름, 실행 취소 내역, 저장 상태, 기기에서의 모양(인앱 설정), 언어(자동 번역 및 언어 전환기), 휴대폰 또는 데스크톱 미리보기 너비, 콘텐츠 스캔(확인). 기기에서 인앱이 어떻게 보이는지 구성하기, 템플릿 현지화하기, 저장하기 전에 콘텐츠 확인하기를 참조하세요.

템플릿 이름, 실행 취소, 다시 실행, 인앱 설정, 언어 전환기, 자동 번역, 휴대폰 및 데스크톱 미리보기, 저장됨이 있는 인앱 편집기의 상단 바

더 많은 작업을 보려면 상단 바의 메뉴를 엽니다:

미리보기

Anchor link to

미리보기를 사용하면 메시지를 저장하기 전에 버튼을 탭하고, 다중 화면 플로우를 이동하고, 휴대폰이나 데스크톱에서 레이아웃을 확인할 수 있습니다.

휴대폰 및 데스크톱 토글, 다시 시작, 그리고 이미지, 제안 텍스트, 타이머, 청구 버튼을 보여주는 인앱 메시지가 있는 미리보기 패널

미리보기에서 작동하는 기능:

  • 버튼과 다중 화면 플로우가 실제로 실행됩니다.
  • 링크와 딥 링크는 보고되지만 열리지는 않습니다.
  • SDK 호출 및 열기/클릭 통계는 비활성화된 상태로 유지됩니다.
  • 언어는 언어 전환기와 일치합니다. Merge Tags는 플레이스홀더로 유지됩니다.

미리보기 헤더에서 휴대폰과 데스크톱 간에 전환하여 두 레이아웃을 모두 볼 수 있습니다. 다시 시작을 클릭하여 메시지를 처음부터 다시 표시합니다. 미리보기를 종료하려면 Esc 키를 누르거나 패널 바깥쪽을 클릭합니다.

브랜드 북

Anchor link to
  • 브랜드 북: 계정의 브랜드 북을 엽니다.
  • 브랜드 북 스타일 적용: 템플릿을 브랜드 북과 일치하도록 스타일을 다시 지정합니다(브랜드 북을 설정한 후).
  • 사용자 지정 스타일 재설정: 템플릿의 스타일 재정의를 제거하고 기본값으로 되돌립니다.

.zip 다운로드

Anchor link to

ZIP 다운로드는 템플릿을 ZIP 파일로 저장합니다. 마지막으로 저장된 버전을 다운로드하므로 먼저 변경 사항을 저장하세요. 이 메뉴 항목은 템플릿이 한 번 이상 저장된 후에만 나타납니다. 새로 저장되지 않은 템플릿에는 표시되지 않습니다.

캔버스에서 메시지를 편집합니다: 텍스트, 이미지, 버튼을 클릭하여 변경합니다. 상단 바의 휴대폰/데스크톱 토글을 사용하여 각 너비에서 레이아웃이 어떻게 보이는지 확인합니다. 이 토글은 레이아웃 자체가 아니라 미리보기만 변경합니다.

레이어 패널은 템플릿의 모든 블록을 캔버스와 동일한 순서로 트리 구조로 나열합니다. 왼쪽 가장자리에서 열어 중첩된 블록(예: 그룹 내의 버튼)을 선택하거나 행을 드래그하여 콘텐츠 순서를 변경할 수 있습니다.

카드, 이미지, 제목, 텍스트, 타이머, 버튼, 바닥글을 트리 구조로 나열하는 레이어 패널

오른쪽 패널

Anchor link to

세 개의 탭 간에 전환합니다:

  • 블록: 메시지에 콘텐츠를 추가합니다. 인앱 편집기 블록 참조를 참조하세요.
  • 설정: 전체 템플릿에 한 번에 스타일을 적용합니다. 인앱 템플릿 설정 구성을 참조하세요.
  • AI: AI 어시스턴트와 채팅하여 프롬프트에서 콘텐츠를 생성하거나 편집합니다.
제목, 텍스트, 버튼, 이미지 및 기타 콘텐츠 블록이 있는 오른쪽 패널의 블록 탭

콘텐츠 블록 추가

Anchor link to
  1. 오른쪽 패널에서 블록 탭을 엽니다.
  2. 블록을 캔버스로 드래그하거나 블록을 클릭하여 템플릿 끝에 추가합니다.
  3. 레이아웃이 준비될 때까지 블록을 계속 추가합니다.
캔버스에 '블록으로 시작'이 표시되고 블록 패널이 열려 있는 빈 인앱 편집기

각 블록 유형은 메시지에서 다른 목적을 가집니다:

  • 제목: 제목 및 짧은 헤드라인
  • 텍스트: 본문 및 긴 설명
  • 버튼: 탭 가능한 클릭 유도 문구
  • 이미지: 미디어 스토어의 사진, 업로드 또는 URL
  • 비디오: YouTube 또는 Vimeo 비디오를 여는 탭 가능한 비디오 썸네일
  • 카드: 이미지, 제목, 텍스트, 버튼이 하나의 레이아웃에 포함됨
  • 구분선: 섹션을 구분하는 선
  • : 나란히 배치된 레이아웃(2, 3 또는 4개의 동일한 열 또는 33/67 및 67/33 분할)
  • 타이머: 제안 및 마감일을 위한 카운트다운
  • 메뉴: 탐색 또는 연락처 링크의 행 또는 열
  • 소셜: 소셜 프로필에 연결되는 아이콘
  • HTML: 양식, 설문조사 또는 내장 비디오와 같은 사용자 지정 HTML
  • 제품: 제품 카탈로그 또는 사용자의 버려진 장바구니에 있는 제품 카드의 그리드

각 블록에 대한 설정은 인앱 편집기 블록 참조를, 블록 저장 및 재사용 방법을 참조하세요.

특정 사용자에게 블록 표시하기

Anchor link to

모든 사용자가 동일한 블록을 볼 필요는 없습니다. 블록에 표시 조건을 설정하여 사용자의 Tags에 따라 표시하거나 숨길 수 있습니다. 템플릿은 하나만 보내지만 각 사용자는 자신에게 적용되는 부분만 보게 됩니다.

캔버스에서 블록을 선택하고 오른쪽 패널에서 표시 조건을 연 다음 이 블록을 조건부로 표시를 켭니다. 자세히 알아보기

템플릿 현지화하기

Anchor link to

다국어 템플릿은 하나의 인앱 디자인에 각 언어에 대한 현지화된 사본을 저장합니다. 채널 전반에 걸쳐 다국어 메시징이 작동하는 방식에 대해서는 다국어 메시징을 참조하세요.

다국어 콘텐츠를 설정하려면:

  1. 상단 바의 언어 전환기를 클릭하여 언어 목록을 엽니다.
  2. 추가하려는 언어를 선택한 다음 적용을 클릭합니다.
  3. 언어 전환기를 사용하여 언어 간에 이동하고 선택한 언어에 대해 각 블록의 콘텐츠를 편집합니다.
  4. 자동 번역을 클릭하여 누락된 번역을 자동으로 채웁니다. 저장하기 전에 AI가 생성한 텍스트를 검토하세요.

템플릿 설정 구성하기

Anchor link to

메시지 스타일을 지정하고 배치하는 데 두 곳을 사용합니다:

  • 설정 탭(오른쪽 패널): 문서 크기, 색상, 타이포그래피 및 블록의 기본 스타일.
  • 인앱 설정(상단 바): 화면에서의 위치, 애니메이션 및 닫기 버튼.

자세히 알아보기

저장하기 전에 콘텐츠 확인하기

Anchor link to

상단 바에서 확인을 클릭하여 스마트 확인을 열고 템플릿에서 일반적인 문제를 스캔합니다.

미리보기 및 저장 옆에 확인 버튼이 강조 표시된 인앱 편집기의 상단 바

스마트 확인은 다음을 찾습니다:

  • URL이 없거나 http(s), mailto:, tel: 또는 딥 링크(예: myapp://promo) 주소가 아닌 URL이 있는 버튼, 메뉴 항목 및 이미지 링크
  • 미완성 AI 플레이스홀더 블록
  • 빈 이미지 또는 비디오 슬롯 및 누락된 대체 텍스트
  • 누락되거나 잘못된 링크가 있는 제품 카드
  • WCAG AA를 충족하지 않는 텍스트 대비
  • 번역되지 않은 콘텐츠
  • 종료일이 이미 지난 카운트다운 타이머
  • 깨지거나 비어 있는 규칙, 연결된 블록을 잃어버린 분기 또는 계정에 대해 동적 콘텐츠가 비활성화되어 적용되지 않는 조건이 있는 표시 조건
누락된 버튼 링크 오류와 빈 이미지 슬롯 경고를 나열하는 스마트 확인 패널

결과를 클릭하면 캔버스에서 영향을 받는 요소로 바로 이동합니다. 문제가 없으면 패널에 **모든 확인 통과 — 콘텐츠를 저장할 준비가 되었습니다.**가 표시됩니다.

템플릿 저장하기

Anchor link to

상단 바에서 저장을 클릭하여 변경 사항을 저장합니다. 상단 바의 실행 취소/다시 실행을 사용하여 편집 내용을 앞뒤로 이동할 수 있습니다.