CREAMサポートブログ | はじめてのメディアサイト運用に

オウンドメディアに使いやすいフォームサービスを導入(formrun編)

オウンドメディアに使いやすいフォームサービスを導入(formrun編)

企業のオウンドメディアやブログへの導入が進むメディア構築CMS「CREAM」を使う際に、効果が高まる外部サービスとの組み合わせ活用の紹介です。今回はCVアップやコミュニケーション促進に、フォームサービス「formrun」を埋め込み導入します。


フォームサービスとは?

Webサイト上の入力欄に、直接必要な内容を記入して送信できるツールです。送信された情報はクラウドサービスに送られ、管理画面内で一覧表示ができ、指定先に通知が届きます。

例えば、お問い合わせや資料請求、イベント申し込み、採用応募などさまざまな使い方があります。

たんにメールの形式になって指定のメールアカウントに送信される「メールフォーム」もありますが、今回は管理画面に送信内容が蓄積されるWebサービス形式のものを「フォームサービス」と扱います。

CREAM標準のお問い合わせフォーム

CREAMにも標準で「お問い合わせフォーム」機能が用意されています。

この機能はメールとして送信されるのみで情報が残りません。入力項目が、名前、電話番号、メールアドレス、問い合わせ内容、の4点で固定になっていて、また「Gmailアプリパスワード」という情報が事前に必要なため、実は使いやすいとはいい難い機能です。

CREAMの主となる機能ではないため、この機能改善を行う予定はしばらくありません。

CREAM標準の問い合わせフォームです。(モバイル表示)

メールに転送されるだけのシンプルな「メールフォーム」です。

外部のフォームサービスを導入するには

CREAMを企業のオウンドメディアや企業ブログとして使っていただく際には、もっと使いやすく専門特化したフォームサービスを組み合わせて、リード獲得などのコンバージョン(CV)につなげて欲しいと考えています。


そのため、外部のフォームサービスの導入方法を紹介していきます。今回は、弊社でも実際に使ってみて導入しやすさや使い勝手がとても良いと感じた『formrun(フォームラン)』をCREAMに導入する流れを具体的に説明します。


無料プランでも、ある程度までの機能が使えてしまうところがおすすめポイントです。

無料で使えるメールフォームと顧客管理 | formrun (フォームラン)

https://form.run/ja

シームレスに統合された顧客管理ツールで、成果につなげるプロセスへ。

大きな流れは以下のとおりです。

ポイントは、CREAMの「ページ作成」機能を使うところです。


  1. フォームの作成
  2. CREAMのHTMLページ作成
  3. フォームサービスで設定
  4. 必要に応じてGoogleアナリティクスを設定

フォームの作成

まず、formrunのアカウントを作成します。

https://form.run/signup/user

+新規フォーム作成

フォームクリエイターで作成する

に続いて、テンプレートを選択します。
あらかじめ、用途に応じた項目がセットされていて便利です。

フォームの項目を追加、もしくは削除しながら、項目の設定していきます。

入力欄だけでなく、選択肢やスパム対策チェック、画像やテキストのブロックも設置できます。

ブロック単位で自由に作成、移動できる点がCREAMの記事作成画面と似ています。

詳しくはformrunのヘルプページ「クリエイターフォームとは」をご覧ください。
https://faq.form.run/creatorform

クリエイターフォームとは

https://faq.form.run/creatorform

formrunでは、フォーム編集画面を使って誰でも簡単にフォームを作ることができます。 このページでは、フォーム編集画面の見方・使い方について説明します。 フォーム編集画面は、公開画面・完了画面(サンクスページ)・非公開画面の3つのページ設定が可能となっております。 また、カバー画像の推奨サイズもこちらから設定可能です。

フォーム設定画面にある「iframe埋め込みフォーム」を開き、スクリプト設置用のHTMLタグをコピーします。

ここでいったん、ブラウザの別タブで作業します。

CREAMのHTMLページ作成

CREAMの管理画面に管理者権限でログインし、「ページ作成」アイコンから進みます。

