콘텐츠로 건너뛰기

웹 양식

웹 양식은 입력 필드가 있는 웹 콘텐츠입니다: 이메일 필드, 답변을 태그에 저장하는 필드, 동의 체크박스, 제출 버튼. 팝업 또는 인라인 웹 캠페인에 표시하면 별도의 구독 양식을 설정하지 않고도 방문자를 이메일에 구독시키고 방문자가 알려준 정보를 프로필에 저장할 수 있습니다.

입력 필드 없이 메시지를 표시하려면 대신 웹 콘텐츠를 만드세요. 웹 콘텐츠 템플릿 갤러리에 바로 사용할 수 있는 템플릿이 있습니다.

웹 양식의 작동 방식

Anchor link to

방문자가 양식을 제출하면 Pushwoosh는 다음 작업을 순서대로 수행합니다:

  1. Tag input 필드에 입력된 각 답변을 방문자의 브라우저 디바이스에 있는 해당 태그에 즉시 기록합니다. 방문자가 웹 푸시를 구독하지 않은 경우에도 마찬가지입니다. 비어 있는 답변은 태그의 현재 값을 그대로 둡니다.
  2. 양식에 Email input이 있으면 이메일 주소를 이메일에 구독시키고 동일한 태그 값을 가진 이메일 디바이스를 생성합니다. 더블 옵트인이 켜져 있으면 방문자는 먼저 확인 이메일을 받습니다.
  3. Pushwoosh가 제출을 수락하면 양식의 Success 페이지를 표시합니다.

요금제에 웹 플랫폼이 포함되어 있지 않으면 태그는 저장되지 않지만 제출은 그대로 수락됩니다. Email input이 없는 양식은 브라우저 디바이스에 태그만 저장합니다. 예를 들어 방문자에게 관심사를 물어볼 때 사용합니다.

웹 양식 만들기

Anchor link to

양식을 만들려면 양식을 생성하고, 필드를 추가하고, Success 페이지를 디자인한 다음 저장합니다. 양식이 길면 여러 페이지로 나눕니다.

웹 양식 생성하기

Anchor link to
  1. 콘텐츠 → 웹 콘텐츠로 이동합니다.

  2. 만들기를 클릭하고 웹 양식 유형을 선택합니다.

    만들기 메뉴가 열려 있고 웹 양식 옵션이 강조 표시된 웹 콘텐츠 목록
  3. 템플릿을 선택합니다:

    • Email subscription: 제목, 이메일 필드, 동의 체크박스, Submit 버튼, “Thank you!” Success 페이지가 있는 가입 양식.
    • Blank form: 제목과 Submit 버튼만 있는 빈 양식.
    Email subscription 및 Blank form 템플릿이 있는 웹 양식 템플릿 갤러리
  4. 상단 바에서 이름을 클릭하고 양식 이름을 입력합니다. 방문자에게는 보이지 않습니다. 이름이 없으면 양식을 저장할 수 없습니다.

양식 필드 추가하기

Anchor link to

웹 양식에는 Text, Button, Icon 블록과 네 가지 양식 블록인 Email input, Tag input, Consent, Submit이 있습니다.

  1. 오른쪽의 Elements 탭을 엽니다.

    Text, Button, Icon, Tag input, Consent 타일이 있고 Email input 및 Submit 타일은 사용할 수 없는 웹 양식의 Elements 탭
  2. 블록을 양식으로 드래그하거나 클릭하여 현재 페이지에 추가합니다.

  3. 양식에서 블록을 선택합니다. 블록의 옵션이 Settings 탭에서 열립니다.

    • 블록을 위나 아래로 이동하려면 POSITION 화살표를 사용합니다.
    • 블록을 제거하려면 삭제 아이콘을 클릭합니다.

양식에는 Email input과 Submit이 각각 하나만 있을 수 있으므로, 양식에 이미 있으면 해당 타일을 사용할 수 없게 됩니다.

실행 취소 및 다시 실행은 웹 콘텐츠에서와 동일하게 작동합니다. 실행 취소 및 다시 실행을 참조하세요.

