# サイトビルダー

> 埋め込みやコードブロックなど、カスタム HTML を貼り付けられるノーコードのサイトビルダーから Ikiform を使います。

プレーンなフォームの送信にスクリプトは不要なので、ページに本物の HTML の `<form>` を置ける場所ならどこでも Ikiform が使えます。ほとんどのサイトビルダーには、埋め込み、コード、カスタム HTML のブロックがあります。そこにフォームを貼り付け、`action` をエンドポイントに向けてください。

## ビルダー別ガイド

- [Webflow](https://ikiform.com/ja/docs/guides/webflow.md): 独自の action を設定した Form Block。
- [Framer](https://ikiform.com/ja/docs/guides/framer.md): フォームの Webhook、またはコードコンポーネント。
- [WordPress](https://ikiform.com/ja/docs/guides/wordpress.md): カスタム HTML ブロック、またはショートコード。
- [Wix](https://ikiform.com/ja/docs/guides/wix.md): `fetch` で送信する HTML 埋め込み。
- [Squarespace](https://ikiform.com/ja/docs/guides/squarespace.md): コードブロック。JavaScript ありでもなしでも。
- [Carrd](https://ikiform.com/ja/docs/guides/carrd.md): URL に送信するカスタムフォーム。

> これが使えるのは、ビルダーが HTML をそのまま描画する場合だけです。ビルダー独自のフォームウィジェットは、たいていビルダーのサーバーに送信します。使うのは、POST メソッドで独自の action URL を設定できる場合だけにしてください。

## 埋め込み

`カスタム HTML ブロック`:

```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` で送信してください。[Wix](https://ikiform.com/ja/docs/guides/wix.md) を参照してください。
- フォームに **Redirect after submit**（送信後のリダイレクト）を設定すると、送信した人をサイトのサンクスページに戻せます。
- ブロック内のスタイルはサイトのスタイルを継承しないことがあります。上の `<style>` で、フォームの見た目をまっさらな状態から整えられます。

## 許可ドメイン

許可ドメインを設定する場合は、サイトを配信するすべてのアドレスを登録してください。独自ドメインと、ビルダーのプレビューやステージングのドメインです。登録されていないドメインからの送信は、デフォルトでスパムとして保存され、ダッシュボードに理由 `origin_mismatch` が表示されます。

ビルダーによっては、`Origin` が `null` のフレームで埋め込みを描画します。その場合、Ikiform は `Referer` を代わりに使います。ビルダーが両方を削除すると、送信をドメインと照合できません。そのフォームでは許可ドメインを空にするか、不一致時のポリシーを拒否ではなくスパムにしてください。

## 人間確認

**Ikiform** の人間確認は、フォームが通常どおり送信される場合、追加のコードなしで動きます。ブラウザーが ikiform.com の短い確認ページに移動し、そのページが送信を引き継ぎます。トップレベルのページ遷移をブロックするフレームや、`fetch` で送信するコードからは動きません。**Your own Turnstile keys**（独自の Turnstile キー）はページに Cloudflare のスクリプトが必要になるため、ビルダーでは避けてください。