【ノーコードで実現】WebflowのフォームとEメールマーケティングツールを自動連携する方法

Webflowで作成したサイトのフォームから新しいリード情報を獲得した際、その情報を手作業でMailchimpやSendGridなどのEメールマーケティングツールに登録する作業に時間を取られていませんか？
この手作業によるデータ移行は、入力ミスを引き起こすリスクがあるだけでなく、リード獲得からアプローチまでのタイムラグを生じさせ、機会損失に繋がる可能性があります。

もし、Webflowのフォームが送信されたタイミングで、自動的にEメールマーケティングツールのコンタクトリストに顧客情報が追加される仕組みがあれば、これらの悩みから解放され、より効果的なマーケティング活動を展開し、戦略立案やコンテンツ作成といったコア業務に集中する時間を生み出すことができます！

今回ご紹介する自動化の設定は、ノーコードで簡単に設定できて、手間や時間もかからないので、ぜひ自動化を導入して作業をもっと楽にしましょう！

とにかく早く試したい方へ

YoomにはWebflowのフォームで獲得した顧客情報を活用する業務フロー自動化のテンプレートが用意されているので、「まずは試してみたい！」という方は、以下のバナーをクリックして、すぐに自動化を体験してみましょう！

Webflowでフォームが送信されたら、Mailchimpでコンタクトをオーディエンスに追加する

試してみる

---

■概要
Webflowで作成したフォームから獲得したリード情報を、手作業でMailchimpに登録していませんか？この作業は手間がかかるだけでなく、転記ミスなどのヒューマンエラーが発生する可能性もあります。このワークフローを活用すれば、Webflowのフォーム送信をトリガーにして、Mailchimpへ自動でコンタクトを追加できます。Webflowと連携したEmailマーケティングのプロセスを効率化し、顧客へのアプローチを迅速に開始することが可能です。

■このテンプレートをおすすめする方
・Webflowのフォームで獲得したリードを手作業でMailchimpに登録している方
・Webflowと連携したEmailマーケティングの初動を自動化し、効率化したいと考えている方
・リード獲得から顧客へのアプローチまでの時間を短縮したいマーケティング担当者の方

■注意事項
・Webflow、MailchimpのそれぞれとYoomを連携してください。
・Webflowの内容を取得する方法は下記を参照ください。
https://intercom.help/yoom/ja/articles/5404443

詳細を見る 試してみる

WebflowとMailchimpを連携するフローを作ってみよう

それではここから代表的な例として、Webflowでフォームが送信されたら、Mailchimpでコンタクトをオーディエンスに自動で追加するフローを解説していきます！

ここではYoomを使用してノーコードで設定をしていくので、もしまだYoomのアカウントをお持ちでない場合は、下の無料登録フォームからアカウントを発行しておきましょう。

30秒で簡単登録！無料で始める

※今回連携するアプリの公式サイト：Webflow／Mailchimp

[Yoomとは]

フローの作成方法

今回は大きく分けて以下のプロセスで作成します。

• WebflowとMailchimpをマイアプリに連携する
• テンプレートをコピーする
• Webflowのトリガー設定とMailchimpの設定
• トリガーをONに設定しフロー稼働の準備完了

Webflowでフォームが送信されたら、Mailchimpでコンタクトをオーディエンスに追加する

試してみる

---

■概要
Webflowで作成したフォームから獲得したリード情報を、手作業でMailchimpに登録していませんか？この作業は手間がかかるだけでなく、転記ミスなどのヒューマンエラーが発生する可能性もあります。このワークフローを活用すれば、Webflowのフォーム送信をトリガーにして、Mailchimpへ自動でコンタクトを追加できます。Webflowと連携したEmailマーケティングのプロセスを効率化し、顧客へのアプローチを迅速に開始することが可能です。

■このテンプレートをおすすめする方
・Webflowのフォームで獲得したリードを手作業でMailchimpに登録している方
・Webflowと連携したEmailマーケティングの初動を自動化し、効率化したいと考えている方
・リード獲得から顧客へのアプローチまでの時間を短縮したいマーケティング担当者の方