簡易ページ一覧の画面で「HTMLページ」ボタン

HTMLページ 一覧の画面で「追加」ボタン

「ページ追加」の画面が開きます。

HTML入力欄に、formrunの埋め込みタグを貼り付けます。

必要に応じて、フォームのあとに、補足情報を表示するためのHTMLを追記するのも良いでしょう。

URLに使われる「ページ名」は、すぐ使うためメモしておきましょう。

formrun埋め込みフォーム、モバイル表示の例です。

スパム対策の「reCAPTCHA」機能や、プライバシーポリシーのリンクURLを追加しています。

タスクル | 暮らしのお悩み解決サイトより。

formrunの設定をいくつか

別タブで残っている、formrunの「iframe埋め込みフォーム」に戻り、「フォーム設置URL」を入力します。

CREAMのHTMLページ作成で「contact」をページ名とした場合は、
CREAM導入トップページ/pages/contact/
が設置URLになります。

同様にHTMLページで「サンクスページ」を作成してあれば、「フォーム送信後リダイレクトURL」に設置URLを入力します。

サンクスページとは、フォーム送信後に開くページのことで「お問い合わせありがとうございました」の文章とともに、以降にアクションして欲しい内容や進んで欲しい遷移先を設定しておくページです。

実際のお問い合わせフォームです。

https://media.cream-cms.com/blog/pages/contact

実際のサンクスページです。

https://media.cream-cms.com/blog/pages/thanks

最低限のフォーム設置としてはここまでで完了なのですが、実際にフォームを活用するには、通知設定や自動返信などを設定しておくと良いでしょう。

「受信通知」の画面から、『メールアドレス』、『Slack』、『Chatwork』の受信設定ができます。

指定メールアドレスやSlack、Chatworkに、フォーム送信内容も含めて受信通知が届くため、見逃しを防ぐことができます。

「自動メール返信」の画面から、フォーム送信者に自動で送られるメールが設定できます。

お礼の文章とともに、問い合わせ内容の確認のため必要な項目を設定してメールに入れることができます。

Googleアナリティクスの「目標」設定

CREAMのHTMLページ作成を使って、埋め込み型でWebフォームを設置したため、ページ遷移がCREAM導入ドメインのまま継続していることにお気づきでしょうか。

外部のフォームサービスを利用する際、ボタンでフォームに誘導すると
 CREAM導入ドメイン
 ↓
 お問い合わせフォーム(フォームサービスのドメイン)
 ↓
 サンクスページ(フォームサービスのドメイン)

となります。

埋め込み型にすることで、
 CREAM導入ドメイン
 ↓
 お問い合わせフォーム(CREAM導入ドメイン)
 ↓
 サンクスページ(CREAM導入ドメイン)

となり、ヘッダー/フッターがCREAMサイトのままなので送信者に遷移上の違和感を与えないだけでなく、ドメインから離れないためセッション維持したままアクセス計測ができます。

Googleアナリティクスの「目標」を設定します。

ドメイン内のページ遷移のため、URLを指定するだけの「コンバージョントラッキング」ができます。

結果、どの記事を見てコンバージョンしたか、どこのチャネルから流入したコンバージョンか、といった情報が取得できます。(取得できない場合もあります)

Googleアナリティクスの目標にある参照元/メディアが「form.run」になる場合もあります。そのときは「参照元除外リスト」を設定しましょう。

Googleアナリティクスの設定内容については、あまりに奥が深いので割愛します。

以下の記事が参考になると思います。

目標を作成、編集、共有する - アナリティクス ヘルプ

https://support.google.com/analytics/answer/1032415?hl=ja

ここで説明するタスクを行ったり、機能を使用したりするには、ビュー単位の

コンバージョンを正しく計測するためのGoogleアナリティクス「目標」設定

https://ferret-plus.com/curriculums/10547

