HubspotをWebflowに接続して、完全なマーケティング自動化を作成する方法。

美しいウェブサイト...しかし、顧客は完全に失われていますか？ Webの人々がWebflowとマーケティングチームが実際に出会う問題。

この状況で頭痛を感じたことはありますか？ウェブフローで美しく、モダンで速いロードでデザインされたWebサイトがあります。しかし、実際に使用すると、ウェブ上のフォームを介して埋める顧客情報が散らばっていることがわかりました！マーケティングチームは、マニュアル情報が1つずつHubspotに置くのを待たなければなりません。営業チームは各リードの起源を知りません。特に、最後に、鉛は空中に落ちました。あなたがうなずいているなら、あなたが正しい場所に来たことを示しているなら、それは次のとおりです。

イラストのプロンプト：散在する情報を使用しなければならないマーケティングチームのいらいら性を示す画像。片側は美しいウェブフロー画面です。反対側は乱雑なエクセルテーブルで、リードアイコンが消えました。

なぜwebflowとhubspotが互いに話しかけないのですか？データが接続されていない理由のロックを解除します

多くの人々は、しばしば、最高の2つの最高のツール（Web用WebフローとマーケティングにHubspot）を使用するだけで、すべてが自動的に連携することを誤解しています。しかし、実際には、これらのプラットフォームは両方とも「島」のようなものです。 Webflowは、柔軟で美しいデザインの島です。 Hubspotは、これら2つの島を接続する正しい「橋」がない情報と自動自動システムの島です。情報は互いに旅行することができません。主な理由は次のとおりです。

• 完全に分離されたシステム： WebFlowは家（Webサイトとフォーム）を管理しますが、Hubspotは裏庭（CRM＆オートメーション）を自然に管理しますが、ワンクリックで接続するために作成されません。
• 技術的な複合体：多くの人々は、システムを接続することは難しいと考えています。プログラマーを使用して複雑なコードを作成する必要があります。
• 簡単な方法があるかどうかはわかりません。良いニュースは、常にコードを書く必要がないということです！この「ブリッジ」を簡単に作成するのに役立つツールと方法があります。

イラストのプロンプト：「Webflow Island」と「Hubspot Island」と呼ばれる2つの島の地図があり、それらの間に大きなスペースが分離されています。まだ接続されていないシステムを伝えます

残してください...あなたが思っているよりも損傷します！マーケティングデータが「サイロ」の場合の影響

Web WebflowとHubspotのMarketing Automation Systemから顧客情報を個別に許可し、チームをより疲れさせるだけでなく。しかし、それはあなたが期待していないかもしれないビジネスに直接影響します：

• 失われたビジネスチャンス（Lost Leads）：フォームに記入するリードに従うことはできません。または、顧客が競合他社に行くまで遅すぎる
• 方向のないマーケティング：どの記事のリードが読書に興味があるのかわかりません。または、連絡する前にウェブ上の製品のどのページを確認し、リードを育てたり、電子メールを送信したりします。
• ROIを測定できません：広告にいくらお金を使っていますか？しかし、カスタマージャーニーデータが欠落しているため、リードがどれほど品質であり、どのキャンペーンが最良の結果であるかをはっきりと伝えることはできませんか？
• 顧客体験が悪い：顧客はデモの形式に記入するが、代わりに、彼がそれに興味を持っていることに関係のない一般的な記事を推奨する電子メールを受け取ったと考えてください。最初から良い体験を作成することは非常に重要です。特にプロセスの顧客オンボーディングで

イラストのプロンプト：鉛型アイコンとお金がその漏れから流れる大きな漏れやすい水道管画像。機会と予算の損失を伝えます

解決策があります！ 2つの主要なメソッドWebflowをHubspotに接続する（および開始方法）

これらの2つの島を結びつける「橋」を建設する時が来ました！ Webflowを最も人気のある効果的なHubspotに接続する方法。 2つの主要な方法があり、それぞれに異なる利点があります。

