Hubspotで製品が作成されたら、Webflowにアイテムを追加する
試してみる
■概要
HubSpotで管理している製品情報を、Webflowで制作したサイトへ手作業で登録していませんか？この転記作業は時間がかかる上に、入力ミスや反映漏れのリスクも伴います。
このワークフローは、HubSpotとWebflowを連携させ、製品が作成された際に自動でWebflowのコレクションにアイテムを追加します。WebflowとHubspot間での手作業による登録フローを自動化し、業務効率の改善に貢献します。
■このテンプレートをおすすめする方
・HubSpotの製品情報をWebflowサイトに手作業で反映させているWeb担当者の方
・WebflowとHubSpotを活用した製品管理やサイト更新の効率化を図りたいマーケターの方
・製品登録時の入力ミスや更新漏れをなくし、正確な情報発信を実現したいEC担当者の方
■注意事項
・Hubspot、WebflowのそれぞれとYoomを連携してください。
・トリガーは5分、10分、15分、30分、60分の間隔で起動間隔を選択できます。
・プランによって最短の起動間隔が異なりますので、ご注意ください。
「HubSpotに登録した製品情報を、Webflowで構築したサイトのCMSにも反映させたい」
「でも、毎回手作業でコピー＆ペーストするのは時間がかかるし、入力ミスも怖い…」
このように、HubSpotとWebflow間でのデータ連携を手作業で行うことに、非効率さやストレスを感じていませんか？
もし、HubSpotのデータをトリガーにしてWebflowのCMSアイテムを自動で作成・更新する仕組みがあれば、こうした定型業務を減らすことができます。サイトコンテンツの管理やマーケティング業務の効率化につながり、より創造的な作業に時間を割けるようになるでしょう。
今回ご紹介する自動化の設定は、プログラミングの知識がなくてもノーコードで簡単に導入可能です。
これまで自動化に踏み出せなかった方でもすぐに実践できるため、ぜひこの機会に取り入れて業務をよりスムーズにしましょう。
とにかく早く試したい方へ
YoomにはHubSpotとWebflowを連携するためのテンプレートが用意されています。
今すぐ試したい方は以下よりバナーをクリックしてスタートしましょう！
Hubspotで製品が作成されたら、Webflowにアイテムを追加する
試してみる
■概要
HubSpotで管理している製品情報を、Webflowで制作したサイトへ手作業で登録していませんか？この転記作業は時間がかかる上に、入力ミスや反映漏れのリスクも伴います。
このワークフローは、HubSpotとWebflowを連携させ、製品が作成された際に自動でWebflowのコレクションにアイテムを追加します。WebflowとHubspot間での手作業による登録フローを自動化し、業務効率の改善に貢献します。
■このテンプレートをおすすめする方
・HubSpotの製品情報をWebflowサイトに手作業で反映させているWeb担当者の方
・WebflowとHubSpotを活用した製品管理やサイト更新の効率化を図りたいマーケターの方
・製品登録時の入力ミスや更新漏れをなくし、正確な情報発信を実現したいEC担当者の方
■注意事項
・Hubspot、WebflowのそれぞれとYoomを連携してください。
・トリガーは5分、10分、15分、30分、60分の間隔で起動間隔を選択できます。
・プランによって最短の起動間隔が異なりますので、ご注意ください。
HubSpotとWebflowを連携してできること
HubSpotとWebflowのAPIを連携させることで、これまで手動で行っていた二つのツール間のデータ入力を自動化し、業務の効率を向上させることが可能になります。
例えば、HubSpotに新しい製品情報を登録した際に、その情報を自動でWebflowのCMSアイテムとして追加する、といった連携が実現可能です。
これから具体的な自動化の例を複数ご紹介しますので、ご自身の業務に近いものや、解決したい課題に合ったものがないか、ぜひチェックしてみてください！
Hubspotで製品が作成されたら、Webflowにアイテムを追加する
HubSpotに新しい製品情報を登録すると、その内容が自動でWebflowのCMSコレクションに追加されるフローです。
Webサイトへの製品情報掲載にかかる時間を減らし、手作業による入力ミスを防ぎます。
この仕組みによって、製品情報の更新や追加を迅速かつ正確にサイトへ反映できるようになります。
Hubspotで製品が作成されたら、Webflowにアイテムを追加する
試してみる
■概要
HubSpotで管理している製品情報を、Webflowで制作したサイトへ手作業で登録していませんか？この転記作業は時間がかかる上に、入力ミスや反映漏れのリスクも伴います。
このワークフローは、HubSpotとWebflowを連携させ、製品が作成された際に自動でWebflowのコレクションにアイテムを追加します。WebflowとHubspot間での手作業による登録フローを自動化し、業務効率の改善に貢献します。
■このテンプレートをおすすめする方
・HubSpotの製品情報をWebflowサイトに手作業で反映させているWeb担当者の方
・WebflowとHubSpotを活用した製品管理やサイト更新の効率化を図りたいマーケターの方
・製品登録時の入力ミスや更新漏れをなくし、正確な情報発信を実現したいEC担当者の方
■注意事項
・Hubspot、WebflowのそれぞれとYoomを連携してください。
・トリガーは5分、10分、15分、30分、60分の間隔で起動間隔を選択できます。
・プランによって最短の起動間隔が異なりますので、ご注意ください。
Hubspotで新しい取引が作成されたら、Webflowにアイテムを追加する
HubHubSpotで新しい取引が作成されると、取引に関連する情報をWebflowのCMSアイテムとして自動追加するフローです。
導入事例や顧客紹介ページなどのコンテンツ作成が効率化されます。
営業部門が取得した最新の取引情報を、マーケティングコンテンツとしてWebサイトへ迅速に反映でき、部門間の情報共有もスムーズになります。
Hubspotで新しい取引が作成されたら、Webflowにアイテムを追加する
試してみる
■概要
WebflowとHubSpotを連携して活用する中で、手作業でのデータ移行に手間を感じていませんか？HubSpotで管理する取引情報をWebflowサイトへ反映させる作業は、時間もかかり入力ミスの原因になりがちです。このワークフローは、HubSpotで新しい取引が作成されると、自動でWebflowのコレクションにアイテムを追加します。手動更新の手間を省き、サイトコンテンツを効率的かつ正確に充実させることが可能になります。
■このテンプレートをおすすめする方
・HubSpotの取引情報をWebflowサイトに手動で反映させているWeb担当者の方
・WebflowとHubSpotを活用し、コンテンツ更新のリードタイムを短縮したい方
・データ転記によるミスをなくし、正確な情報発信を実現したいマーケティング担当者の方
■注意事項
・Hubspot、WebflowのそれぞれとYoomを連携してください。
・トリガーは5分、10分、15分、30分、60分の間隔で起動間隔を選択できます。
・プランによって最短の起動間隔が異なりますので、ご注意ください。
HubSpotとWebflowの連携フローを作ってみよう
それでは、実際にHubSpotとWebflowを連携したフローを作成する手順をご紹介します。
今回は、特別な知識がなくても業務の自動化を実現できるノーコードツール「Yoom」を使用して設定を進めていきます。プログラミング経験がない方でもご安心ください。
もしまだYoomのアカウントをお持ちでない場合は、こちらの登録フォームからアカウントを発行しておきましょう。
[Yoomとは]
フローの作成方法
今回は「Hubspotで製品が作成されたら、Webflowにアイテムを追加する」フローを作成していきます！
作成の流れは大きく分けて以下の通りです。
- HubSpotとWebflowのマイアプリ連携
- 該当のテンプレートをコピーする
- HubSpotのトリガー設定とWebflowのアクション設定
- トリガーをONにして、フローが起動するかを確認する
Hubspotで製品が作成されたら、Webflowにアイテムを追加する
試してみる
■概要
HubSpotで管理している製品情報を、Webflowで制作したサイトへ手作業で登録していませんか？この転記作業は時間がかかる上に、入力ミスや反映漏れのリスクも伴います。
このワークフローは、HubSpotとWebflowを連携させ、製品が作成された際に自動でWebflowのコレクションにアイテムを追加します。WebflowとHubspot間での手作業による登録フローを自動化し、業務効率の改善に貢献します。
■このテンプレートをおすすめする方
・HubSpotの製品情報をWebflowサイトに手作業で反映させているWeb担当者の方
・WebflowとHubSpotを活用した製品管理やサイト更新の効率化を図りたいマーケターの方
・製品登録時の入力ミスや更新漏れをなくし、正確な情報発信を実現したいEC担当者の方
■注意事項
・Hubspot、WebflowのそれぞれとYoomを連携してください。
・トリガーは5分、10分、15分、30分、60分の間隔で起動間隔を選択できます。
・プランによって最短の起動間隔が異なりますので、ご注意ください。
ステップ1:HubSpotとWebflowのマイアプリ連携
Yoomとそれぞれのアプリを連携して、アプリごとの操作を行えるようにしましょう。この設定は初回のみ必要です。
先ずは、基本的な設定方法を解説しているナビをご覧ください！
それでは、今回のフローで使用するHubSpotとWebflowのマイアプリ登録方法を解説していきます。
1.HubSpotの登録方法
HubSpotを検索すると下記画面が表示されるので、「Sign in to your HubSpot account」を選択しましょう。
HubSpotのログイン画面に移行したら、パスワードを入力してログインします。
続いて、連携したいアカウントをクリックしましょう。
チェックボックスをクリックして、「Connect app」を選択してください。
これでHubSpotのマイアプリ登録完了です。
2.Webflowの登録方法
先ほどのマイアプリ画面に戻り、今度はWebflowを検索しましょう。
アカウント名は、メールアドレスなど任意の名前を設定してください。
アクセストークンはWebflowにログインして発行し、ペーストします。
任意のアカウントでWebflowにログインし、「Site Settings」をクリック後「Generate API token」を押してください。
発行するAPIトークンに任意の名前を設定します。
「CMS」と「Site」の項目で「Read and Write」の権限を設定してから発行してください。
発行されたAPIトークンをコピーして、先ほどのYoomのWebflow新規登録画面にペーストしましょう。
最後に「追加」ボタンを押せば、Webflowの連携完了です！
ステップ2:テンプレートのコピー
Yoomのテンプレートを利用すれば、効率よく業務を自動化することが可能です。
下記テンプレートページにアクセスし、「このテンプレートを試してみる」をクリックし自動化をスタートしましょう。
Hubspotで製品が作成されたら、Webflowにアイテムを追加する
試してみる
■概要
HubSpotで管理している製品情報を、Webflowで制作したサイトへ手作業で登録していませんか？この転記作業は時間がかかる上に、入力ミスや反映漏れのリスクも伴います。
このワークフローは、HubSpotとWebflowを連携させ、製品が作成された際に自動でWebflowのコレクションにアイテムを追加します。WebflowとHubspot間での手作業による登録フローを自動化し、業務効率の改善に貢献します。
■このテンプレートをおすすめする方
・HubSpotの製品情報をWebflowサイトに手作業で反映させているWeb担当者の方
・WebflowとHubSpotを活用した製品管理やサイト更新の効率化を図りたいマーケターの方
・製品登録時の入力ミスや更新漏れをなくし、正確な情報発信を実現したいEC担当者の方
■注意事項
・Hubspot、WebflowのそれぞれとYoomを連携してください。
・トリガーは5分、10分、15分、30分、60分の間隔で起動間隔を選択できます。
・プランによって最短の起動間隔が異なりますので、ご注意ください。
これで、テンプレートのコピーが完了しました！
下記画面が表示されるので「OK」ボタンをクリックして設定を進めましょう。
ステップ3:HubSpotに製品が作成されたら起動するトリガー設定
まず最初に、HubSpotのトリガー設定を行います！
「製品が作成されたら」という項目をクリックしましょう。
下記画面は初期設定されています。
情報に誤りが無いか確認し、次のページに進んでください。
トリガーの起動間隔は、5分、10分、15分、30分、60分の間隔から選択できます。
迅速なデータ連携のためにも、基本的には最短の起動間隔でご使用いただくのがおすすめです。
※ご利用プランによって最短の起動間隔が異なりますので、ご注意ください。
続いて、トリガーの動作テストを行います。HubSpotにテスト用の商品を登録してください。
（テスト用のため架空の情報でOKです！）
今回は例として、下記画像のように商品を作成してみました。
再びYoomの画面に戻り、テストボタンを押してください。
テストが成功すると、HubSpotのデータが取得した値（アウトプット）に表示されるので確認後「保存する」ボタンを押しましょう。
※取得した値（アウトプット）とは、トリガーやオペレーション設定時に、「テスト」を実行して取得した値のことです。
尚、ここで取得した値は、この後の設定で利用することができます。
詳しくは、こちらのヘルプページをご確認ください。
ステップ4:Webflowのコレクションにアイテムを追加
次に、HubSpotで登録した商品情報をもとにWebflowのコレクションにアイテムとして自動で反映する設定を行いましょう！
「コレクションにアイテムを追加」という項目をクリックしてください。
下記画面も初期設定されています。
確認後、次のページに進みましょう。
サイトIDとコレクションIDは、枠内をクリックし表示された候補から選択します。
フィールドも、枠内をクリックし表示される候補から使用したいものを選択してください。
値には、設定したフィールドに自動登録したいHubSpotのデータを入力します。
下記画像のように設定すると、ステップ3で取得したアウトプットを活用し、HubSpotに登録した「製品名」を自動で登録することができますよ！
用途に合わせて取得したい値を設定してみましょう。
他にも自動取得したい項目があれば「＋フィールド情報を追加」をクリックすることで追加可能です。
設定が完了したら、「テスト」ボタンをクリックしてください。
テストが成功すると、Webflowのコレクションにアイテムが自動で追加されるので確認してください。
確認できたらYoomの画面に戻って「保存する」ボタンを押してください。
ステップ5:トリガーをONにする
これで「Hubspotで製品が作成されたら、Webflowにアイテムを追加する」フローの完成です！
「トリガーをON」ボタンをクリックして、フローが正常に動作するか確認してみてください。
WebflowのデータをHubSpotに連携したい場合
今回はHubSpotからWebflowへデータを連携する方法をご紹介しました。
逆にWebflowの情報を起点としてHubSpotのデータを操作したい場合もあるかと思います。
Yoomではそうした逆方向の連携も簡単に実現できますので、下記のテンプレートも併せてご活用ください。
Webflowでアイテムが作成されたら、テキストを抽出してHubSpotで製品を作成する
WebflowのCMSで新しいアイテムが作成された際に、そのアイテム情報から特定のテキストを抽出し、HubSpotに新しい製品として自動で登録するフローです。Webサイト側で先行して公開したコンテンツ情報を、後からHubSpotの製品データベースへ手間なく同期できます。
手作業による二重入力をなくし、データの一貫性を保ちながら管理を効率化することが可能です。
Webflowでアイテムが公開されたら、テキストを抽出してHubSpotで製品を作成する
試してみる
■概要
Webflowで新しい製品やコンテンツのアイテムを公開した後、HubSpotにその情報を手作業で登録するのは手間がかかり、転記ミスが発生する原因にもなりかねません。このワークフローを活用することで、WebflowとHubSpotの連携を自動化し、Webflowでアイテムが公開されると、その内容からテキストを抽出し、HubSpotに製品として自動で作成します。これにより、データ入力の手間を省き、正確な情報管理を実現できます。
■このテンプレートをおすすめする方
・WebflowとHubSpotを併用し、製品情報の手動登録に課題を感じている方
・サイトのアイテム公開とCRMの製品登録の連携を自動化したいマーケティング担当者の方
・WebflowからHubSpotへのデータ入力ミスを防ぎ、業務の正確性を高めたい方
■注意事項
・Webflow、HubSpotのそれぞれとYoomを連携してください。
・Webflowの内容を取得する方法は下記を参照ください。
https://intercom.help/yoom/ja/articles/5404443
Webflowで新規注文が発生したら、HubSpotで注文を作成する
WebflowのEコマース機能で新規注文が入ったことをトリガーに、その注文情報をHubSpotに自動で作成・登録するフローです。この連携により、Webサイト経由の注文データを手動で入力することなく、HubSpotのCRM上で顧客情報や購買履歴として一元管理できます。
その後のフォローアップやマーケティング活動へスムーズに繋げることが可能です。
Webflowで新規注文が発生したら、HubSpotで注文を作成する
試してみる
■概要
Webflowで構築したECサイトで新規注文が発生するたびに、手作業でHubSpotへ顧客情報や取引情報を入力するのは手間がかかる作業ではないでしょうか。この繰り返し作業は、入力ミスや対応漏れといったヒューマンエラーの原因にもなりかねません。このワークフローを活用することで、WebflowとHubSpotをスムーズに連携させ、新規注文があった際にHubSpotへ取引を自動で作成できます。これにより、手作業による入力業務から解放され、より正確で迅速な顧客管理を実現します。
■このテンプレートをおすすめする方
・WebflowとHubSpotを連携させ、注文管理から顧客管理までを効率化したいEC担当者の方
・手作業によるデータ入力の時間を削減し、ヒューマンエラーを防止したいと考えている方
・SaaS間のデータ連携を自動化し、本来注力すべきコア業務の時間を確保したいと考えている方
■注意事項
・Webflow、HubSpotのそれぞれとYoomを連携してください。
HubSpotやWebflowを活用したその他の自動化テンプレート
HubSpotやWebflowを使えば、営業やマーケティングの定型作業をもっとシンプルにできます。日々の情報整理や共有が自動化されることで、時間を節約しながら正確な業務が進められます。
HubSpotを使った便利な自動化例
HubSpotと他のツールを組み合わせると、コンタクト管理や取引情報の整理が効率的に行えます。通知やフォルダ作成などを自動化することで、チーム内での情報共有や管理の手間を減らせます。
HubspotのコンタクトページからZoomのミーティングを登録する
試してみる
Hubspotのコンタクトページから、Zoomのミーティングを登録し、Gmailで会議情報をコンタクトに送付するフローボットです。Zoomの会議URLの発行と招待メールの送付を自動的に実施することが可能です。
HubSpotに新規コンタクトが登録されたらLINE WORKSに通知
試してみる
HubSpotに新規コンタクトが登録されたことを検知して、LINE WORKSの指定のトークルームに通知を行います。
HubSpotで商談情報が登録されたら、Googleカレンダーに予定を作成しSlackに通知する
試してみる
HubSpotで商談情報が登録されたら、Googleカレンダーに予定を作成しSlackに通知するフローです。
■注意事項
・HubSpot、Googleカレンダー、Slack、Google スプレッドシートのそれぞれとYoomを連携してください。
・分岐はミニプラン以上のプランでご利用いただける機能（オペレーション）となっております。フリープランの場合は設定しているオペレーションはエラーとなりますので、ご注意ください。
・ミニプランなどの有料プランは、2週間の無料トライアルを行うことが可能です。無料トライアル中には制限対象のアプリや機能（オペレーション）を使用することができます。
・トリガーは5分、10分、15分、30分、60分の間隔で起動間隔を選択できます。
・プランによって最短の起動間隔が異なりますので、ご注意ください。
・このフローでは、Google スプレッドシートを用いて協定世界時(UTC)から日本標準時(JST)に日時を変換しています。変換方法については、下記をご参照ください。
https://intercom.help/yoom/ja/articles/6777765
HubSpotで新しいコンタクトが作成されたら、Google Driveにフォルダを作成する
試してみる
■概要
HubSpotに新しいコンタクトを追加するたびに、手動でGoogle Driveに顧客管理用のフォルダを作成する作業は手間がかかり、フォルダの作成漏れや命名規則の間違いといったミスにつながることも少なくありません。このワークフローを活用すれば、HubSpotへのコンタクト登録をトリガーとして、Google Driveに自動でフォルダを作成する一連の流れを構築できるため、こうした課題を解消し、よりスムーズな顧客管理を実現します。
■このテンプレートをおすすめする方
・HubSpotで顧客管理を行い、Google Driveで関連資料を保管している営業担当者の方
・手作業によるHubSpotからGoogle Driveへの情報反映に手間やミスを感じている方
・SaaS間の連携を自動化し、ノンコア業務の時間を削減したいと考えているチームリーダーの方
■注意事項
・HubSpot、Google DriveのそれぞれとYoomを連携してください。
・トリガーは5分、10分、15分、30分、60分の間隔で起動間隔を選択できます。
・プランによって最短の起動間隔が異なりますので、ご注意ください。
HubSpotに新規コンタクトが登録されたらSlackに通知
試してみる
HubSpotに新規コンタクトが登録されたことを検知して、指定のSlackチャンネルに通知を行います。
Webflowを使った便利な自動化例
Webflowと外部サービスを連携すると、フォーム入力や注文データを自動的に整理できます。営業記録や顧客データの入力作業を省けるため、業務全体の流れがスムーズになります。
Webflowのフォームが送信されたらAirtableに追加する
試してみる
Webflowのフォームが送信されたらAirtableに追加するフローです。
Webflowのフォームが送信されたらGoogleスプレッドシートに追加する
試してみる
Webflowのフォームが送信されたらGoogleスプレッドシートに追加するフローです。
Webflowのフォームが送信されたらSalesforceに追加する
試してみる
Webflowのフォームが送信されたらSalesforceに追加するフローです。
Webflowでコレクションのアイテムが公開されたら、Microsoft Teamsに通知する
試してみる
■概要
Webflowで新しいコンテンツを公開するたびに、チームへの共有を手作業で行うことに手間を感じていませんか。手動での連絡は時間がかかるだけでなく、共有漏れなどのミスにつながる可能性もあります。このワークフローは、WebflowのAPIを活用し、コレクションアイテムが公開されると自動でMicrosoft Teamsへ通知する仕組みを構築するため、このような課題を解消し、迅速で確実な情報共有を実現します。
■このテンプレートをおすすめする方
・Webflowでコンテンツを管理しており、Microsoft Teamsでの共有を自動化したい方
・WebflowのAPIを利用した業務効率化に関心がある、Webサイトの運営担当者の方
・手作業による情報伝達のタイムラグや、共有漏れといった課題を解消したい方
■注意事項
・Webflow、Microsoft TeamsのそれぞれとYoomを連携してください。
・Microsoft365（旧Office365）には、家庭向けプランと一般法人向けプラン（Microsoft365 Business）があり、一般法人向けプランに加入していない場合には認証に失敗する可能性があります。
・トリガーは5分、10分、15分、30分、60分の間隔で起動間隔を選択できます。
・プランによって最短の起動間隔が異なりますので、ご注意ください。
Webflowで注文が発生したらMicrosoft Excelに追加する
試してみる
Webflowで注文が発生したらMicrosoft Excelに追加するフローです。
まとめ
HubSpotとWebflowの連携を自動化することで、これまで手作業で行っていた製品情報や取引情報のデータ転記作業をなくし、ヒューマンエラーの発生を防ぐことができます。
これにより、Webサイトへの情報反映が迅速かつ正確になり、担当者はコンテンツの入力作業から解放されるでしょう。
マーケティング戦略の策定や顧客分析といった、より付加価値の高いコア業務に集中できる環境が整いますよ！
今回ご紹介したような業務自動化は、ノーコードツール「Yoom」を活用することで、プログラミングの知識がない方でも直感的な操作で簡単に構築可能です。
もし日々の繰り返し作業の自動化に少しでも興味を持っていただけたなら、ぜひこちらから無料登録して業務の効率化を体験してみてください。
よくあるご質問
Q：特定の条件を満たしたデータだけを連携させることは可能ですか？
A：はい、可能です。
フローに「分岐」を設定することで、特定の条件（価格帯や作成日等）を満たす案件の情報だけをWebflowのコレクションにアイテムを作成することができます。
「分岐」の設定方法について、詳しくはこちらをご覧ください。
Q：連携が失敗した場合、エラーに気づくための通知機能はありますか？
A：連携が失敗すると、Yoomに登録する際に設定したメールアドレスに通知が届きます。通知内容にはエラーになったオペレーションも記載されているので、エラーの発生個所がすぐに確認可能です。
通知先は、メールの他にSlackやChatworkも設定できます。詳しい設定方法はこちらのヘルプページをご参照ください。
Q：連携に必要なHubSpotやWebflow側の料金プランはありますか？
A：HubSpotとWebflowの連携は、Yoomのフリープランで利用できるアプリです。Yoomには様々な有料プランがあり、各プランごとに利用可能な機能や、毎月の無料タスク数・無料ライセンス数が異なります。
詳しい機能比較や料金プランについては、こちらのヘルプページをご確認ください。
.png)
