はじめてのWordPress入門講座【基礎知識・基本的な使い方・トラブル対応】

WEBサイトの上部にアクションを促す帯を簡単に表示できるWEBサービス「Hello Bar」

WEBサイトに訪問した人へ「Facebookページへのいいね」「メールマガジンの購読」「問い合わせ」など、もっとCall to Actionをアピールしたい!WEBサイトの上とか下とかに帯(ツールバー)を表示させたりしたい!

そんな、あなたには「Hello Bar」が良いかもしれません。

WEBサイトにツールバーを表示できる「Hello Bar」

WEBサイトにツールバーを表示できる「Hello Bar」

「Hello Bar」を使うと、自力でJavaScriptなどを実装するよりも簡単に「ツールバー」や日本では敬遠されがちの「ポップアップ表示」などを導入することが出来ます。

Hello Barでツールバーを表示

A/Bテストも出来る

Hello BarでA/Bテスト
Hello BarではA/Bテストが可能です。帯の色やボタンの色、文言の違いなどで、よりWEBサイトの訪問者に最適化していくことが出来ます。

Hello Bar
A/Bテストを設定しなくても、ビュー数やクリック数などのパフォーマンスは確認できます。

Hello Barで実装できるCall to Action

Hello Barでは4つの「表示」を選択できます。

WEBサイトの上部または下部に帯を表示させる「Bar」
↑WEBサイトの上部または下部に帯を表示させる「Bar」

ポップアップ表示
↑WEBサイト(WEBページ)に訪問したら、ページの上にポップアップ表示される「Modal」

右下に表示
↑WEBサイトのサイドに表示される「Slider」

WEBサイトの表示前にCall to Actionを表示
↑WEBサイトの表示前にCall to Actionページを表示させる「Page Takeover」

最後のWEBサイトの表示前にCall to Actionを表示するタイプは、ユーザーからするとイラっとする可能性が大ですね。ポップアップ表示も、かなり厳しいかもしれません。

誘導先は3つ

Hello Barの誘導先
誘導先として設定できるのは3つです。ソーシャルアカウント、問い合わせ(メール送信)、任意のページへのリンクの3つです。

Hello Barでのツールバーの作り方

簡単に「Hello Bar」の使い方をご紹介しておきます。

Hello Barの誘導先の選択
↑まず誘導先を選択します。

Hello Barを使ってソーシャルアカウントへ誘導する
↑今回は「ソーシャル」を選択してみました。Twitterでのツィートやフォロー、Facebookページのいいね、LinkedInでのシェア、Google+の+1などソーシャルメディアでのアクションが並んでいますので、1つ選びましょう。

Hello Barの表示スタイルを選ぶ
↑続いて「表示スタイル」を選びます。ページ上部に表示する「Bar」、ポップアップ、スライダー(右下の表示ボックス)、ページの差し込みなど1つ選びましょう。

Hello Barの色を設定する
↑帯の色を設定します。メール送信や任意ページへのリンクを選択した場合は「ボタン」の色もここで変更できます。

Hello Barの文言を設定する
↑表示するテキスト(文言)を設定します。

誰に表示するかの設定
↑最後に「誰に表示するのか」の設定です。ここを変更するには「Pro版」へアップグレードする必要があります。

WEBサイトへの実装

Hello BarをWEBサイトへ導入する
↑ツールバーを作ってもWEBサイトへは表示されません。WEBサイトへ実装するにはソースコードを貼り付けるか,WordPressであればプラグインをインストールすることで実装できます。

一度、WEBサイトと同期させてしまえば、その後にツールバーを編集しても保存するだけでWEBサイト側にも反映されます。

Pro版でも月に12ドル

Hello BarのPro版

本格的にHello Barを使いたいという方は、ツールバーを作成する際に設定できる項目も増えますのでPro版にアップグレードしてもいいかもしれません。

日本語対応はしていないので、英語ができないと難しいと思われるかもしれませんが、かなりユーザービリティが高く、感覚的に操作できるので、一度試してみてください。
Hello Bar