今まで、ポップアップはHubSpotのリードインを使用してきました。パソコン画面の真ん中に表示されるオプトインではなく、画面の右下に表示されるタイプで、読者の邪魔をせず、反応もまあまあ良いので使ってきたんですね。でも、最近はいろいろと状況が変わってきたので、SUMOに変更してみました。
今回お届けするノウハウはこちら
1. HubSpotとSUMOの比較
HubSpotの場合は、ボタンをクリックするとメールアドレスを登録するフォームが表示されます。
一方、SUMOの場合は、ボタンにリンクを埋め込む事ができるので、クリックするとオプトインページに飛ばす事ができます。
2. 見込み客なんて要らないって思った
これまでは、MailChimpの記事ならMailChimpのオファーを出して、その場でメールアドレスだけを記入してもらってオプトインしてもらってきました。登録がメールアドレスだけで簡単なので、いろんなお客さんがオプトインしてくれました。でも、実際には後で販売する商品に興味のないお客さんまでオプトインさせてしまっていたり、面倒な問い合わせが多くなったり、リスト全体を汚してしまう結果になりました。最近では、HubSpotブログを見てみると、リードインは使っていなく、一旦オプトインページに飛ばして、たくさんのレターを読ませて、たくさんのフォームに記入しないとオプトインできないような仕組みになっています。なので、ホットなお客さんしか集まらないようになっているわけですね。
3. 年収1000万円以下の人はもうターゲットではない
HubSpotのブログを確認してみると、上のようなポップアップが表示されていました。読者に語りかけるようなポップアップになっているので、これもオプトイン率を上げている要因の一つですね。このポップアップをクリックすると、長いしっかりとしたオプトインページに飛びました。
このオプトインページでは、上記のようなフォームが用意されていました。記入欄がたくさんあり、よっぽど彼らのオファーに興味がないとオプトインしませんよね。やっぱりお客さんの数が集まってくると、良いお客さんと悪いお客さんが入ってきます。ビジネスは気持ちよくやりたいので、できるだけ良いお客さんとだけ関わっていきたいですよね。そう思っているのであれば、このように、たくさんのフォームを用意して、ホットなお客さんだけを取り込むようにしていく方が良いです。
4. SUMOのList Builderの使い方
まずは、WordPressの法で、SUMOのプラグインを検索して、追加しておいてください。あと、公式サイトで有料会員登録($29/m)も済ませておいてください。
では、実際にSUMOを使っていきましょう。まずは、「FORMS」の中にある「List Builder」で「Create New Form」をクリックします。
すると、ポップアップのデザイン画面に遷移します。デフォルトだと、モダルといって、画面の真ん中に表示されるタイプのポップアップが選択されています。でも、今回の場合は、ボタンを設置してお客さんをオプトインページに飛ばしたいので、「Add a Call to Action」を選択します。
ポップアップは、右下に表示させたいので「Form Type」では「Scroll Box」を選択します。
5. List Builderのデザインを選ぶ
「Design」の「Template」から好きなテンプレートを選択してみてください。次にサイズですが、「Small」がちょうど良い大きさだと思います。
テンプレートの編集は、クリックして直感的に行う事ができます。写真を追加する場合は、追加したい箇所を選択して、「Design」にある「Image」をクリックします。すると、ポップアップが表示されますので、「Upload Your Media」をクリックし、写真を追加します。
6. テキストを変更する
テキストの内容を変更する場合は、テキストを選択して「Design」で編集していきます。フォントのサイズを変更したい場合は「Font」のセクションで変更する事ができます。
7. ポップアップの背景色を変更する
背景色を変更したい場合は、背景を選択した上で、「Background」で色を変更します。
ボタンのリンクは、ボタンを選択して「Click Action」で「Redirect To」の後の欄に入力します。
8. カテゴリ別にSUMOのポップアップを表示する方法
次は、「Visibility」でどのページにポップアップを表示させるのかを設定します。デフォルトだと「Smart Mode」になっています。これは、SUMO側で自動でコンバージョンが上がる時期に表示してくれます。でも、今回は、「最初の見込み客1,000人を集める方法」というオプトインページに関連する「List Marketing」のカテゴリーに表示させる設定をしていきます。なので、まずは「Manual Mode」に変更します。
次に細かい設定をしていきます。
- Show Scroll Box after user has scrolled this percent
この項目では、読者が記事をどれくらいスクロールしたらポップアップを表示するかの設定になります。
- Stick Scroll Box to this corner of screen
ここでは、画面のどの位置に表示するのかが聞かれています。
- Slide Scroll Box in from this slide
どこからポップアップが画面上に現れるか、モーションについての項目になります。
次に、いつポップアップを表示するかという設定をしていきます。この部分は、僕は1日に設定しておきました。「always」にしてしまうと、オファーを断った人に対しても、別の記事を読んだ際もまた表示されてしまうので、ユーザーエクスペリエンスが下がってしまいます。逆に1ヶ月間といった長期間表示させないのももったいないので、1日とか3日、1週間に設定しておきましょう。
「Display Rules」に関しては、「Add New Rule」をクリックして、「Show」、「URLs」、「Paths」の順に選択します。そして、「Paths」で「Beginning with」を選び、右隣の欄ではカテゴリー名を入力します。そして、最後に「Add This Condition」をクリックして完了です。そのほかには、設定するものがありませんので、右下にある「Publish」をクリックしてポップアップを公開しましょう。
9. SUMOでブログの更新通知のリストを集める
次は、ブログ更新通知のリストを集めるためのポップアップを作成していきます。「My Goal」は「Collect Emails」で「Form Type」は、「Popup」で作成していきます。デザインに関しては、ここでは省略します。
重要なのは、ポップアップの表示の部分ですね。HubSpotでは、画面から離脱する瞬間にポップアップが表示されていたので、それを真似して「Visibility」で「User Leaves」を選択し、その下の欄では左に「1」を記入、右側のドロップダウンからは「always show」を選びます。
最後に「Connect to Email Service」でEメールプロバイダー(MailChimp)とつなげていきます。クリックすると、ポップアップが表示されますので、手順に従ってSUMOとEメールプロバイダーを連携します。
連携が完了したら、「Mailing List」を選択して、「Save」して完了です。
