# 구독 양식 생성 및 삽입

Pushwoosh는 다양한 가입 시나리오에 맞는 구독 양식을 만들고, 수집할 필드를 사용자 정의하며, 웹사이트에 모달 또는 인라인 위젯으로 양식을 표시할 수 있는 유연성을 제공합니다.

## 양식 만드는 방법

새 구독 양식을 만들려면:

1. **Audience → Subscription forms**(잠재고객 → 구독 양식)로 이동합니다.
2. **Create form**(양식 생성)을 클릭합니다.

<img src="/subscription-forms-1.webp" alt="이중 옵트인 및 구독 양식 카드가 있는 구독 양식 페이지, 사용 방법 링크 및 양식 생성 버튼"/>  
3. 양식을 구성합니다. 오른쪽에는 실시간 미리보기가 나타나며 설정을 변경하면 업데이트됩니다. 

### 일반 설정 구성

다음 필드를 구성합니다.

> **이 섹션의 모든 필드는 필수입니다.**

- **Internal form name(내부 양식 이름):** Pushwoosh 내부에서만 사용되며 구독자에게는 표시되지 않습니다. 예: "뉴스레터 가입".
- **Display type(표시 유형):** 사이트에 양식이 표시되는 방식을 선택합니다:
  - **Modal popup(모달 팝업):** 설정한 **Trigger**(트리거)가 실행될 때 페이지 상단에 나타나는 팝업 오버레이입니다. 예를 들어 **Immediately**(즉시) 또는 몇 초 후에 표시됩니다([모달 팝업 타이밍 설정](#set-modal-popup-timing) 참조). 방문자가 주목하기를 원하는 뉴스레터 가입이나 프로모션 제안에 적합합니다.
  - **Embedded inline(인라인 삽입):** 양식이 페이지 콘텐츠 내(예: 사이드바 또는 기사 하단)에 위치합니다. 방문자는 별도의 팝업이 아닌 페이지 레이아웃의 일부로 보게 됩니다.
- **Privacy policy URL(개인정보처리방침 URL):** 양식에는 이 URL로 연결되는 동의 확인란("개인정보처리방침에 동의합니다")이 표시됩니다. 예: `https://example.com/policy`.


<img src="/subscription-forms-2.webp" alt="내부 양식 이름, 표시 유형, 개인정보처리방침 URL 및 양식 필드 구성이 있는 구독 양식 생성 인터페이스"/>


#### 모달 팝업 타이밍 설정

**모달 팝업**에만 해당됩니다:

1. 페이지에 팝업이 나타나는 시점을 정의합니다. **Trigger**(트리거) 드롭다운에서 다음을 선택합니다:
  - **Immediately**(즉시) (기본값)
  - 3초 후
  - 5초 후
  - 10초 후
2. **Frequency**(빈도) 드롭다운에서 각 방문자가 팝업을 얼마나 자주 볼지 선택합니다:
  - **Once per visitor**(방문자당 한 번) (기본값): 기기당 한 번
  - **Once per session**(세션당 한 번): 브라우저 세션당 한 번
  - **Always**(항상): 페이지를 방문할 때마다

<img src="/subscription-forms-3.webp" alt="모달 팝업 표시 유형, 트리거 및 빈도 드롭다운, 필드 추가 버튼이 있는 구독 양식 생성"/> 

### 양식 필드 구성

각 양식에는 기본적으로 **Email**(이메일) 필드가 포함됩니다(제거할 수 없음). 최대 4개의 필드를 추가하여 총 5개의 필드를 만들 수 있습니다. 

**+ First name**(이름), **+ Last name**(성), **+ Phone number**(전화번호) 또는 **+ Custom field**(사용자 정의 필드)를 클릭하여 추가합니다. 

<Aside type="note">
이러한 내장 필드의 값은 표준 태그인 `first_name`, `last_name`, `phone`에 저장됩니다. 사용자 정의 필드는 **Linked tag**(연결된 태그) 설정에서 선택한 태그에 값을 저장합니다.
</Aside>

각 필드에 대해 방문자가 반드시 입력해야 하는 경우 **Required**(필수)를 선택합니다(필수 필드에는 별표 `*`가 표시됨). 필드를 제거하려면 휴지통 아이콘을 사용합니다.

<img src="/subscription-forms-4.webp" alt="이메일, 이름, 전화번호, 성, 도시가 포함된 양식 필드 목록 및 선택된 필드에 대한 필드 구성"/>

#### 사용자 정의 필드 생성

1. 필드 목록에서 **+ Custom field**(사용자 정의 필드)를 클릭합니다.
2. **Linked tag**(연결된 태그) 아래에서 이 필드에서 제출된 값을 저장할 Pushwoosh 태그를 선택합니다(예: `birthday`). 태그를 미리 만들어야 합니다.
3. **Field label**(필드 레이블) 설정: 방문자가 입력란 옆에 보게 될 텍스트입니다(예: `생년월일`).
4. 선택적으로 **Placeholder (optional)**(플레이스홀더(선택 사항)) 설정: 빈 필드 안에 표시되는 힌트 텍스트입니다(예: `MM/DD/YYYY`).
5. **Required**(필수)를 켜거나 끕니다. 

<img src="/subscription-forms-7.webp" alt="연결된 태그, 필드 레이블, 플레이스홀더 및 필수 확인란이 있는 사용자 정의 필드 구성"/>

### 양식 레이블 사용자 정의

기본적으로 모든 양식 텍스트는 영어입니다. 양식을 다른 언어로 번역하거나 문구를 변경하려면 실시간 미리보기 아래의 **Customize labels**(레이블 사용자 정의)를 클릭합니다.

<img src="/subscription-forms-16.webp" alt="제목, 버튼, 개인정보처리방침 텍스트, 개인정보처리방침 링크 텍스트, 성공 메시지, 이중 옵트인 메시지, 이메일 레이블 및 이메일 플레이스홀더 필드가 있는 양식 레이블 사용자 정의 대화상자"/>

**Customize form labels**(양식 레이블 사용자 정의) 대화상자에서 다음을 편집할 수 있습니다:

- **Heading**(제목)
- **Button**(버튼)
- **Privacy Policy Text**(개인정보처리방침 텍스트)
- **Privacy Policy Link Text**(개인정보처리방침 링크 텍스트)
- **Success Message**(성공 메시지)
- **Double Opt In Message**(이중 옵트인 메시지) (이중 옵트인이 활성화된 경우에만 적용됨)
- 각 양식 필드에 대한 **Label**(레이블) 및 선택적 **Placeholder**(플레이스홀더)

**Save**(저장)를 클릭하여 변경 사항을 적용합니다. 변경 사항은 실시간 미리보기에 즉시 나타납니다. 게시된 양식은 구독 양식을 저장하거나 게시한 후에 업데이트됩니다.

### 양식 미리보기 및 저장

구독 양식 생성 인터페이스의 오른쪽에 실시간 미리보기가 나타나며 설정을 변경하면 업데이트됩니다. 미리보기 아래의 **Reset preview**(미리보기 재설정)를 사용하여 기본 미리보기 상태로 복원할 수 있습니다.

<Aside type="note">
**미리보기**에서의 테스트 제출은 프로젝트에 구독자를 생성하지 않습니다.
</Aside>

<img src="/subscription-forms-5.webp" alt="오른쪽에 실시간 미리보기가 있고, 미리보기 재설정 및 오른쪽 상단에 생성 버튼이 있는 구독 양식 생성"/>

양식 구성을 마치면 오른쪽 상단의 **Create**(생성)를 클릭합니다.

### 삽입 코드 복사 및 사이트에 추가

<Aside type="caution" icon="setting" title="개발자 지원 필요">
웹사이트에 삽입 코드를 추가하려면 개발팀의 도움이 필요합니다.
</Aside>

양식에 대한 삽입 코드가 포함된 대화상자가 열립니다. **Copy code**(코드 복사)를 클릭하여 스니펫을 클립보드에 복사합니다.

<img src="/subscription-forms-11.webp" alt="스크립트 스니펫, 닫는 body 태그 앞에 붙여넣기 지침 및 코드 복사 버튼이 있는 모달 양식 코드 대화상자"/>

#### 웹사이트에 삽입 코드를 붙여넣을 위치

스크립트를 실행해야 하는 페이지 HTML에 추가합니다.

- **모달 팝업**의 경우, 닫는 `</body>` 태그 앞에 스크립트를 배치하는 것이 일반적인 방법입니다.

- **인라인 삽입**의 경우, 양식 블록이 나타나기를 원하는 마크업의 정확한 위치에 스니펫을 넣습니다.

<Aside type="tip" title="CSS로 위젯 사용자 정의">
`pushwoosh-subscribe-widget` 요소에 CSS 사용자 정의 속성을 설정하여 사이트의 기본 스타일(색상, 타이포그래피, 간격 및 모달)을 재정의할 수 있습니다. [자세히 알아보기](/ko/product/audience-data-and-segmentation/subscription-forms/customize-widget/).
</Aside>

### 웹사이트에서 다른 표시 유형이 어떻게 보이는지

이 예제들은 각 양식 유형이 실제 페이지에 어떻게 나타날 수 있는지 보여줍니다. 필드 레이블과 필수 표시는 양식 빌더에서 구성한 것과 일치합니다.

<Tabs>
<TabItem label="모달 팝업">

<img src="/subscription-forms-14.webp" alt="이메일, 이름, 전화번호 필드, 개인정보처리방침 확인란 및 구독 버튼이 있는 웹페이지의 모달 뉴스레터 가입 오버레이"/>

</TabItem>
<TabItem label="인라인 삽입">

<img src="/subscription-forms-15.webp" alt="이메일, 이름, 전화번호 필드, 개인정보처리방침 확인란 및 구독 버튼이 있는 페이지 본문의 인라인 뉴스레터 가입 양식"/>

</TabItem>
</Tabs>

## 다음 단계

- [이중 옵트인 활성화](/ko/product/audience-data-and-segmentation/subscription-forms/double-opt-in/)하여 구독자가 추가되기 전에 이메일 확인을 요구합니다.
- [구독 양식 위젯 사용자 정의](/ko/product/audience-data-and-segmentation/subscription-forms/customize-widget/)하여 양식을 웹사이트에 맞게 조정합니다.
- [양식 성능 검토 및 구독자 내보내기](/ko/product/audience-data-and-segmentation/subscription-forms/form-analytics-and-export/)하여 결과를 추적하고 구독자 데이터를 다운로드합니다.