각 블록 설정에 대한 자세한 내용은 블록을 참조하세요.

Success 페이지 디자인하기

Anchor link to

모든 웹 양식은 Success 페이지로 끝나며, 방문자는 Pushwoosh가 제출을 수락한 후 이 페이지를 봅니다. 이 페이지는 삭제하거나 시작 페이지로 지정할 수 없습니다.

  1. + 페이지 추가 다음의 마지막 탭인 Success 탭을 클릭합니다.

    Success 탭이 선택되어 있고, 캔버스에 Thank you! 메시지가 있으며 오른쪽에 Elements 탭이 있는 웹 양식 에디터
  2. 다른 페이지와 마찬가지로 편집합니다. 예를 들어 할인 코드가 포함된 감사 메시지에 Text, Button, Icon 블록을 사용합니다. Submit 버튼은 여기에 배치할 수 없습니다.

긴 양식을 여러 페이지로 나누기

Anchor link to

한 번에 묻는 질문 수를 줄이려면 페이지를 추가합니다.

  1. + 페이지 추가를 클릭합니다. 새 페이지는 현재 페이지 다음에 추가되며, Success 페이지 다음에는 추가되지 않습니다.
  2. 방문자를 다음 단계로 이동시키려면 Go to page 액션이 있는 버튼을 추가합니다.

Success 페이지로 바로 이동하는 버튼은 양식을 제출합니다. 페이지를 추가, 복제, 삭제하는 방법은 여러 페이지를 참조하세요.

복제된 페이지는 양식 블록 없이 복사됩니다. 양식에는 Email input과 Submit이 각각 하나만 있으며, 각 태그는 한 번만 사용할 수 있습니다.

다중 페이지 양식의 제출 방식

Anchor link to

양식의 유일한 Submit 버튼이 모든 페이지를 함께 전송합니다.

양식이 전송되기 전:

  • 현재 페이지의 필드가 유효하지 않으면 방문자는 다음으로 이동할 수 없습니다. 이전으로 돌아가는 것은 항상 가능합니다.
  • 제출 시 양식은 먼저 브라우저에서 모든 페이지를 확인합니다. 다른 페이지의 필드가 유효하지 않으면 양식은 해당 페이지로 전환하여 그 필드의 오류 텍스트를 표시하고, 아무것도 전송하지 않습니다.

양식이 전송된 후:

  • Pushwoosh가 이메일 주소를 거부하면 양식은 Email input이 있는 페이지로 전환하여 해당 필드의 Invalid email text를 표시합니다.
  • Pushwoosh가 다른 이유로 제출을 거부하면(예: 필드가 저장된 양식과 더 이상 일치하지 않는 경우) 방문자는 현재 페이지에 머무르며 Submit error text를 보게 됩니다.

양식 저장하기

Anchor link to

저장하기 전에 양식을 전체 크기로 보려면 미리보기를 클릭합니다. 미리보기에서는 아무것도 전송되지 않으므로 양식은 사이트에서 테스트하세요.

  1. 상단 바에서 저장을 클릭합니다.

  2. The form can’t be saved yet 배너가 열리면 배너에 나열된 각 문제를 수정합니다. 양식을 저장할 수 없는 경우를 참조하세요.

    누락된 개인정보 처리방침 URL과 태그가 없는 Tag input을 나열하는 The form can't be saved yet 배너
  3. 저장을 다시 클릭합니다.

양식을 저장할 수 없는 경우

Anchor link to

The form can’t be saved yet 배너에는 저장을 막는 모든 문제가 나열됩니다. 표에서 해당 메시지를 찾아 안내대로 조치하세요.

배너의 메시지조치 방법
Add an Email input or a Tag input필드를 하나 이상 추가합니다.
The form needs exactly one Submit button, not on the success pageSuccess가 아닌 페이지에 Submit 버튼을 하나만 둡니다.
A form with an Email input needs a Consent block with a privacy policy URLConsent 블록을 추가하고 Privacy policy URL을 입력합니다.
The privacy policy URL must start with https:// or / — otherwise the site shows no linkURL을 https://… 형식 또는 /로 시작하는 사이트 내 경로로 입력합니다.
Keep only one Email input추가된 Email input을 삭제합니다.
Choose a tag in every Tag input각 Tag input에서 태그를 선택하거나 빈 필드를 삭제합니다.
Tag “…” is chosen in more than one field필드 중 하나에서 다른 태그를 선택합니다.
“…” is a reserved tag — a form can’t write PW_FF_* tags다른 태그를 선택합니다.
The form needs exactly one success pageSuccess 페이지를 하나만 둡니다.