1. 方法1：直接統合 - この方法から開始することをお勧めします！
   これは、Hubspotの「追跡コード」をWebFlow Webサイトに埋め、元のWebflowフォームの代わりに「Hubspotフォーム」を使用する最も簡単で最も強力な方法です。これにより、HubSpotはあなたのウェブサイト上のすべての人の動作を詳細に追跡できます。フォームを介して記入されているすべての情報は、実際のhubspot crmに送信されます
2. 方法2：ミドルウェア統合。
   ZapierやIntegromatなどの媒体を使用してWebflowからHubspotに情報を送信することです Webflowツールを使用しますが、多くのステップで交換する必要があり、仲介者から追加費用がかかる場合があります。

提案：ビジネスの90％については、最も深いデータ（完全なカスタマージャーニートラッキング）を提供するため、方法1（直接接続）セットアップが簡単で、ハブスポットのパワーを最大に使用できます。

図のプロンプト：図画像2つの方法を比較します。最初の方法は、WebflowからHubspot（直接統合）への直線で、2番目の方法にはWebflowとHubspot（ミドルウェア統合）の中間にZapierロゴがあります。

成功の例：B2B Tech Companyが品質リードを250％増加させると

より明確にするために、B2Bソフトウェアサービスを提供するハイテク企業の例を挙げたいと思います。彼らはWebflowに優れたコンテンツハブを持っており、一貫した顧客知識を提供しますが、問題は「誰が何を読むかわからない」と、それはすべて同じであることです。

接続する前に：営業チームは電子メール名と電話番号のみを受け取りました。 Leadが記事を読んだことを知らずに、WebFlow Webサイトで「見積もりをリクエスト」してください。 「機能の比較」、または以前に「ケーススタディ」を入力したことがありますか？話すことを難しくします

HubspotとのWebFlow接続の後：彼らは追跡コードを埋め、それが完了するとすぐにHubSpotフォームに切り替えました。奇跡が起こりました！これで、新しいリードがセールスチームに入ったとき、Hubspotでそのリードのすべての「タイムラインアクティビティ」を見ることができます。

• 「ああ！Khunは、このFacebook Camキャンペーンから来ています。」
• 「彼は特に自動化されたワークフローの記事に興味があります。3つの記事を読んでください。」
• 「彼は私たちの価格設定も2回見るように押し付けました！」

結果：営業チームは会話を直接開くことができます。 （「あなたは私たちの自動化に特に興味があると思います...」）顧客は、会社が彼の問題を本当に理解していると感じさせます。彼らは「はい」品質のリードに集中できるからです

イラストのプロンプト：顧客のタイムラインアクティビティを示すハブスポット画面「表示されたページ： /blog /x」、「表示されたページ： /価格」、「記入フォーム：デモリクエスト」などのさまざまなアクティビティがあります。

あなたの手を握ってください！ HubSpotを段階的なWebflowに接続する方法（すぐに使用できます）。

まだそれをする準備はできましたか？直接接続する方法（直接統合）を見てみましょう。これは徹底的に最良の方法です。あなたが思っているよりも簡単だと言うことができます！

ステップ1：HubSpotトラッキングコードを検索してコピーします

1. HubSpotアカウントにログインします
2. 右上隅の設定アイコン（設定）をクリックします。
3. トラッキングと分析の左メニューで
4. 「埋め込みコード」と呼ばれるコードボックスが表示されます。そのボックスのすべてのコードを保存します。

ステップ2：追跡コードを取り、WebFlowに埋め込みます。

1. Webflowプロジェクトを開き、サイト設定（デザイナーではありません）に移動します。
2. [カスタムコード]タブを選択します。
3. ヘッドコードという名前のチャンネルで、HubSpotからコピーされたコードを配置します。
4. 変更を保存して、ウェブサイトをもう一度公開しますフォロワーのインストールを完了しました！

ステップ3：hubspotでフォームを作成します。

