・
「Squarespaceで運営しているECサイトの注文情報を、Webflowで作ったコーポレートサイトにも反映させたい」
「新商品を登録するたびに、SquarespaceとWebflowの両方で手作業更新するのが面倒で、ミスも起きやすい…」
このように、複数のWebサイトを運営する中で、手作業によるデータ連携に限界を感じていませんか?
もし、<span class="mark-yellow">Squarespaceのデータを自動的にWebflowに登録したり、更新したりする仕組み</span>があれば、こうした日々の反復作業を削減できます。サイトのコンテンツ企画やマーケティング施策といった、より重要な業務に集中できる時間を生み出すことができるでしょう!
今回ご紹介する自動化の設定は、プログラミングの知識がなくても簡単に設定可能です。設定にかかる手間や時間もわずかなので、ぜひこの機会に導入して作業をもっと楽にしましょう!
Yoomには<span class="mark-yellow">SquarespaceとWebflowを連携するためのテンプレート</span>が用意されています。
今すぐ試したい方は以下よりバナーをクリックしてスタートしましょう!
SquarespaceとWebflowのAPIを連携させれば、これまで手作業で行っていた面倒なデータ転記作業を自動化できます。
例えば、Squarespaceでの注文発生や商品登録をトリガーに、WebflowのCMSアイテムを自動で作成・更新することが可能です。
これにより、サイト間の情報同期の手間を大幅に削減できます。
ここでは具体的な自動化例を複数紹介していくので、気になる内容があれば、ぜひクリックしてみてください!
Squarespaceで新規の注文が入った際に、その注文情報をWebflowのCMSコレクションにアイテムとして自動で追加するフローです。
この連携により、<span class="mark-yellow">手動でのデータ転記作業が不要となり、顧客情報や注文履歴をWebflow側でも一元的に管理できる</span>ようになります。
Squarespaceに新しい商品を追加した際に、その商品情報をWebflowのCMSコレクションにアイテムとして自動で登録するフローです。
この仕組みにより、<span class="mark-yellow">ECサイトとコーポレートサイトやブログ間での商品情報の同期が簡単になり、最新の情報をユーザーに届ける</span>ことができます。
手作業による更新漏れや入力ミスを防ぎ、サイト運営の効率を向上させます。
それでは、さっそく実際にSquarespaceとWebflowを連携したフローを作成してみましょう!
今回はYoomを使用して、ノーコードでSquarespaceとWebflowの連携を進めていきます。
もしまだYoomのアカウントをお持ちでない場合は、こちらの登録フォームからアカウントを発行しておきましょう。
[Yoomとは]
今回は「Squarespaceで注文情報が作成されたら、Webflowにアイテムを追加する」フローを作成していきます!
作成の流れは大きく分けて以下です。
Yoomとそれぞれのアプリを連携して、アプリごとの操作を行えるようにしましょう。この設定は初回のみ必要です。
先ずは、基本的な設定方法を解説しているナビをご覧ください!
それでは、今回のフローで使用するSquarespaceとWebflowのマイアプリ登録方法を解説していきます。
1.Squarespaceの登録方法
Squarespaceを検索すると下記画面が表示されます。
赤枠部分の注釈を確認したら「アカウント名」「アクセストークン」を入力してください。
「追加」ボタンをクリックしたらSquarespaceの連携完了です!
2.Webflowの登録方法
先ほどのマイアプリ画面に戻り、今度はWebflowを検索してください。
下記画面が表示されたら赤枠を確認し「アカウント名」「アクセストークン」を入力します。
「追加」ボタンをクリックしたら、Webflowの連携完了です。
Yoomのテンプレートを使うことで、簡単に業務自動化を始められます!
まずは、下記テンプレートページにアクセスし、「このテンプレートを試してみる」をクリックしましょう。
テンプレートが管理画面に追加されるので、「OK」を押して設定を進めてください。
まず最初に、Squarespaceのトリガー設定を行います!
「注文情報作成・更新されたら」という項目をクリックしてください。
次のページは、初期設定されているので、確認できたら「次へ」ボタンを押してください。
トリガーの起動タイミングは5分、10分、15分、30分、60分のいずれかを選択可能です。
基本的には、最短の起動間隔がおすすめです!
※ご利用プランによって、設定できるトリガーの最短間隔が異なりますのでご注意ください。
Squarespaceにテスト用の注文情報を作成してください。
(架空の情報で問題ありません!)
作成できたらYoomの画面に移り「テスト」ボタンを押しましょう。
テストが成功すると、Squarespaceに先ほど作成した注文情報が取得した値(アウトプット)に表示されます。(下記画像は見本のため表示されていません。)
ここで取得した値は、後続の設定で活用可能です!
確認ができたら「保存する」ボタンを押しましょう。
※取得した値(アウトプット)についての説明は、こちらをご確認ください。
続いて、Squarespaceの「注文日時」と「最終更新日時」が等しい時のみ分岐し、Webflowに連携できるように設定を行います。
「分岐する」という項目をクリックしましょう。
※「分岐する」オペレーションは、ミニプラン以上でご利用いただけます。フリープランで利用するとエラーになってしまうのでご注意ください。
※ミニプランなどの有料プランは2週間の無料トライアルが可能です。無料トライアル中なら、普段制限されているアプリや機能も自由にお試しいただけますので、ぜひ活用してみてください。
タイトルは、変更可能です。
オペレーションは「注文情報作成・更新されたら」を、取得した値は「注文日時」をそれぞれプルダウンより選択します。
分岐条件は、ステップ3で取得した値から「最終更新日時」を選択してください。
設定が完了したら「保存する」ボタンを押しましょう。
次にWebflowと連携して、コレクションにアイテムを自動追加する設定を行います!
「コレクションにアイテムを追加」という項目をクリックしましょう。
下記画面の情報に誤りが無いか確認したら、次のページに進んでください。
サイトIDとコレクションIDは、枠内をクリックし表示された候補から選択します。
続いて、フィールド名と値を設定しましょう。
フィールドは、表示された候補から選択してください。
値は、ステップ3で取得した値を使って入力します。
下記画像のように取得した値を使うと、都度変更することなくSquarespaceの情報を引用可能です!
「+フィールド情報を追加」をクリックすると、フィールド情報を追加できます。
用途に合わせて設定してください。
ここまで設定が完了したら、テストを実行しましょう。
テストが成功すると、Webflowのコレクションにアイテムが自動登録されるので確認してください。
確認できたらYoomの画面に戻り、「保存する」ボタンをクリックしてください。
最後に、下記画面が表示されるので「トリガーをON」に設定しましょう。
これで、「Squarespaceで注文情報が作成されたら、Webflowにアイテムを追加する」フローの完成です!
今回はSquarespaceからWebflowへデータを連携する方法をご紹介しました。
逆にWebflowからSquarespaceへのデータ連携を実施したい場合は、下記のテンプレートも併せてご利用ください。
WebflowのCMSでコンテンツを作成し、それをトリガーにSquarespaceの商品情報を操作するといった、さらに高度な自動化も実現できます。
Webflowに新しいアイテム(例:製品紹介記事)が作成されたら、そのアイテム内の特定のテキストを自動で抽出し、Squarespaceに新しい商品として登録するフローです。
この連携により、<span class="mark-yellow">コンテンツ作成からECサイトへの商品登録までを一気通貫で自動化できるため、作業時間を短縮</span>し、マーケティング活動を加速させます。
Webflowのアイテム情報が更新された際に、その内容を読み取ってSquarespaceの在庫数を自動で調整するフローです。
この連携により、<span class="mark-yellow">複数の販売チャネル間での在庫情報のズレを防ぎ、手動更新の手間と機会損失のリスクをなくす</span>ことができます。
SquarespaceやWebflowのAPIを活用することで、様々な自動化の実現が可能になります。
Squarespaceで注文情報が作成されたら、Google スプレッドシートに注文者情報を登録したり、Slackに通知したりできます。また、注文情報が作成されたらAirtableに注文者情報を登録することも可能です。さらに、Google スプレッドシートで登録された商品情報をSquarespaceに作成・登録したり、Shopifyで商品情報が作成されたら、説明を要約しSquarespaceに商品を作成したりといった自動化も行えます。
Webflowのフォームが送信されたらHubSpotにチケットを作成したり、SalesforceやNotionに追加したりできます。また、Googleフォームの回答内容やNotionデータベースに追加された情報で、Webflowのコレクションにアイテムを追加するといった自動化も可能です。
SquarespaceとWebflowの連携により、<span class="mark-yellow">これまで手作業で行っていたサイト間のデータ転記作業から解放され、ヒューマンエラーのリスクを削減できます。</span>
これにより、担当者はECサイトの売上分析やWebサイトのコンテンツ戦略といった、本来注力すべきコア業務に集中できる環境が整うでしょう。
今回ご紹介したような業務自動化を実現できるノーコードツール「Yoom」を使えば、プログラミングの知識がない方でも、直感的な操作で簡単に業務フローを構築可能です。
もし自動化に少しでも興味を持っていただけたなら、ぜひこちらから無料登録して業務の効率化を体験してみてください。
Q:連携条件を細かく設定することは可能ですか?
A:はい、可能です。ステップ4で設定した分岐アクションで、分岐条件を変更したり追加することで、より細かく連携条件を設定することができます。
分岐についての詳細はこちらを確認しましょう。
Q:連携が失敗した場合の通知や対処法は?
A:フローボットがエラーになると、Yoomに登録する際に設定したメールアドレスに通知が送られます。通知内容にはエラーになったオペレーションも記載されているので、エラーの発生個所がすぐにわかります。
通知先は、メールの他にSlackやChatworkも設定できます。詳しい設定方法はこちらのヘルプページをご参照ください。
Q:データの連携はリアルタイムで行われますか?
トリガーは5分、10分、15分、30分、60分の間隔で選択できますが、リアルタイムで連携しているわけではありません。また、トリガーの起動間隔の最短は、ミニプランで10分、チームプランで5分のため素早い連携を求める場合は、より上のプランが良いでしょう。
詳しくはこちらのページをチェックしてみてください。