# 입력폼 블럭 다루기

입력폼 블럭은 접수, 설문 등을 위해 입력 항목을 설정하고 사용자에게 입력 폼을 제공하는 기능의 블럭입니다.

입력받은 정보는 메일 및 관리자페이지의 콘텐츠 관리메뉴에서 확인이 가능합니다.

입력폼 블럭은 일반 폼, 이미지와 같이 있는 폼, 커스텀 입력폼을 제공합니다.

입력폼 블럭 사용에 대한 자세한 내용은 아래 안내를 참고해 주시기 바랍니다.

[https://docs.dothome.co.kr/books/09/page/15d4e](https://docs.dothome.co.kr/books/09/page/15d4e)

<div id="bkmrk--1">  
</div>입력폼의 기능, 디자인을 설정합니다.

접수된 입력폼 데이터 관리는 [<span style="color: #286aef;">**입력폼 관리하기** &gt;</span>](https://docs.dothome.co.kr/books/04/page/c20ad) 를 참고해 주세요.

**● 입력폼 추가하기**

[![inputform_block_01.png](https://docs.dothome.co.kr/uploads/images/gallery/2025-11/scaled-1680-/inputform-block-01.png)](https://docs.dothome.co.kr/uploads/images/gallery/2025-11/inputform-block-01.png)

<span style="color: rgb(22, 145, 121);">\[입력폼 추가 화면\]</span>

블럭 추가 창에서 \[입력폼\]탭을 누르면 입력폼 블럭 목록이 나옵니다.

원하는 디자인의 입력폼 블럭을 추가해 주세요.

커스텀 입력폼은 입력폼 영역 좌측 또는 우측에 원하는 요소 블럭을 추가할 수 있는 블럭입니다.

**● 입력폼 상세 설정하기**

[![inputform_block_02.png](https://docs.dothome.co.kr/uploads/images/gallery/2025-11/scaled-1680-/inputform-block-02.png)](https://docs.dothome.co.kr/uploads/images/gallery/2025-11/inputform-block-02.png)

<span style="color: rgb(22, 145, 121);">\[입력폼 설정 버튼 화면\]</span>

  
입력폼 블럭 위에 마우스를 올리면 우측 상단에 블럭 편집 메뉴가 표시됩니다.

가운데에 있는 \[설정(톱니 바퀴 모양)\] 버튼을 클릭하여 상세 설정 창을 열어줍니다.

[![inputform_block_03.png](https://docs.dothome.co.kr/uploads/images/gallery/2025-11/scaled-1680-/inputform-block-03.png)](https://docs.dothome.co.kr/uploads/images/gallery/2025-11/inputform-block-03.png)

<span style="color: rgb(22, 145, 121);">\[입력폼 상세설정 화면\]</span>

입력폼 블럭의 상세 설정창은 내용, 디자인, 레이아웃, 배경 네개의 탭메뉴로 구성되어 있습니다.

각 설정 항목에 대해 알아보겠습니다.

**● 기본**

[![inputform_block_04.png](https://docs.dothome.co.kr/uploads/images/gallery/2025-11/scaled-1680-/inputform-block-04.png)](https://docs.dothome.co.kr/uploads/images/gallery/2025-11/inputform-block-04.png)

<span style="color: rgb(22, 145, 121);">\[입력폼 상세설정 - 내용 설정 화면\]</span>

<table class="table table-bordered" id="bkmrk-%ED%95%AD%EB%AA%A9-%EB%82%B4%EC%9A%A9-%EC%9E%85%EB%A0%A5%ED%8F%BC-%ED%95%AD%EB%AA%A9-%EC%9E%85%EB%A0%A5%ED%8F%BC-%ED%95%AD%EB%AA%A9%EC%9D%84" style="width: 100%; height: 456.108px;"><thead><tr style="height: 41.6903px;"><td style="width: 25.5033%; height: 41.6903px;">항목

</td><td style="width: 74.4859%; height: 41.6903px;">내용

</td></tr></thead><tbody><tr style="height: 41.6903px;"><td style="width: 25.5033%; height: 41.6903px;">입력폼 항목  
</td><td style="width: 74.4859%; height: 41.6903px;">입력폼 항목을 편집하거나 추가할 수 있습니다.  
</td></tr><tr style="height: 41.6903px;"><td style="width: 25.5033%; height: 41.6903px;">폼 제목  
</td><td style="width: 74.4859%; height: 41.6903px;">관리자 페이지에 표시해줄 입력폼 제목을 입력합니다.  
</td></tr><tr style="height: 41.6903px;"><td style="width: 25.5033%; height: 41.6903px;">수신 메일  
</td><td style="width: 74.4859%; height: 41.6903px;">입력폼 작성시 알림을 받을 메일을 입력해주세요  
</td></tr><tr style="height: 58.4943px;"><td style="width: 25.5033%; height: 58.4943px;">권한

</td><td style="width: 74.4859%; height: 58.4943px;"><span style="color: #000000;">입력폼 작성 권한을 설정할 수 있습니다.</span>  
<span style="color: #424242;">\*모든 방문자 선택 시 구글 캡챠를 사용해주시길 바랍니다.</span></td></tr><tr style="height: 47.2869px;"><td style="width: 25.5033%; height: 47.2869px;">CAPTCHA 사용하기</td><td style="width: 74.4859%; height: 47.2869px;">구글 캡챠 설정이 가능하며, 구글 캡챠 연동 후 사용이 가능합니다. **[<span style="color: #3c99f6;">구글 캡챠 연동하기&gt;</span>](https://docs.dothome.co.kr/books/02/page/63dc7)**  
</td></tr><tr style="height: 41.6903px;"><td style="width: 25.5033%; height: 41.6903px;">작성 완료 메세지 사용하기  
</td><td style="width: 74.4859%; height: 41.6903px;">입력폼 작성 완료 시 보여줄 완료 메세지를 설정할 수 있습니다.  
</td></tr><tr style="height: 58.4943px;"><td style="width: 25.5033%; height: 58.4943px;">작성 완료 후 페이지 이동 사용하기  
</td><td style="width: 74.4859%; height: 58.4943px;">입력폼 작성 완료 후 특정 페이지로 이동시킬 수 있습니다.  
</td></tr><tr style="height: 41.6903px;"><td style="width: 25.5033%; height: 41.6903px;">약관 동의 사용하기  
</td><td style="width: 74.4859%; height: 41.6903px;">약관 동의 시에만 입력폼이 접수되도록 설정할 수 있습니다.  
</td></tr><tr style="height: 41.6903px;"><td style="width: 25.5033%; height: 41.6903px;">접수 기간 지정하기  
</td><td style="width: 74.4859%; height: 41.6903px;">선택한 기간 내에만 입력폼이 접수되도록 설정할 수 있습니다.  
</td></tr></tbody></table>

**● 디자인**

[![inputform_block_05.png](https://docs.dothome.co.kr/uploads/images/gallery/2025-11/scaled-1680-/inputform-block-05.png)](https://docs.dothome.co.kr/uploads/images/gallery/2025-11/inputform-block-05.png)

<span style="color: rgb(22, 145, 121);">\[입력폼 상세설정 - 디자인 설정 화면\]</span>

<table class="table table-bordered" id="bkmrk-%ED%95%AD%EB%AA%A9-%EC%84%A4%EB%AA%85-%EC%9E%85%EB%A0%A5%ED%8F%BC-%EC%9E%85%EB%A0%A5%ED%8F%BC-%ED%95%AD%EB%AA%A9%2C-%EC%84%A4%EB%AA%85" style="width: 100%;"><thead><tr><td style="width: 21.215%;"><span style="color: #000000;">항목  
</span></td><td style="width: 78.7742%;"><span style="color: #000000;">설명  
</span></td></tr></thead><tbody><tr><td style="width: 21.215%;"><span style="color: #000000;">입력폼  
</span></td><td style="width: 78.7742%;"><span style="color: #000000;">입력폼 항목, 설명에 대한 글자 크기, 색상을 설정합니다.  
</span></td></tr><tr><td style="width: 21.215%;"><span style="color: #000000;">버튼  
</span></td><td style="width: 78.7742%;"><span style="color: #000000;">작성하기 버튼의 디자인을 설정합니다.</span>  
</td></tr></tbody></table>

**● 레이아웃**

[![inputform_block_06.png](https://docs.dothome.co.kr/uploads/images/gallery/2025-11/scaled-1680-/inputform-block-06.png)](https://docs.dothome.co.kr/uploads/images/gallery/2025-11/inputform-block-06.png)

<span style="color: rgb(22, 145, 121);">\[입력폼 상세설정 - 레이아웃 설정 화면\]</span>

<table class="table table-bordered" id="bkmrk-%ED%95%AD%EB%AA%A9-%EC%84%A4%EB%AA%85-%EC%A2%8C%EC%9A%B0-%EC%97%AC%EB%B0%B1-%EB%B8%94%EB%9F%AD%EC%9D%98-%EC%A2%8C%EC%9A%B0-%EC%97%AC" style="width: 100%;"><thead><tr><td style="width: 20.8587%;"><span style="color: #000000;">항목  
</span></td><td style="width: 79.1304%;"><span style="color: #000000;">설명  
</span></td></tr></thead><tbody><tr><td style="width: 20.8587%;"><span style="color: #000000;">좌우 여백  
</span></td><td style="width: 79.1304%;"><span style="color: #000000;">블럭의 좌우 여백을 설정합니다.  
</span></td></tr><tr><td style="width: 20.8587%;"><span style="color: #000000;">상단 여백  
</span></td><td style="width: 79.1304%;"><span style="color: #000000;">블럭 상단의 여백을 설정합니다.  
</span></td></tr><tr><td style="width: 20.8587%;"><span style="color: #000000;">하단 여백  
</span></td><td style="width: 79.1304%;"><span style="color: #000000;">블럭 하단의 여백을 설정합니다.  
</span></td></tr><tr><td style="width: 20.8587%;"><span style="color: #000000;">정렬  
</span></td><td style="width: 79.1304%;"><span style="color: #000000;">텍스트, 버튼의 정렬을 설정합니다.</span>  
</td></tr></tbody></table>

**● 배경**

[![inputform_block_07.png](https://docs.dothome.co.kr/uploads/images/gallery/2025-11/scaled-1680-/inputform-block-07.png)](https://docs.dothome.co.kr/uploads/images/gallery/2025-11/inputform-block-07.png)

<span style="color: rgb(22, 145, 121);">\[입력폼 상세설정 - 배경 설정 화면\]</span>

블럭에 대한 배경을 설정합니다. 색 또는 이미지로 설정할 수 있습니다.

**● 입력폼 항목 편집하기**

[![inputform_block_08.png](https://docs.dothome.co.kr/uploads/images/gallery/2025-11/scaled-1680-/inputform-block-08.png)](https://docs.dothome.co.kr/uploads/images/gallery/2025-11/inputform-block-08.png)

<span style="color: rgb(22, 145, 121);">\[입력폼 항목 수정 버튼 화면\]</span>

입력폼 항목 우측의 편집 버튼을 통해 수정할 수 있습니다.

[![inputform_block_09.png](https://docs.dothome.co.kr/uploads/images/gallery/2025-11/scaled-1680-/inputform-block-09.png)](https://docs.dothome.co.kr/uploads/images/gallery/2025-11/inputform-block-09.png)

<span style="color: rgb(22, 145, 121);">\[입력폼 항목 편집 화면\]</span>

<table class="table table-bordered" id="bkmrk-%ED%95%AD%EB%AA%A9-%EC%84%A4%EB%AA%85-%EC%A0%9C%EB%AA%A9-%EC%9E%85%EB%A0%A5-%ED%95%AD%EB%AA%A9%EC%9D%98-%EC%A0%9C%EB%AA%A9%EC%9D%84-" style="width: 100%;"><thead><tr><td style="width: 20.8569%;">항목  
</td><td style="width: 79.1322%;">설명  
</td></tr></thead><tbody><tr><td style="width: 20.8569%;">제목  
</td><td style="width: 79.1322%;">입력 항목의 제목을 입력해주세요.  
</td></tr><tr><td style="width: 20.8569%;">설명  
</td><td style="width: 79.1322%;">입력 항목에 대한 설명이 필요한 경우 입력해주세요.  
</td></tr><tr><td style="width: 20.8569%;">필수 입력  
</td><td style="width: 79.1322%;">체크시 해당 입력 항목이 필수 입력 항목으로 설정됩니다.  
</td></tr><tr><td style="width: 20.8569%;">입력 형식  
</td><td style="width: 79.1322%;">입력 형식을 선택합니다.

- 단문형 : 한 줄 정도의 간단한 답변을 입력 받을 때 적합합니다.
- 장문형 : 여러 줄 이상의 내용을 입력 받을 때 적합합니다.
- 단일 선택형 : 옵션이 라디오 버튼으로 표시되어 하나의 옵션만 선택할 수 있습니다.
- 다중 선택형 : 옵션이 체크 박스로 표시되어 여러개의 옵션을 다중 선택할 수 있습니다.
- 목록 선택형 : 셀렉트 박스로 표시되어 하나의 옵션만 선택할 수 있습니다.
- 날짜 : 날짜 선택 기능을 통해 날짜를 입력받을 수 있습니다.
- 주소 : 주소 검색 기능을 통해 주소를 입력받을 수 있습니다.
- 전화번호 : 전화번호 양식에 맞게 전화번호를 입력받을 수 있습니다.
- 이메일 : 이메일 양식에 맞게 이메일을 입력받을 수 있습니다.
- 파일 업로드 : 파일 선택기를 통해 파일을 업로드할 수 있습니다.

</td></tr><tr><td style="width: 20.8569%;">옵션  
</td><td style="width: 79.1322%;">단일 선택형, 다중 선택형, 목록 선택형의 옵션을 편집할 수 있습니다.  
</td></tr></tbody></table>

각 항목을 입력한 뒤 적용하기를 눌러줍니다.

블럭 상세 설정 창 하단의 \[적용하기\] 버튼을 눌러주어야 최종 적용됩니다.

**● 커스텀 입력폼 블럭 요소 블럭 추가 및 편집하기**

[![inputform_block_10.png](https://docs.dothome.co.kr/uploads/images/gallery/2025-11/scaled-1680-/inputform-block-10.png)](https://docs.dothome.co.kr/uploads/images/gallery/2025-11/inputform-block-10.png)

<span style="color: rgb(22, 145, 121);">\[커스텀 입력폼 요소 블럭 추가 화면\]</span>

빈 플레임 영역에 요소 블럭을 추가, 삭제할 수 있습니다.

[![inputform_block_11.png](https://docs.dothome.co.kr/uploads/images/gallery/2025-11/scaled-1680-/inputform-block-11.png)](https://docs.dothome.co.kr/uploads/images/gallery/2025-11/inputform-block-11.png)

<span style="color: rgb(22, 145, 121);">\[커스텀 입력폼 요소블럭 추가된 화면\]</span>

추가된 요소의 위치를 이동하거나 상세 설정을 할 수 있습니다.

요소 블럭의 편집 방법은 각 매뉴얼에서 확인하세요

**[<span style="color: #4c7ff2;">요소 블럭 다루기&gt;</span>](https://docs.dothome.co.kr/books/10)**