今回はGoogle アナリティクスで設定しておくべき「目標」について解説します。 目標が正しく設定されていないと、ホームページ上で一番重要なコンバージョンが正しく計測されず、データをどれだけ見ても意味がなくなってしまいます。正しく理解し、設定しておきましょう。

ほかの外部サービスも取り上げます

フォームサービスの他にも、CREAMと組み合わせて使っていただきたい外部サービスを今後も取り上げて、使い方紹介をしていきたいと思います。

できるだけ、CREAMならではの設定のコツも合わせて解説していくようにします。

CREAMへのお問い合わせ

 

 

 

この記事のライター

関連する投稿


RSSを活用しよう!リーダーで情報収集も、記事の外部サイト表示もできます

RSSを活用しよう!リーダーで情報収集も、記事の外部サイト表示もできます

RSSは登録したWebサイトの新規記事や更新情報などを配信する仕組みです。メディア構築CMSのCREAMには標準で用意されています。情報収集にも、記事の外部サイト表示もできる活用方法を案内します。


Webメディアの回遊アップに効果あり!サイト内検索&レコメンド広告のツールを導入(ISE編)

Webメディアの回遊アップに効果あり!サイト内検索&レコメンド広告のツールを導入(ISE編)

アクセスユーザーの回遊率や滞在時間を上げるには、より多く読まれるようコンテンツの質を高める必要があります。なかなか難しいことですが、実はもっと簡単にCMSに設置するだけで効果が見込めるツールがあります。広告収益の提供もあります。そんなツールの紹介とCREAMへの導入方法を解説します。


オウンドメディアに手軽なコメント機能を導入(AIコメントシステム編)

オウンドメディアに手軽なコメント機能を導入(AIコメントシステム編)

オウンドメディアやWebメディアサイトに特化したCMS「CREAM」に、よくいただくご要望のひとつにコメント・口コミの機能があります。後付けのコメント機能のサービスとしてAIに強い会社のものを使うことで、手軽にかつ運用負担も少ないコメント欄を実現できます。


ページ作成機能の説明と活用方法(お知らせやLPにも使えます)

ページ作成機能の説明と活用方法(お知らせやLPにも使えます)

メディア構築CMSのCREAMには「ページ作成」の機能があります。記事ページではないページを作成する機能です。どう使うのか質問を受けることがありますので、活用方法を解説します。


企業ブログのCVアップにMAツール活用を(SATORI編)

企業ブログのCVアップにMAツール活用を(SATORI編)

企業のオウンドメディアやブログへの導入が進むメディア構築CMS「CREAM」を使う際に、効果が高まる外部サービスとの組み合わせ活用の紹介です。今回はCVアップにMAツール「SATORI」のポップアップフォームを導入します。


最新の投稿


2021年 ゴールデンウィーク休業のお知らせ

2021年 ゴールデンウィーク休業のお知らせ

2021年のゴールデンウィークの弊社休業期間をお知らせします。


企業ブログの成功ポイントと事例

企業ブログの成功ポイントと事例

企業ブログは、オウンドメディアやメールマガジンなど様々なコンテンツマーケティング手法のひとつです。企業ブログの成功のポイントや事例、CMS活用についてまとめました。


CREAMサイトにおけるサブドメインとサブディレクトリの扱い

CREAMサイトにおけるサブドメインとサブディレクトリの扱い

オウンドメディアやWebメディアサイトに特化したCMS「CREAM」の導入時に、サブドメインやサブディレクトリを設定できるのか、といった質問をよく受けるため説明します。


2020〜2021年の年末年始休業のお知らせ

2020〜2021年の年末年始休業のお知らせ

2020〜2021年の年末年始の弊社休業期間をお知らせします。


RSSを活用しよう!リーダーで情報収集も、記事の外部サイト表示もできます

RSSを活用しよう!リーダーで情報収集も、記事の外部サイト表示もできます

RSSは登録したWebサイトの新規記事や更新情報などを配信する仕組みです。メディア構築CMSのCREAMには標準で用意されています。情報収集にも、記事の外部サイト表示もできる活用方法を案内します。


 

ページTOPへ