【簡単設定】フォームのデータをWebflowと自動的に連携する方法

GoogleフォームのデータをWebflowに連携する

Googleフォームの回答データをWebflowに自動的に連携することができます。
Googleサービスを使用していれば無料で幅広いデータ形式のフォームが作れるため、気軽に連携を試してみたい方にぴったりです。

TypeformのデータをWebflowに連携する

Typeformの回答データをWebflowに自動的に連携することができます。
Typeformの直感的なフォーム操作とWebflowを連携することで、フォームの回答者、管理者ともにフォームの利用やデータ管理の体験が向上するでしょう。

‍

JotformのデータをWebflowに連携する

Jotformの回答データをWebflowに自動的に連携することができます。
Jotformの豊富なウィジェットで作成したフォームの回答データを余すことなくWebflowに連携することが可能です。

TallyのデータをWebflowに連携する

Tallyの回答データをWebflowに自動的に連携することができます。
シンプルなフォームのTallyもAPIを使うことで、Webflowにデータ連携することができます。ミニマルなフォームでもデータをしっかり管理したい方におすすめです。

Zoho FormsのデータをWebflowに連携する

Zoho Formsの回答データをWebflowに自動的に連携することができます。
Zohoサービスを使用している方に取って馴染み深いフォームですが、こちらもWebflowと連携して回答データの連携を実現できます。

Webflowとフォームの連携フローを作ってみよう

それでは、さっそく実際にWebflowとフォームの連携フローを作成してみましょう！
今回はYoomを使用して、ノーコードで設定を進めていきます。
もしまだYoomのアカウントをお持ちでない場合は、こちらの登録フォームからアカウントを発行しておきましょう。

[Yoomとは]

今回は「フォームの回答内容でWebflowのコレクションにアイテムを追加する」フローボットを作成していきます！
作成の流れは大きく分けて以下です。

• Webflowのマイアプリ登録
• テンプレートをコピーする
•  Yoomのフォームトリガーの設定およびWebflowのアクション設定
• トリガーをONに設定しフロー稼働の準備完了

ステップ1：Webflowのマイアプリ登録をしよう

フローボット作成前に、アプリをYoomと連携する作業を行います！
Yoomにログインしたら、マイアプリを選択し、新規接続をクリックしてください。

アプリ一覧はWebflowを選択します。
検索窓を活用すると見つけやすいです！

アカウント名は、「管理用」「プロジェクト名」など任意の名前を設定します。
アクセストークンはWebflowの管理画面からAPIトークンを取得し、設定してください。
取得方法は注釈を確認してください。

これでWebflowのマイアプリ登録ができました！

ステップ2：テンプレートコピーの話

次にYoomのサイトからテンプレートをコピーしましょう。
Yoomでは、テンプレートを使わずに一からフローボットを作成することも可能です！
ここではより簡単に設定するために、テンプレートを使用した設定手順をご紹介しましょう。
それでは下のバナーをクリックしてください。

「このテンプレートを試す」をクリックします。

「OK」をクリックしましょう。

これでテンプレートのコピーができました。
コピーしたテンプレートはマイプロジェクトに保存されています。

‍

ステップ3：Yoomのフォームトリガーを設定しよう

次にフローボットの設定に進みましょう！
先ほどコピーしたテンプレートの「Webflowアイテム追加フォーム」をクリックしてください。

まずはフォームを作成しましょう！

フォームを作成

以下のようにフォームの項目を設定しましょう。
次のWebflowのアクション設定時に必要な「タイトル」「Slug」を設定しましょう。

「質問を追加」から項目を増やすことが可能です。
設定ができたら、次へをクリックしてください。

フォームの表示確認と詳細設定

先ほどフォームで設定した項目の内容が表示されていると思います。
各項目にサンプル値を入力してください。
設定後、保存しましょう。

ステップ4：Webflowのアクションを設定しよう

最後の設定ステップです！
「コレクションにアイテムを追加」をクリックしましょう。

連携アカウントとアクションを選択

タイトルは事前に入力されていますが、変更OKです。
Webflowと連携するアカウント情報は、連携したいアカウントが紐付けられているか確認してください。
アクションは「コレクションにアイテムを追加」が設定されていることを確認し、次へをクリックしましょう。

API接続設定

サイトIDとコレクションIDは候補から選択してください。

フィールド情報を設定します。
フィールドは候補からTitle(Name)を選択してください。
値はフォームトリガーの取得した値からタイトルを選択します。
取得する値を活用せずに手入力した場合、同じ内容が繰り返しWebflowのコレクションに追加されることになりますので注意が必要です！
詳細はこちらを確認してください。

フィールドは候補からSlugを選択してください。
値はフォームトリガーの取得した値からSlugを選択しましょう。
すべて設定できたら、テストをクリックしてください。
Webflowのコレクションにアイテムが追加できたら保存してください。

保存後、「トリガーをON」にして動作をチェックしてください。

これでフローボットの設定ができました。

Webflowを使った便利な自動化例

今回紹介したフォームとの連携以外でもWebflowの情報をデータベースに追加したり、Webflowのフォームの送信データをSalesforceやHubspotに追加することも可能です。
このように、WebflowのAPIを使用してさまざまな業務を自動化することができるので、もし気になるものがあればぜひこちらもお試しになってみてください！

終わりに

フォームとWebflowを連携させることで、フォームから送信されたデータがWebflowのコレクションに自動的にアイテムとして追加されるようになるため、Webflowの管理画面にアクセスして手動でアイテムを作成するという一連のフローが手間が省けるでしょう！
つまり、パソコンが開けない状態でもスマホからフォームを送信するだけでアイテムの作成が可能になり、いつでもどこでもコンテンツを作成できるというメリットを感じられるはずです！

なお、Yoomを活用した自動化の設定はプログラミング不要で、初心者の方でも安心して始められます。
直感的な操作で高度な自動化を実現できるのは、Yoomならではの魅力です。このような自動化を導入したい場合は、今すぐYoomに登録しましょう！
無料アカウントを発行できるため、すぐに実際の操作性を確かめることが可能です！ぜひお試しください！