Webflowでアイテムが公開されたら、GitHubでIssueを作成する
試してみる
■概要
Webflowで新しいコンテンツやブログ記事を公開するたびに、開発タスクとしてGitHubに手動でIssueを作成する作業は、手間がかかる上に転記ミスも起こりがちではないでしょうか。このワークフローは、WebflowとGitHubを連携させることで、こうした定型業務の自動化を実現します。Webflowで新しいアイテムが公開されると、その情報をもとにGitHubのIssueが自動で作成され、開発チームへの共有を円滑にします。
■このテンプレートをおすすめする方
・WebflowとGitHub間の情報連携を手作業で行い、非効率を感じているWeb担当者の方
・Webサイトのコンテンツ公開と開発タスクの連携を、よりスムーズに行いたいチームリーダーの方
・Webサイトの運用フローを自動化し、ヒューマンエラーを削減したいと考えている方
■注意事項
・Webflow、GitHubのそれぞれとYoomを連携してください。
・Webflowの内容を取得する方法は下記を参照ください。
https://intercom.help/yoom/ja/articles/5404443
「Webflowでコンテンツを公開するたびに、GitHubで手動でIssueを作成して開発チームに連携している…」
「CMSの更新と開発タスクの管理が別々のツールで行われていて、二度手間や連携漏れが発生している…」
このように、WebflowとGitHub間での手作業による情報連携に、非効率さやストレスを感じていませんか？
もし、Webflowでのコンテンツ更新をトリガーに、GitHubのIssueやプルリクエストを自動で作成する仕組みがあれば、これらの煩わしい作業から解放され、手作業によるミスをなくし、よりスムーズな開発・コンテンツ運用プロセスを実現できます。
今回ご紹介する自動化の設定は、プログラミングの知識がなくても簡単に設定できるため、これまで自動化を諦めていた方でもすぐに導入することが可能です。
ぜひこの機会に作業をもっと楽にしましょう！
とにかく早く試したい方へ
YoomにはWebflowとGitHubを連携するためのテンプレートが用意されているので、今すぐ試したい方は以下よりバナーをクリックしてスタートしましょう！
Webflowでアイテムが公開されたら、GitHubでIssueを作成する
試してみる
■概要
Webflowで新しいコンテンツやブログ記事を公開するたびに、開発タスクとしてGitHubに手動でIssueを作成する作業は、手間がかかる上に転記ミスも起こりがちではないでしょうか。このワークフローは、WebflowとGitHubを連携させることで、こうした定型業務の自動化を実現します。Webflowで新しいアイテムが公開されると、その情報をもとにGitHubのIssueが自動で作成され、開発チームへの共有を円滑にします。
■このテンプレートをおすすめする方
・WebflowとGitHub間の情報連携を手作業で行い、非効率を感じているWeb担当者の方
・Webサイトのコンテンツ公開と開発タスクの連携を、よりスムーズに行いたいチームリーダーの方
・Webサイトの運用フローを自動化し、ヒューマンエラーを削減したいと考えている方
■注意事項
・Webflow、GitHubのそれぞれとYoomを連携してください。
・Webflowの内容を取得する方法は下記を参照ください。
https://intercom.help/yoom/ja/articles/5404443
WebflowとGitHubを連携してできること
WebflowとGitHubのAPIを連携すれば、WebflowでのアクションをきっかけにGitHubでの操作を自動化したり、その逆の連携も可能になります。
これにより、コンテンツ管理と開発のワークフローがシームレスに繋がり、業務効率を向上させることができます。
ここでは、具体的な自動化の例をいくつかご紹介しますので、気になる内容があれば、ぜひクリックしてみてください！
Webflowでアイテムが公開されたら、GitHubでIssueを作成する
Webflowで新しいブログ記事や製品情報などのアイテムを公開した際に、その情報を基にGitHubリポジトリに新しいIssueを自動で作成できます。
これにより、コンテンツ公開に伴う修正や確認タスクの作成漏れを防ぎ、開発チームへ迅速かつ正確に情報を伝達できるため、手動でのIssue作成の手間と時間を削減します。
Webflowでアイテムが公開されたら、GitHubでIssueを作成する
試してみる
■概要
Webflowで新しいコンテンツやブログ記事を公開するたびに、開発タスクとしてGitHubに手動でIssueを作成する作業は、手間がかかる上に転記ミスも起こりがちではないでしょうか。このワークフローは、WebflowとGitHubを連携させることで、こうした定型業務の自動化を実現します。Webflowで新しいアイテムが公開されると、その情報をもとにGitHubのIssueが自動で作成され、開発チームへの共有を円滑にします。
■このテンプレートをおすすめする方
・WebflowとGitHub間の情報連携を手作業で行い、非効率を感じているWeb担当者の方
・Webサイトのコンテンツ公開と開発タスクの連携を、よりスムーズに行いたいチームリーダーの方
・Webサイトの運用フローを自動化し、ヒューマンエラーを削減したいと考えている方
■注意事項
・Webflow、GitHubのそれぞれとYoomを連携してください。
・Webflowの内容を取得する方法は下記を参照ください。
https://intercom.help/yoom/ja/articles/5404443
Webflowでアイテムが作成されたら、テキストを抽出してGitHubでプルリクエストを作成する
Webflowで新しいアイテムが作成されたら、アイテム内の特定のテキスト情報を自動で抽出し、その内容を基にGitHubでプルリクエストを自動生成します。
こちらは正規表現などを用いたデータ抽出処理を含むため、コンテンツのドラフト作成と同時に開発関連のプルリクエストを起票でき、レビュープロセスを迅速に開始することが可能になります。
Webflowでアイテムが公開されたら、テキストを抽出してGitHubでプルリクエストを作成する
試してみる
■概要
Webflowで管理しているコンテンツをGitHubのリポジトリに反映させる際、手作業でのプルリクエスト作成に手間や時間を要していませんか。また、手作業による情報転記は、ミスの原因にもなりかねません。このワークフローを活用することで、WebflowとGitHubの連携を自動化できます。Webflowで新しいアイテムが作成されると、その内容を基にGitHubでプルリクエストが自動で作成され、コンテンツ更新と開発フローの連携を円滑にします。
■このテンプレートをおすすめする方
・Webflowでのコンテンツ更新とGitHubでのバージョン管理を手作業で行っている方
・WebflowとGitHubを連携させ、効率的なWebサイトの運用フローを構築したいチーム
・手作業による情報転記や、プルリクエスト作成時の設定ミスを防止したいWeb担当者の方
■注意事項
・Webflow、GitHubのそれぞれとYoomを連携してください。
・Webflowの内容を取得する方法は下記を参照ください。
https://intercom.help/yoom/ja/articles/5404443
WebflowとGitHubの連携フローを作ってみよう
それでは、さっそく実際にWebflowとGitHubを連携したフローを作成してみましょう！
今回はYoomを使用して、ノーコードでWebflowとGitHubの連携を進めていきますので、もしまだYoomのアカウントをお持ちでない場合は、こちらの登録フォームからアカウントを発行しておきましょう。
[Yoomとは]
フローの作成方法
今回は「Webflowでアイテムが公開されたら、GitHubでIssueを作成する」フローを作成していきます！
作成の流れは大きく分けて以下です。
- WebflowとGitHubをマイアプリ連携
- 該当のテンプレートをコピー
- Webflowのトリガー設定およびGitHubのアクション設定
- トリガーをONにし、フローが起動するかを確認
Webflowでアイテムが公開されたら、GitHubでIssueを作成する
試してみる
■概要
Webflowで新しいコンテンツやブログ記事を公開するたびに、開発タスクとしてGitHubに手動でIssueを作成する作業は、手間がかかる上に転記ミスも起こりがちではないでしょうか。このワークフローは、WebflowとGitHubを連携させることで、こうした定型業務の自動化を実現します。Webflowで新しいアイテムが公開されると、その情報をもとにGitHubのIssueが自動で作成され、開発チームへの共有を円滑にします。
■このテンプレートをおすすめする方
・WebflowとGitHub間の情報連携を手作業で行い、非効率を感じているWeb担当者の方
・Webサイトのコンテンツ公開と開発タスクの連携を、よりスムーズに行いたいチームリーダーの方
・Webサイトの運用フローを自動化し、ヒューマンエラーを削減したいと考えている方
■注意事項
・Webflow、GitHubのそれぞれとYoomを連携してください。
・Webflowの内容を取得する方法は下記を参照ください。
https://intercom.help/yoom/ja/articles/5404443
ステップ1：WebflowとGitHubをマイアプリ連携
ここでは、Yoomとそれぞれのアプリを連携して、操作が行えるようにしていきます。
まずは基本的な設定方法を解説しているナビをご覧ください！
それではここから今回のフローで使用するアプリのマイアプリ登録方法を解説します。
1．Webflowのマイアプリ連携
Yoomの画面左側にある「マイアプリ」→「新規接続」をクリックしましょう。
「アプリ名で検索」でSlackを探すか、アプリ一覧から探してください。
以下の画面が表示されるのでWebflowで確認し入力しましょう。
入力後、マイアプリにWebflowが表示されていれば連携の完了です。
2．GitHubのマイアプリ連携
まず先にGitHubのアプリ連携を行います。
新規接続をクリックし、検索窓にGitHubと入力します。
表示された候補をクリックすると、サインイン画面に移行します。
GitHubに登録しているユーザー名またはメールアドレスとパスワードを入力し、サインインしてください。
登録メールアドレスに認証コードが送付されます。
届いた認証コードを入力して『確認する』をクリックしてください。
認証が正常に行われると、YoomのマイアプリにGitHubが表示されます。
ステップ2：テンプレートをコピーする
続いてYoomのテンプレートをコピーします。
以下バナーのテンプレートの「このテンプレートを試してみる」のアイコンをクリックします。
Webflowでアイテムが公開されたら、GitHubでIssueを作成する
試してみる
■概要
Webflowで新しいコンテンツやブログ記事を公開するたびに、開発タスクとしてGitHubに手動でIssueを作成する作業は、手間がかかる上に転記ミスも起こりがちではないでしょうか。このワークフローは、WebflowとGitHubを連携させることで、こうした定型業務の自動化を実現します。Webflowで新しいアイテムが公開されると、その情報をもとにGitHubのIssueが自動で作成され、開発チームへの共有を円滑にします。
■このテンプレートをおすすめする方
・WebflowとGitHub間の情報連携を手作業で行い、非効率を感じているWeb担当者の方
・Webサイトのコンテンツ公開と開発タスクの連携を、よりスムーズに行いたいチームリーダーの方
・Webサイトの運用フローを自動化し、ヒューマンエラーを削減したいと考えている方
■注意事項
・Webflow、GitHubのそれぞれとYoomを連携してください。
・Webflowの内容を取得する方法は下記を参照ください。
https://intercom.help/yoom/ja/articles/5404443
以下の画像のような画面が表示されたらテンプレートのコピーは完了です。
ステップ3：トリガーとなるWebflowの設定
Webflowでコレクションのアイテムが公開されたことを自動化のトリガーにするための設定を行います。
以下の赤枠をクリックしましょう。
連携アカウントとアクションを選択する画面が表示されるので、今回連携するWebflowのアカウントを確認し「次へ」をクリックします。
アプリトリガーのAPI接続設定が表示されるので、設定を進めていきましょう。
トリガーの起動間隔は5分・10分・15分・30分・60分から選択できます。
※ご利用プランによって、設定できるトリガーの最短間隔が違うので、その点は要チェックです。
なお、基本的にはそのプランの最短の起動間隔にしてお使いいただくことをおすすめします。
サイトIDとコレクションIDを下記のように候補から入力しましょう。
ここでWebflowに移動し、設定したコレクションでアイテムを公開してください。
フローボットに戻り、「テスト」をクリックします。
Webflowから取得した値が表示されているか確認しましょう。
この後、この取得した値の内容を入力に使用することができます。
テスト成功後「保存する」をクリックしましょう。
ステップ4：GitHubでIssueを作成する
Webflowでアイテムが公開されたらGitHubでIssueを作成するための設定を行います。
以下の赤枠をクリックしましょう。
連携アカウントとアクションを選択する画面が表示されるので、今回連携するGitHubのアカウントを確認し「次へ」をクリックします。
以下の画面が表示されるのでGitHubで確認し入力しましょう。
タイトルには以下のようにWebflowから取得した値から「name」を選択し、入力します。
内容にはWebflowから取得した値よりdescriptionを選択し、入力します。
入力後「テスト」をクリックし、実際にGitHubでIssueが作成されているか確認しましょう。
確認ができたら「保存する」をクリックします。
※下記はIssueの作成イメージです。
ステップ5：トリガーをONに設定しフロー稼働の準備完了
以下の画面の赤枠部分「トリガーをON」をクリックすることで、フローボットが自動で起動します。
設定お疲れ様でした！
GitHubのデータをWebflowに連携したい場合
今回はWebflowからGitHubへデータを連携する方法をご紹介しましたが、逆にGitHubからWebflowへのデータ連携を実施したい場合は、下記のテンプレートも併せてご利用ください。
開発側の進捗をコンテンツ管理側に自動で反映させることができ、チーム全体の情報共有がよりスムーズになります。
GitHubでIssueが作成されたら、Webflowにアイテムを追加する
GitHubのリポジトリで新しいIssueが作成された際に、そのIssueのタイトルや内容をWebflowのCMSコレクションにアイテムとして自動で追加します。
この連携により、開発タスクの発生をWebflow側で迅速に把握でき、関連コンテンツの準備や更新作業を迅速に開始できます。
GitHubでIssueが作成されたら、Webflowにアイテムを追加する
試してみる
■概要
WebflowとGitHubを連携させて業務効率化を図りたいと考えているものの、手作業での情報反映に課題を感じていませんか。Issueの作成のたびにWebflowに手動でアイテムを追加する作業は、時間もかかり、転記ミスの原因にもなり得ます。このワークフローを活用すれば、GitHubで新しいIssueが作成された際に、Webflowのコレクションへアイテムを自動で追加できます。これにより、手作業による連携の手間をなくし、スムーズな情報共有を実現します。
■このテンプレートをおすすめする方
・WebflowとGitHubを利用しており、Issue情報をWebサイトのコンテンツとして活用したい方
・GitHubのIssueをWebflowへ手作業で転記しており、その作業を自動化したいと考えている方
・WebflowとGitHubの連携を通じて、開発や制作の進捗管理を効率化したいプロジェクト担当者の方
■注意事項
・GitHub、WebflowのそれぞれとYoomを連携してください。
・トリガーは5分、10分、15分、30分、60分の間隔で起動間隔を選択できます。
・プランによって最短の起動間隔が異なりますので、ご注意ください。
GitHubでプルリクエストが作成されたら、Webflowにアイテムを追加する
GitHubでプルリクエストが作成されたら、その情報をWebflowのCMSに新しいアイテムとして自動登録します。
これにより、コードの変更やレビュー状況をWebサイトの管理画面上で一覧化できるため、マーケティング担当者やコンテンツ編集者が開発の進捗を簡単に確認できるようになります。
GitHubでプルリクエストが作成されたら、Webflowにアイテムを追加する
試してみる
■概要
GitHubでの開発進捗をWebflowサイトに反映させる際、プルリクエストの情報を手作業でコピー＆ペーストしていませんか？この作業は手間がかかる上に、転記ミスや更新漏れの原因にもなり得ます。このワークフローを活用すれば、GitHubとWebflowの連携が自動化され、プルリクエストが作成されると同時にWebflowのコレクションにアイテムが追加されるため、こうした課題を円滑に解決します。
■このテンプレートをおすすめする方
・GitHubとWebflowを連携させ、開発の進捗管理を効率化したい方
・プルリクエストの情報をWebflowのCMSに手作業で転記している方
・開発チームとWebサイト管理チーム間の情報共有を円滑にしたい方
■注意事項
・GitHub、WebflowのそれぞれとYoomを連携してください。
・トリガーは5分、10分、15分、30分、60分の間隔で起動間隔を選択できます。
・プランによって最短の起動間隔が異なりますので、ご注意ください。
WebflowやGitHubのAPIを使ったその他の自動化例
今回ご紹介した連携以外でも、WebflowやGitHubのAPIを活用してさまざまな業務を自動化することが可能です。
もし気になるものがあればぜひこちらもお試しになってみてください！
Webflowを使った便利な自動化例
Webflowの情報を様々なアプリに自動登録ができるため、業務の効率化やヒューマンエラーの削減が実現できます。
また、Googleフォームの回答をWebflowに登録することも可能なためユーザーからの入力情報をスムーズに反映させることが可能です。
Googleフォームの回答内容でWebflowのコレクションにアイテムを追加する
試してみる
■概要
「Googleフォームの回答内容でWebflowのコレクションにアイテムを追加する」ワークフローは、Webflow formを活用して収集したデータを自動的にWebflowのコレクションに登録します。
これにより、手動でのデータ入力作業を削減し、効率的なサイト運営をサポートします。
YoomのAPI連携機能を駆使し、スムーズなデータ移行を実現します。
■このテンプレートをおすすめする方
・Googleフォームを利用して顧客やユーザーからの情報を収集しているウェブサイト運営者
・Webflowを使ってサイトを構築し、コレクションを活用してコンテンツ管理を行っているデザイナーや開発者
・手動でのデータ入力に時間を取られず、業務を自動化したいと考えているビジネスオーナー
・Yoomを活用して複数のSaaSアプリ間の連携を効率化したい方
■注意事項
・WebflowとGoogleフォームのそれぞれとYoomを連携してください。
・トリガーは5分、10分、15分、30分、60分の間隔で起動間隔を選択できます。
・プランによって最短の起動間隔が異なりますので、ご注意ください。
・Googleフォームでのアウトプットの取得方法は下記を参考にしてください。
https://intercom.help/yoom/ja/articles/5505530
Webflowのフォームが送信されたらGoogleスプレッドシートに追加する
試してみる
Webflowのフォームが送信されたらGoogleスプレッドシートに追加するフローです。
Webflowで注文が発生したらMicrosoft Excelに追加する
試してみる
Webflowで注文が発生したらMicrosoft Excelに追加するフローです。
Webflowでコレクションのアイテムが作成されたらAirtableに追加する
試してみる
Webflowでコレクションのアイテムが作成されたらAirtableに追加するフローです。
Webflowでコレクションのアイテムが作成されたらNotionに追加する
試してみる
Webflowでコレクションのアイテムが作成されたらNotionに追加するフローです。
GitHubを使った便利な自動化例
GitHubにIssueが作成されたら様々なアプリに自動登録ができるため、タスク管理や進捗共有が迅速に行えるようになり、チーム全体の連携がスムーズになります。
また、Salesforceの情報をGitHubに追加することもできるため、顧客要望に基づいた迅速な対応や改善が可能です。
GitHubでIssueが作成されたらJira Softwareに課題を登録する
試してみる
GitHubでIssueが作成されたら、自動的にJira Softwareに課題を登録するフローボットです。
GitHubにIssueが作成されたら、HubSpotにチケットを作成する
試してみる
■概要
GitHubで管理しているIssueを、カスタマーサポートが利用するHubSpotへ手作業で転記していませんか？
この作業は手間がかかるだけでなく、情報の入力ミスや対応漏れの原因にもなり得ます。
このワークフローは、GitHubとHubSpotを連携し、新しいIssueが作成された際に自動でHubSpotにチケットを作成するため、開発とサポートチーム間の連携を円滑にし、顧客対応の効率化を実現します。
■このテンプレートをおすすめする方
・GitHubとHubSpotを利用しており、開発と顧客サポートの連携を効率化したい方
・GitHubのIssueを手動でHubSpotのチケットに転記する作業に手間を感じている方
・開発チームとサポートチーム間の情報共有を自動化し、スムーズな対応を目指す方
■注意事項
・GitHub、HubSpotのそれぞれとYoomを連携してください。
・トリガーは5分、10分、15分、30分、60分の間隔で起動間隔を選択できます。
・プランによって最短の起動間隔が異なりますので、ご注意ください。
GitHubでIssueが作成されたら、Googleカレンダーに予定を追加する
試してみる
■概要
GitHubで新しいIssueが作成された際に、手動でGoogleカレンダーにタスクを登録していませんか？
この作業は手間がかかるだけでなく、登録漏れによる対応遅延のリスクも伴います。
このワークフローを活用すれば、GitHubとGoogleカレンダーを連携させ、Issue作成をトリガーに自動でカレンダーへ予定を追加できます。
これにより、タスク管理の効率化と抜け漏れ防止を実現します。
■このテンプレートをおすすめする方
・GitHubとGoogleカレンダーを併用し、タスクの二重入力に手間を感じている方
・GitHubのIssueに基づいたスケジュール管理を自動化したいプロジェクトマネージャーの方
・Googleカレンダーへの予定登録漏れを防ぎ、タスク管理を効率化したい開発チームの方
■注意事項
・GitHub、GoogleカレンダーのそれぞれとYoomを連携してください。
・トリガーは5分、10分、15分、30分、60分の間隔で起動間隔を選択できます。
・プランによって最短の起動間隔が異なりますので、ご注意ください。
GitHubでPull Requestが作成されたらTrelloにカードを作成する
試してみる
■概要
「GitHubでPull Requestが作成されたらTrelloにカードを作成する」フローは、ソフトウェア開発とプロジェクト管理を連携させる業務ワークフローです。
開発者がGitHub上でプルリクエストを作成すると、自動的にTrelloに対応するカードが生成されます。これによりタスクの進捗管理が容易になり手動でのカード追加作業を省くことができます。
TrelloとGitHubの連携を活用することでチーム全体の作業効率とコミュニケーションを向上させましょう。
■このテンプレートをおすすめする方
・GitHubとTrelloを併用してプロジェクト管理を行っている開発チームのメンバー
・プルリクエストの管理を効率化し、タスクの可視化を図りたいプロジェクトマネージャー
・手動でのTrelloカード作成に時間を取られず、自動化による業務効率化を目指すチームリーダー
・GitHubとTrelloの連携を強化し、開発プロセスとプロジェクト管理をシームレスに統合したいIT担当者
■注意事項
・GitHub、TrelloのそれぞれとYoomを連携してください。
SalesforceでToDoオブジェクトが登録されたらGitHubに追加する
試してみる
SalesforceでToDoオブジェクトが登録されたらGitHubに追加するフローです。
まとめ
WebflowとGitHubの連携を自動化することで、これまで手作業で行っていたコンテンツ更新と開発タスク間の情報転記作業をなくし、ヒューマンエラーを根本から防ぐことができます。
これにより、コンテンツチームと開発チームの連携が強化され、担当者はそれぞれが本来注力すべき創造的な業務に集中できる環境が整うでしょう！
今回ご紹介したような業務自動化を実現できるノーコードツール「Yoom」を使えば、プログラミングの知識がない方でも、直感的な操作で簡単に業務フローを構築できます。
もし自動化に少しでも興味を持っていただけたなら、ぜひこちらの登録フォームから無料登録してYoomによる業務効率化を体験してみてください！
よくあるご質問
Q：特定の条件を満たすアイテム公開時のみ、今回のフローを実行するようにできますか？
A：はい、可能です。
有料プランで使える「分岐」機能を使用することで、特定のキーワードや特定カテゴリアイテム作成時にのみフローを進めることができます。
Q：Issue作成後、Slackなど別ツールへも通知できますか？
A：はい、可能です。
フローボットの画面でIssue作成した後の「＋」をクリックするとオペレーションを追加でき、次のアクションの設定が可能です。
検索窓に「Slack」と入力し、メッセージを送信するアクションを設定することでSlackへ通知できます。
Q：連携が失敗した場合、通知はどうなりますか？
A：自動化が失敗した場合、Yoomに登録したメールアドレスに通知が届きます。
また、エラー時の対応方法については、こちらをご覧ください。
ヘルプページで解決しない場合は、サポート窓口を利用することもできます。
.avif)
.png)