■注意事項
・Webflow、MailchimpのそれぞれとYoomを連携してください。
・Webflowの内容を取得する方法は下記を参照ください。
https://intercom.help/yoom/ja/articles/5404443

詳細を見る 試してみる

ステップ1：WebflowとMailchimpをマイアプリに連携する

ここでは、Yoomとそれぞれのアプリを連携して、操作が行えるようにしていきます。

まずはMailchimpの設定方法を解説しているナビを操作しながらマイアプリに登録してみましょう！

• Mailchimpのマイアプリ登録方法

• Webflowのマイアプリ登録方法

続いてWebflowは、下の画像を見ながら一緒に登録していきましょう！

(1)Yoomにログイン後、左欄にある「マイアプリ」を選択し「＋新規接続」をクリックしてください。
マイアプリの新規接続一覧の中から、Webflowをクリックします。

(2)「Webflowの新規登録」画面から赤枠を確認の上、アカウント名、アクセストークンを入力し「追加」をクリックします。

これでマイアプリ登録が完了しました。
次は、テンプレートを使用してトリガーの設定をしましょう！

ステップ2：テンプレートをコピーする

ここから、フローの作成に入ります！
Yoomのテンプレートを利用することで簡単に業務の自動化を実現できます。
まずは、下記テンプレートページを開き、『このテンプレートを試してみる』をクリックしましょう。

Webflowでフォームが送信されたら、Mailchimpでコンタクトをオーディエンスに追加する

試してみる

---

■概要
Webflowで作成したフォームから獲得したリード情報を、手作業でMailchimpに登録していませんか？この作業は手間がかかるだけでなく、転記ミスなどのヒューマンエラーが発生する可能性もあります。このワークフローを活用すれば、Webflowのフォーム送信をトリガーにして、Mailchimpへ自動でコンタクトを追加できます。Webflowと連携したEmailマーケティングのプロセスを効率化し、顧客へのアプローチを迅速に開始することが可能です。

■このテンプレートをおすすめする方
・Webflowのフォームで獲得したリードを手作業でMailchimpに登録している方
・Webflowと連携したEmailマーケティングの初動を自動化し、効率化したいと考えている方
・リード獲得から顧客へのアプローチまでの時間を短縮したいマーケティング担当者の方

■注意事項
・Webflow、MailchimpのそれぞれとYoomを連携してください。
・Webflowの内容を取得する方法は下記を参照ください。
https://intercom.help/yoom/ja/articles/5404443

詳細を見る 試してみる

コピーすると下の画像のようにテンプレートがお使いのYoom管理画面にコピーされるので、OKを押して設定を進めていきましょう！

ステップ3：アプリトリガーの設定

(1)Yoomで設定をする前に、テスト用のフォームをWebflowに作成しましょう！

フォームに回答が送信されることがトリガーとなるため、ダミーのデータを送信します。
それではYoomに戻りましょう！

(2)それではWebflowと連携して、フォームが送信された際の設定を行っていきます！

アプリトリガーの「フォームが送信されたら」をクリックします。

(3)「連携アカウントとアクションを選択」画面から、Webflowと連携するアカウント情報に誤りがないかを確認し、トリガーアクションは「フォームが送信されたら」のままで「次へ」をクリックします。

(4)「WebhookURLの登録」画面から、サイトIDを候補から選択します。
選択したら「WebhookURLを登録」をクリックします。

WebhookURLの登録に成功しました！
「次へ」をクリックしましょう。

(5)「Webhookの受信設定」画面から、再度「テスト」をクリックします。

テストに成功しました！

「取得した値」にWebflowの情報が反映されればテスト成功です。

「取得した値ってなんだろう？」と思った方は下のサイトをご参照ください。

取得した値について

取得した値の項目名を変更したい場合は下の画像の赤枠部分をクリックします。

項目名を変更し「保存」をクリックします。

また、「＋取得する値を追加」をクリックすることで、取得した値を追加することも可能です。

