form | 在宅勤務.com

Airtableにデータを登録するフォームは、Airtable側だけでも作成可能です。 作成したテーブルに対して、Create a viewからFormを選択するだけです。 Open formとやることにより、URLがついた形のページができます。 しかし無料版の場合、以下ができません。 カバー画像がつけられないロゴをつけられないSubmitボタンの文言が変更できないAirtableのロゴを消せない Softr側で、フォームを作成して、Airtableに連携することによりサイトのテイストにあった フォームページが作成可能です。 やること Airtable側のAPIキーと対象とするテーブルのBase URLをチェックしておくSoftr側でFormのページを作成し、Airtableのカラム名と同じものを設定するSoftr側の送信ボタンの送り先をAirtableとして、Base URLを設定する 注意すること Softr側のフォームに用意されているものは以下しかないので、例えばDate型の連携はできません。EmailSingle line textLong TextUrlDropdownPhone numberFile Airtable側の確認 APIキーの確認 アカウントページにアクセスし、APIキーが生成されていない場合は、Generate API keyで生成する。 https://airtable.com/account Base URLの確認 以下に、アクセスし連携したいBaseを選択する。 https://airtable.com/api 表示されたページの左ナビから、対象のテーブル名のList recordsを選択する。 右側に、curlのタブが表示されるので、EXAMPLE REQUESTのcurlコマンドのurlの一部(?より前)を取得する。 https://api.airtable.com/v0/{BASE_ID}/{TABLE_NAME} Softr側での設定 フォームページを作成する 左ナビのPagesから、Add Pageをする。 Page NameとUrlを入力する。 ページ上に、BlockのForm =&gt; Sales Formを追加する。 以下のページができます。 フォームの設定をAirtable側のカラムに合わせて設定する。 各カラムは、以下のような設定になっており、Typeを選択、Tagには、Airtable側のカラム名と同じものをいれます。 また、必須項目については、Labelの右端の設定をクリックするとRequiredの設定ができます。 最後に送信フォームのボタンの設定で、Actionを"Send to airtable"にして、Base URLをセットします。 APIキーをセットする 左ナビから、Settingsを選択し、Integrationsを押します。 送信確認 Publishを押して、公開状態にして、実際にフォームに入力を行い、送信し、Airtable側にレコードができていることを確認してください。 もし、登録ができていなかったら、chromeなどのDevtoolsでエラーが出ていないか確認してください。 おそらく、jsのエラーメッセージが表示されています。

Softr + Airtableで、フォームのページを作成してAirtableにリンクする方法