저장할 때 Pushwoosh는 선택된 각 태그도 확인합니다. 태그가 삭제되었거나 숨겨져 있거나 이름이 PW_FF_로 시작하면 양식이 저장되지 않으며, 오류 메시지에 해당 태그가 표시됩니다. 예: Tag "City" must be an existing, non-hidden tag, not PW_FF_*, used once. 해당 필드에서 다른 태그를 선택하세요.

사이트에 양식 표시하기

Anchor link to

양식은 활성 웹 캠페인 안에서만 사이트에 나타납니다. 하나의 양식을 여러 캠페인에서 사용할 수 있습니다. 팝업 캠페인은 양식을 페이지 위에 표시하고, 인라인 캠페인은 페이지 요소 안의 블록으로 표시합니다.

시작하기 전에 개발자에게 다음을 요청하세요:

  • 사이트에서 Web SDK 3.99.0 이상이 실행되는지 확인합니다. 이전 버전의 Web SDK는 필드 없이 양식을 표시합니다.
  • 인라인 캠페인을 계획하는 경우 캠페인이 배치될 페이지 요소를 추가합니다. CSS 선택자를 참조하세요.

그런 다음 캠페인을 만듭니다:

  1. 캠페인 → 웹 캠페인으로 이동합니다.
  2. 캠페인 만들기를 클릭하고 팝업 또는 인라인을 선택합니다.
  3. 웹 콘텐츠에서 양식을 선택합니다. 양식은 이름 아래에 웹 양식이 표시됩니다.
  4. 잠재고객 및 표시 설정을 구성합니다.
  5. 캠페인을 시작합니다.

모든 단계는 웹 팝업 캠페인 만들기를 참조하세요.

더블 옵트인으로 이메일 확인하기

Anchor link to

프로젝트에서 더블 옵트인이 켜져 있으면 이메일을 제출한 방문자는 확인 이메일을 받고, 이메일의 링크를 클릭한 후에만 구독됩니다. 확인 링크는 24시간 동안 유효합니다. Pushwoosh는 방문자가 확인할 때 해당 이메일 주소에 대한 양식의 태그 값을 저장합니다.

  • 확인되지 않은 상태에서 방문자가 같은 캠페인에서 같은 주소를 다시 제출하면 Pushwoosh는 확인 이메일을 다시 보내며, 최대 5분에 한 번 보냅니다. 가장 최근 이메일의 링크만 작동합니다.
  • 프로젝트의 웹 캠페인을 통해 이미 확인된 주소는 추가 확인 이메일 없이 바로 구독됩니다. 잠재고객 → 구독 양식의 구독 양식을 통한 확인은 여기에 포함되지 않습니다.
  • 확인 이메일에는 인증된 발신 도메인이 필요합니다. 계정에 인증된 도메인이 없는 동안 Pushwoosh는 확인 이메일을 보내야 하는 모든 제출을 거부하며, 방문자는 Submit error text를 보게 됩니다.
  • 요금제에 이메일이 포함되어 있지 않으면 방문자가 링크를 클릭해도 주소가 구독되지 않고 확인되지 않은 상태로 남습니다. 이 실패는 캠페인의 실패한 제출에 표시되지 않습니다.

더블 옵트인은 프로젝트의 구독 양식과 웹 캠페인 양식에 공통으로 적용되는 하나의 설정입니다. 더블 옵트인으로 구독자 확인하기를 참조하세요.

양식 결과 추적하기

Anchor link to

캠페인 → 웹 캠페인에서 캠페인 통계를 열어 양식을 제출한 방문자 수와 제출 실패 이유를 확인하고 구독자를 내보냅니다.