1. Hubspotに戻り、マーケティング> Lead Capture>フォームに戻ります。
2. 新しいフォームを作成し（フォームを作成）、タイプ組み込みフォームを選択します。
3. 名、姓、電子メールなど、希望の配置フォームを設計し、メッセージチャンネルがある場合があります。
4. 「無料のデモを入手」や「電子書籍をダウンロードする」など、面白いように、ボタンの呼び出し呼び出しを調整します
5. 設計が終了したら、右上隅の更新または公開

ステップ4：HubSpotフォームをWebFlowデザイナーに埋め込みます。

1. HubSpotのフォームで、 [共有]、フォームの「埋め込みコード」をコピーします。
2. Webflowデザイナーに戻りますあなたの義務を開いてください。フォームを置きたい（お問い合わせなど）。
3. 目的の位置に埋め込まれたツールをドラッグします
4. 窓が開いています。 Hubspotからコピーされたコードを持ち込んで、下に置き、 Save＆Closeを押します。
5. あなたのウェブサイトをもう一度公開してください。そして、実際のWebサイトを開くようにしてください。HubSpotのフォームが表示されます！

これだけ、WebFlow WebサイトはすでにHubSpotに接続されています。記入されたすべての情報は、追跡データですぐにCRMに登場し、リードの育成自動化が簡単になります！

イラストのプロンプト：4-理解しやすい4ステップインフォグラフィック画像。各ステップにアイコンがあります（アイコンコード、WebFlow設定アイコン、Hubspotフォーム、要素アイコンがあります

人々がウェブフローとハブスポット接続について疑う傾向がある（FAQ）

Q1：WebFlowとHubspotを使用する必要がありますか？

A： カスタムコード機能を使用して追跡コードを埋め込むことができるように、お金（コアプラン）を失う計画（コアプラン） 追跡コードと使用するフォームを備えた無料プランから始めることができます

Q2：Hubspotフォームの設計を当社のWebサイトに調整できますか？

A：はい、HubSpot形式では、「スタイル」タブがありますので、ブランドに合わせて色、フォント、顔をある程度調整できます。しかし、本当にカスタマイズしたい場合は、コードを直接記述するために少しのCSS知識が必要になる場合があります。

Q3：元のWebflowフォームの情報は何をしますか？

A：Webflowにあった古いデータは同じ場所に残ります。 CSVファイルにエクスポートしてから、HubSpotにインポートして、すべての顧客情報を1か所に組み合わせることができます。

Q4：これらのコードはWebを遅くしますか？

A：HubSpotの追跡コードは、メインディスプレイを妨げることなくWebサイトの他の部分と一緒にロードされることを意味するため、Web速度への影響は非常に少ないことを意味します。ほとんど感じられないまで

イラストのプロンプト：WebFlowとHubspotのロゴを並べて大きな質問アイコン（？）。

概要：美しいウェブサイトを今日リード生産マシンに変更してください！

HubspotとのWebFlow接続は、もはや恐ろしい技術的な問題ではありませんが、デジタルの世界で真剣に成長したいすべての企業にとって「必要な投資」です。追跡コードをインストールしてHubSpotフォームに切り替えるのに少し時間があるので、これまでに受け取ったことのないマーケティングの可能性が解除されます。

マニュアルの作業時間を停止し、エラーに満ちていて、360度の顧客の顧客の旅を見始め、本当に顧客である自動マーケティングキャンペーンを作成できます。美しいWebflowのWebサイトを1日24時間働く「高品質のリード生産機械」に変更する時が来ました。

待たないで！私がすることをお勧めする手順を持ってきてみてください。また、データ駆動型の市場がどれほど強力であるかがわかります。より複雑な自動化システムのセットアップを支援する専門家が必要な場合は、 N8N Automation Expert Teamがまたは、最初のWebflow Webサイトの設計と開発サービス、お会いできます！

イラストのプロンプト：手をしっかりと保持するWebFlowとHubspotロゴを背景にした品質リードの数の成長を示すグラフ画像

‍