お問い合わせフォームを置く

制作会社の方向け · 2026年10月26日更新

サイトにあるフォームの送り先を、ツギテにします。送られた内容は、メール・Slack・Google スプレッドシート・Notion・Webhook に届けます。入力欄の HTML は、今のサイトのものをそのまま使えます。

フォームを作る

「お問い合わせフォーム」→「フォームを追加」を押します。
「基本」を決めます。
- 名前(ツギテの中だけで使う):例「お問い合わせ」「採用の応募」。
- 受け付け:「受け付ける」にチェック。外すと受け付けを止めます。
- 送る前に確認画面を出す:新しいフォームでは入っています。
- 送ったあとに開くページ:例 /thanks.html。空にすると、フォームの場所に「送信しました。ありがとうございました。」と出します。
「迷惑な送信をふせぐ」の「受け付けるサイトのドメイン」を確かめます。サイトの URL から最初に入れてあります。カンマで区切って20件まで入れられます。
「保存する」を押します。

ほかのサイトに置かれたフォームからの送信は受け付けません。 ドメインはそのままの形で比べるので、www. のある・ないの両方で開けるサイトや、確かめ用のドメインがあるときは、どれも入れてください。サイトの URL をあとで変えても、受け付けるドメインは変わりません。

保存すると、フォームの設定に「サイトのフォームに入れるもの」が出ます。サイトの <form> を、この形に書き換えます。

script は、迷惑な送信をふせぐ確認(Cloudflare Turnstile)を追加し、送ったあとの表示を整えます。script がないと確認ができないので、受け付けません。

種類	届き方	入れるもの
メール	決めたアドレスに、内容をメールで送ります	宛先のメールアドレス
Slack	チャンネルに、内容を投稿します	Incoming Webhook の URL(`https://hooks.slack.com/services/…`)。作り方は画面の「Slack の URL の作り方」
Googleスプレッドシート	表の1行として追加します	「Google につなぐ」で許可し、新しいスプレッドシートを作るか、前にツギテが作ったものを選ぶ
Notion	データベースに1件として追加します	「Notion につなぐ」で、ツギテに使わせるページを選ぶ。その下にデータベースを作るか、前からあるデータベースを選ぶ
Webhook	決めた URL に、JSON で送ります	送り先の URL(https)。署名の鍵は、追加したあとに一度だけ出るので控える

送られた内容は、ツギテに残しません。 送信先に届けたら消します。

「送った人に自動返信のメールを送る」にチェックを入れ、次を決めます。

欄	中身
宛先にする項目	送った人のメールアドレスが入る項目の名前(例 `email`)
件名	例「お問い合わせを受け付けました」
本文	`{{項目の名前}}` にその項目の中身、`{{all}}` にすべての項目が入ります

返信の送り元はテナントの名前、返信先は送信先のメールです。

通知のメールや Slack で、項目の名前(name など)の代わりに出す名前です(例 name → 「お名前」)。

表の順に並び、表にない項目は名前のまま最後に出ます。確認画面の項目名にも使います。

確認画面や完了の文は、サイトの HTML で変えられます。

したいこと	書き方
確認画面をまるごと自分の形にする	フォームの中に `<template data-tsugite-confirm>` を置く。値は `data-tsugite-value="項目の名前"`、ボタンは `data-tsugite-back`・`data-tsugite-send`
空の項目の行を隠す	`data-tsugite-if="項目の名前"`
完了の中身を変える	フォームの中に `<template data-tsugite-done>` を置く
標準の文だけ変える	`<form>` に `data-tsugite-text-confirm`・`-back`・`-send`・`-sending`・`-done`・`-error` を付ける

見た目は、クラス名(tsugite-form__confirm・tsugite-form__done など)にサイトの CSS をつけて変えます。

採用情報の職種のページの「応募する」から、職種名を入れた状態でフォームを開けます。