詳しい設定方法は下のサイトをご参照ください。

「取得する値」を追加する方法

それでは「完了」をクリックし、次の工程に進みましょう！

ステップ4：Mailchimpのコンタクトにオーディエンスを追加する

(1)次にMailchimpのコンタクトにオーディエンスを追加します！
「コンタクトをオーディエンスに追加」をクリックしましょう。

(2)「連携アカウントとアクションを選択」画面から、Mailchimpと連携するアカウント情報に誤りがないかを確認し、アクションは「コンタクトをオーディエンスに追加」のままで「次へ」をクリックします。

(3)「API接続設定」画面から、オーディエンスIDを候補から選択します。
メールアドレスは先ほど取得した値を使って入力することで、都度変更することなく最新の情報を引用することができます！

ステータスはプルダウンから選択します。
以降の項目は必須項目ではありません。必要な項目に入力を行ってください。
入力が終わったら下部にある「テスト」をクリックしましょう！

テストに成功しました！

テストに成功すると、Mailchimpのコンタクトに追加されていました！

Yoomに戻り「完了」をクリックしましょう！

ステップ5：トリガーをONに設定しフロー稼働の準備完了

お疲れ様でした！これですべての設定が完了です。

トリガーをONにするとフローが起動します！

実際にフローボットを起動して、Webflowでフォームが送信されたら、Mailchimpのコンタクトにオーディエンスが追加されているかを確認してみてくださいね！

WebflowのAPIを使ったその他の自動化例

WebflowのAPIを活用することで、様々な自動化の実現が可能になります。

Webflowを使った自動化例

Webflowでフォームが送信された際に、Slack、Discord、Zoom、HubSpotなどの各種アプリへ通知や連携を行うことができます。また、Webflowのコレクションアイテムが非公開になった際にGoogle Chatへ通知したり、Typeform、Tally、Shopify、Stripe、メール（OpenAIによる要約含む）といった外部サービスの情報をトリガーに、Webflowのアイテムを自動で追加・更新することも可能です。

Shopifyで特定の商品情報が作成されたら、Webflowのコレクションにアイテムを追加する

試してみる

---

■概要
Shopifyで新しい商品を登録するたびに、Webflowで構築したサイトにも手作業で情報をコピー＆ペーストしていませんか。
この単純作業は時間を要するだけでなく、入力ミスや更新漏れの原因にもなりがちです。
このワークフローを活用すれば、ShopifyとWebflowの連携を自動化し、特定の商品がShopifyに作成された際に、Webflowのコレクションへ自動でアイテムが追加されるため、こうした課題を解消し、サイト更新業務を効率化できます。

■このテンプレートをおすすめする方
・ShopifyとWebflowでサイトを運営し、商品登録の二重入力に手間を感じているEC担当者の方
・Webflowで構築したサイトに、Shopifyの商品情報を手動で反映させているWebサイト管理者の方
・ShopifyとWebflowを連携させ、コンテンツコマースなどのサイト運用を効率化したいと考えている方

■注意事項
・Shopify、WebflowのそれぞれとYoomを連携してください。
・Shopifyはチームプラン・サクセスプランでのみご利用いただけるアプリとなっております。フリープラン・ミニプランの場合は設定しているフローボットのオペレーションやデータコネクトはエラーとなりますので、ご注意ください。
・チームプランやサクセスプランなどの有料プランは、2週間の無料トライアルを行うことが可能です。無料トライアル中には制限対象のアプリを使用することができます。
・分岐はミニプラン以上のプランでご利用いただける機能（オペレーション）となっております。フリープランの場合は設定しているフローボットのオペレーションはエラーとなりますので、ご注意ください。
・ミニプランなどの有料プランは、2週間の無料トライアルを行うことが可能です。無料トライアル中には制限対象のアプリや機能（オペレーション）を使用することができます。

詳細を見る 試してみる

Typeformの回答内容でWebflowのコレクションにアイテムを追加する

試してみる

---

