# 사이트 빌더

> 임베드나 코드 블록처럼 커스텀 HTML을 붙여 넣을 수 있는 노코드 사이트 빌더에서 Ikiform을 사용하세요.

일반 폼 POST에는 스크립트가 필요 없으므로, 페이지에 실제 HTML `<form>`을 넣을 수 있는 곳이라면 어디서든 Ikiform이 작동합니다. 대부분의 사이트 빌더는 임베드, 코드, 커스텀 HTML 블록을 제공합니다. 여기에 폼을 붙여 넣고 `action`을 엔드포인트로 지정하세요.

## 빌더별 가이드

- [Webflow](https://ikiform.com/ko/docs/guides/webflow.md): 커스텀 action을 설정한 Form Block.
- [Framer](https://ikiform.com/ko/docs/guides/framer.md): 폼 웹훅 또는 코드 컴포넌트.
- [WordPress](https://ikiform.com/ko/docs/guides/wordpress.md): Custom HTML 블록 또는 쇼트코드.
- [Wix](https://ikiform.com/ko/docs/guides/wix.md): `fetch`로 POST하는 HTML 임베드.
- [Squarespace](https://ikiform.com/ko/docs/guides/squarespace.md): JavaScript를 쓰거나 쓰지 않는 코드 블록.
- [Carrd](https://ikiform.com/ko/docs/guides/carrd.md): URL로 보내는 커스텀 폼.

> 빌더가 HTML을 그대로 렌더링할 때만 작동합니다. 빌더 자체의 폼 위젯은 보통 빌더의 서버로 POST하므로, POST 메서드와 커스텀 action URL을 설정할 수 있을 때만 사용하세요.

## 임베드

`Custom HTML block`:

```html
<form action="https://ikiform.com/f/frm_xxxxxxxxxxxxxxxx" method="post" target="_top">
  <label>
    Email
    <input name="email" type="email" required />
  </label>
  <label>
    Message
    <textarea name="message"></textarea>
  </label>
  <input name="_gotcha" type="text" tabindex="-1" autocomplete="off" hidden />
  <button>Send</button>
</form>

<style>
  form { display: grid; gap: 12px; max-width: 420px; font: inherit; }
  label { display: grid; gap: 4px; }
  input, textarea { font: inherit; padding: 8px 10px; border: 1px solid #d4d4d4; border-radius: 6px; }
  button { font: inherit; padding: 8px 14px; border-radius: 6px; border: 0; background: #111; color: #fff; }
</style>
```

- 빌더는 커스텀 코드를 iframe 안에 넣는 경우가 많습니다. Ikiform의 감사, 오류, 확인 페이지는 프레임 안에서 열리지 않으므로, `target="_top"`으로 결과를 전체 창에서 엽니다. Wix처럼 빌더의 프레임이 최상위 이동을 허용하지 않으면 대신 `fetch`로 POST하세요. [Wix](https://ikiform.com/ko/docs/guides/wix.md)를 참고하세요.
- 폼의 **Redirect after submit**을 설정해 방문자를 여러분 사이트의 감사 페이지로 돌려보내세요.
- 블록 안의 스타일은 사이트의 스타일을 상속하지 않을 수 있습니다. 위의 `<style>`이 폼의 깔끔한 출발점이 됩니다.

## 허용 도메인

허용 도메인을 설정한다면 사이트가 제공되는 모든 주소를 등록하세요. 커스텀 도메인과 빌더의 미리보기 또는 스테이징 도메인이 모두 포함됩니다. 등록되지 않은 도메인에서 온 POST는 기본적으로 스팸으로 저장되며, 대시보드에 `origin_mismatch` 사유가 표시됩니다.

일부 빌더는 `Origin`이 `null`인 프레임에서 임베드를 렌더링합니다. 이 경우 Ikiform은 `Referer`를 대신 사용합니다. 빌더가 둘 다 제거하면 POST를 도메인과 연결할 수 없으니, 해당 폼의 허용 도메인을 비워 두거나 불일치 정책을 거부 대신 스팸으로 설정하세요.

## 사람 확인

**Ikiform** 사람 확인은 폼이 일반적으로 POST될 때 추가 코드 없이 작동합니다. 브라우저가 ikiform.com의 짧은 확인 페이지로 이동하고, 이 페이지가 POST를 이어서 보냅니다. 최상위 이동을 막는 프레임이나 `fetch`로 POST하는 코드에서는 실행할 수 없습니다. 빌더에서는 Cloudflare 스크립트가 페이지에 있어야 하므로 **Your own Turnstile keys**를 피하세요.