■概要
「Typeformの回答内容でWebflowのコレクションにアイテムを追加する」フローは、Typeformで集めたデータをWebflowのコレクションに自動的に反映させる業務ワークフローです。
アンケートやフォームを通じて取得した情報を、手動でWebflowに入力する手間を省き、リアルタイムでコンテンツを更新できます。
このワークフローを活用することで、データ管理の効率化と正確性向上が期待できます。‍

■このテンプレートをおすすめする方
・Typeformを活用して顧客やユーザーからのフィードバックを収集している方
・Webflowのコレクションを用いて動的なウェブコンテンツを管理しているウェブデザイナーやマーケターの方
・データ入力の手間を削減し、業務の自動化を図りたい企業のIT担当者の方
・フォームからの情報を即座にウェブサイトに反映させたい運営チームの方‍

■注意事項
・TypeformとWebflowのそれぞれとYoomを連携してください。
・トリガーでのアウトプット取得方法は下記を参考にしてください。
https://intercom.help/yoom/ja/articles/9103858

詳細を見る 試してみる

Stripeで商品が更新されたら、Webflowのアイテムも更新する

試してみる

---

■概要
WebflowとStripeを連携したECサイト運営において、商品情報の同期作業は手間に感じられることも少なくありません。Stripeで商品を更新するたびに、手作業でWebflowの情報を修正するのは時間がかかり、入力ミスの原因にもなり得ます。このワークフローを活用することで、Stripeの商品更新をきっかけにWebflowのアイテム情報を自動で更新し、手作業による更新の手間やヒューマンエラーを減らすことができます。

■このテンプレートをおすすめする方
・WebflowとStripeを連携させ、ECサイトの商品管理を効率化したい方
・Stripeの商品情報を手動でWebflowに反映させているWeb担当者の方
・商品情報の更新ミスを防ぎ、正確なサイト運営を目指すECサイト運営者の方

■注意事項
・Stripe、WebflowのそれぞれとYoomを連携してください。
・Stripeはチームプラン・サクセスプランでのみご利用いただけるアプリとなっております。フリープラン・ミニプランの場合は設定しているフローボットのオペレーションやデータコネクトはエラーとなりますので、ご注意ください。
・Stripeの商品メタデータにWebflowのアイテムIDなど更新に必要なデータを予め設定する必要があります。
・チームプランやサクセスプランなどの有料プランは、2週間の無料トライアルを行うことが可能です。無料トライアル中には制限対象のアプリを使用することができます。
・Webflowの内容を取得する方法は下記を参照ください。
https://intercom.help/yoom/ja/articles/5404443

詳細を見る 試してみる

Tallyの回答内容でWebflowのコレクションにアイテムを追加する

試してみる

---

■概要
「Tallyの回答内容でWebflowのコレクションにアイテムを追加する」ワークフローは、Tallyのwebflow formから得られた回答を自動的にWebflowのコレクションに登録する業務ワークフローです。
オンラインフォームを利用して情報を収集する際、回答内容を手動でWebflowのコレクションに追加する作業は時間がかかり、ミスの原因にもなります。
このワークフローを導入することで、Tallyのwebflow formに新たな回答が送信されるたびに、自動的に対応するWebflowのコレクションにアイテムが追加されます。
これにより、データの一貫性が保たれ、業務の効率化が図れます。
さまざまなSaaSアプリとの連携を活用し、煩雑な手作業を省くことで、よりスムーズな業務運営が可能になります。‍

■このテンプレートをおすすめする方
・Tallyのwebflow formを利用して情報を収集しているWebflowユーザーの方
・フォームの回答をWebflowのコレクションに手動で追加している作業に時間を取られている方
・複数のSaaSアプリを活用し、業務の自動化を進めたいと考えている方
・データの一貫性を保ちつつ、業務効率を向上させたいWebflowサイト運営者の方
・エラーを減らし、正確なデータ管理を実現したい方‍

■注意事項
・TallyとWebflowのそれぞれとYoomを連携してください

詳細を見る 試してみる

Webflowでフォームが送信されたら、Discordで通知する

試してみる

---

■概要
Webflowで作成したWebサイトのフォームから問い合わせがあった際、気づくのが遅れて対応が後手になってしまうことはありませんか？
手動での確認作業は手間がかかる上に、機会損失にも繋がりかねません。

このワークフローを活用すれば、Webflowのフォーム送信をトリガーに、指定のDiscordチャンネルへ即時通知を自動で送信できます。Webflowを活用した業務のオートメーションに関心のある方にとって、迅速な顧客対応を実現する第一歩となるでしょう。

■このテンプレートをおすすめする方
・Webflowで獲得したリードへの対応速度を上げたいマーケティングや営業担当者の方
・社内のコミュニケーションツールとしてDiscordを利用しており、情報集約を効率化したい方
・WebflowとDiscordの連携を検討しており、ノーコードで手軽に通知の仕組みを構築したい方

■注意事項
・Webflow、DiscordのそれぞれとYoomを連携してください。
・Webflowの内容を取得する方法は下記を参照ください。
https://intercom.help/yoom/ja/articles/5404443

詳細を見る 試してみる

Webflowでフォームが送信されたら、HubSpotでコンタクトを作成する

試してみる

---

■概要
Webflowのフォームから問い合わせや資料請求があった際、その情報をHubSpotに手作業で登録していませんか？この定型業務は入力漏れや対応の遅延に繋がるだけでなく、本来注力すべきコア業務を圧迫する一因にもなります。このワークフローを活用すればWebflowでフォームが送信されたら自動でHubSpotにコンタクトを作成することが可能になり、手作業によるデータ転記の手間を解消できます。

■このテンプレートをおすすめする方
・Webflowのフォーム情報をHubSpotへ手入力しており、作業を効率化したい方
・フォームからのリード情報を迅速にHubSpotへ反映させたいマーケティング担当者の方
・データの転記ミスを防ぎ、顧客情報管理の精度を高めたいと考えている方

■注意事項
・Webflow、HubSpotのそれぞれとYoomを連携してください。
・Webflowの内容を取得する方法は下記を参照ください。
https://intercom.help/yoom/ja/articles/5404443

詳細を見る 試してみる

Webflowでフォームが送信されたら、Slackに回答内容を通知する

試してみる

---

■概要
Webflowで作成したフォームからの問い合わせや申し込みがあった際に、担当者への共有が遅れたり、確認漏れが発生したりすることはありませんか？手動での確認や転記作業は手間がかかるだけでなく、ビジネスチャンスを逃す原因にもなりかねません。
このワークフローを活用すれば、Webflowのフォーム送信をトリガーとして、Slackへ回答内容を自動で通知することが可能になり、迅速かつ確実な情報共有を実現します。

■このテンプレートをおすすめする方
・Webflowで作成したフォームの回答をSlackで迅速に受け取りたいWebサイト管理者の方
・フォームからのリード対応の速度を向上させたいマーケティングや営業担当者の方
・手動での確認や通知作業をなくし、業務の効率化を図りたいと考えている方

■注意事項
・Webflow、SlackのそれぞれとYoomを連携してください。
・Webflowのフォーム回答アウトプットはJSONPathから取得可能です。取得方法は「『取得する値』を追加する方法」をご参照ください。
　https://intercom.help/yoom/ja/articles/9103858

詳細を見る 試してみる

Webflowでフォームが送信されたら、Zoomでミーティングを作成する

試してみる

---

■概要
Webflowで作成したフォームから問い合わせやデモの予約が入るたびに、手動でZoomミーティングを作成していませんか？
この作業は時間がかかるだけでなく、URLの送り忘れや日時の設定ミスといったヒューマンエラーの原因にもなり得ます。

このワークフローを活用することで、Webflowのフォームが送信されたタイミングをトリガーに自動でZoomミーティングを作成しスムーズな顧客対応をサポートします。

■このテンプレートをおすすめする方
・Webflowのフォームを活用した問い合わせ対応を自動化し、業務を効率化したい方
・手動によるZoomミーティングの設定に手間を感じており、ミスを減らしたいと考えている方
・webflow automationを導入し、リードへの迅速なアプローチを実現したいマーケティング・営業担当の方

■注意事項
・Webflow、Zoom(OAtuth)のそれぞれとYoomを連携してください。
・Webflowの内容を取得する方法は下記を参照ください。
https://intercom.help/yoom/ja/articles/5404443

詳細を見る 試してみる

Webflowのコレクションのアイテムが非公開になったらGoogle Chatに通知する

試してみる

---

■概要
Webflowで管理しているコレクションアイテムが意図せず非公開になってしまい、関係者への共有が遅れてしまった経験はありませんか？手動でステータスを確認し、通知するのは手間がかかる作業です。
このワークフローを活用すれば、Webflowでコレクションのアイテムが非公開になったタイミングを自動で検知しGoogle Chatへ通知を送信できます。これにより、重要な変更の見落としを防ぎ、迅速な対応を実現します。

■このテンプレートをおすすめする方
・Webflowで管理するコンテンツのステータス変更をチームに迅速に共有したいサイト運営者の方
・Webflowのアイテムが非公開になった際の通知を手作業で行っており、自動化したいと考えている方
・Google Chatを活用し、Webサイトの更新状況を素早く把握したいチームリーダーの方

■注意事項
・Webflow、Google ChatのそれぞれとYoomを連携してください。
・Google Chatとの連携はGoogle Workspaceの場合のみ可能です。詳細は「Google Chatでスペースにメッセージを送る方法」を参照ください。
https://intercom.help/yoom/ja/articles/6647336

詳細を見る 試してみる

メールが届いたらテキストを抽出し、OpenAIで内容を要約してWebflowにアイテムを追加する

試してみる

---

■概要
Webサイトのコンテンツ更新などで、メールで受け取った情報をWebflowに登録する作業は、定期的でありながら手間がかかる業務ではないでしょうか。特にOpenAIを活用して内容を要約する場合でも、手作業での転記はミスの原因にもなり得ます。このワークフローは、メール受信を起点にテキストを自動抽出し、OpenAIによる要約を経てWebflowへアイテムを自動で追加するため、このような手作業をなくし、コンテンツ制作の効率を高めます。

■このテンプレートをおすすめする方
・WebflowとOpenAIを連携させて、コンテンツ投稿の自動化に関心があるWeb担当者の方
・メールで受け取ったプレスリリースや記事ネタなどを、手作業でWebflowに転記している方
・生成AIを活用してWebサイトの運用を効率化したいと考えているマーケティング担当者の方

■注意事項
・OpenAI、WebflowのそれぞれとYoomを連携してください。
・ChatGPT（OpenAI）のアクションを実行するには、OpenAIのAPI有料プランの契約が必要です。（APIが使用されたときに支払いができる状態）
https://openai.com/ja-JP/api/pricing/
・ChatGPTのAPI利用はOpenAI社が有料で提供しており、API疎通時のトークンにより従量課金される仕組みとなっています。そのため、API使用時にお支払いが行える状況でない場合エラーが発生しますのでご注意ください。

詳細を見る 試してみる

まとめ

WebflowとEメールマーケティングツールの連携を自動化することで、これまで手作業で行っていたリード情報の転記作業の手間を削減し、ヒューマンエラーを防ぐことができます。
これにより、マーケティング担当者は獲得したリードに対してすぐにアプローチを開始でき、施策の立案や分析といったコア業務に集中できる環境が整いやすくなります！

今回ご紹介したような業務自動化を実現できるノーコードツール「Yoom」を使えば、プログラミングの知識がない方でも、直感的な操作で簡単に業務フローを構築できるので、もし自動化に少しでも興味を持っていただけたなら、ぜひ下のサイトから無料登録して、Yoomによる業務効率化を体験してみてください！

30秒で簡単登録！無料で始める

よくあるご質問

Q：フォーム内容に応じてタグ付けは可能ですか？

A：

はい。可能です。
MailchimpのAPI接続設定画面より、任意のタグを設定できます。