eCommerce Tips

Shopifyポップアップ:Shopifyストアにポップアップを追加するには?

add popups to shopify store
Promotion Image

ECストアにトラフィックを呼び込むことは、主要な目標の一つです。しかし、訪問者をサイトにとどめ、適切なタイミングでその注意を引きつけられるかどうかが、大きな違いを生みます。 多くのShopifyマーチャントはこのことに気づいており、今、Shopifyストアへのポップアップの追加方法についての情報を探しています。ポップアップは、Shopifyストアオーナーにとって便利なツールとして役立ちます。リードの収集、プロモーションの提供、情報やお知らせの発信、エンゲージメントの向上、そして訪問者を顧客へと変えることに役立ちます。

この記事では、Shopifyポップアップについて知っておくべき知識、そしてその作成方法と最適化の方法をご案内します。さあ、じっくり掘り下げて、ストアのユーザー体験を高め、より多く売れるようにしていきましょう。

Shopifyポップアップとは何か、どのように機能するのか?

この記事にたどり着いたということは、Shopifyポップアップについての情報を探していたのでしょうから、すでにある程度はご存じかもしれません。とはいえ、最も基本的な理解をまとめるために、ポップアップとは一般的に何なのか、そしてそれがどのように機能するのか、そのしくみをさっと確認しておきましょう。

Shopifyのポップアップは通常、グラフィカルユーザーインターフェースの表示領域を成す、小さなウィンドウとして現れます。その機能は、伝える具体的なメッセージや内容によって決まります。ストアの重要な情報の提供、魅力的な割引オファーの提示、サブスクリプションの機会の提示から、手軽なアンケートの実施まで、その内容はさまざまです。ポップアップの表示は、それぞれ異なるトリガー設定によって制御され、一般的には次のようなものがあります。

  • 時間ベースのトリガー。一定の読み込み時間の経過後に表示されます
  • スクロールベースのトリガー。指定した割合までスクロールすると作動します
  • 離脱意図トリガー。訪問者がウェブサイトを離れようとするときのカーソルの動きをもとに、戦略的に表示されます
  • クリックで開くトリガー。ユーザーの操作に応じて働きかけます
Shopify Popup Example

Shopifyのポップアップは通常、小さなウィンドウとして現れます

ECの世界では、Shopifyポップアップは強力なツールとして役立ち、Shopifyマーチャントが的を絞ったメッセージを届け、貴重なリードを集め、革新的な方法で行動を後押しすることを可能にします。よく練られたShopifyポップアップは、ストアのコンバージョン率を大きく押し上げ、最終的に売上を新たな高みへと導く可能性を秘めています。

Shopifyポップアップの種類

Shopifyストアで利用するために設計されたポップアップには、さまざまな種類があります。ストアオーナーが自社のビジネスに最も効果的なものを選べるよう、ここでは大きく2つのグループに分類します。

1. 目標と機能による分類

1.1 リードや情報の収集

このタイプのShopifyポップアップでは、ストアオーナーはメールや電話の連絡先を通じてリードを集めることを選べます。顧客アンケートにポップアップを活用する人もいます。

Shopify newsletter popup example

貴重なリードとしてメールを集めるためのポップアップ

1.2 売上を伸ばす

これは、コンバージョン率を高めたり、商品のアップセルやクロスセルを促したりするために、特別なプロモーションや割引コードを提供するものです。ストアオーナーは、販売数を表示して緊急感やFOMOを生み出し、訪問者が早めに購入を完了するよう促すためにも、ポップアップを使えます。

Discount popups with time countdown

カウントダウン付きの割引コードを訪問者に提示して、より多くのコンバージョンにつなげる

1.3 かご落ちを減らす

ここでは、ポップアップは、購入を完了しないままカートに残された商品について訪問者に思い出させる役割を果たします。ストアオーナーは、緊急感を生み出すために、ポップアップをカートのカウントダウンとして設定することもできます。

1.4 お知らせをする

ポップアップは、ストアからの重要な情報を伝える手段として機能します。これには、今後のプロモーションキャンペーンや新商品の発売に関する詳細などが含まれます。

BFCM popup with time countdown

ブラックフライデーのプロモーション情報を表示するポップアップ

1.5 ゲーミフィケーション

この戦略は、ECでますます一般的になりつつあります。ストアオーナーは、ラッキーホイールのような小さなゲームをポップアップに組み込み、ちょっとした賞品を提供することで、訪問者をより引きつけ、ショッピング体験の中で興味を再びかき立てられます。

Luckly wheel popup on Shopify

訪問者が遊んで無料ギフトを獲得できる、ラッキーホイールのポップアップ

1.6 ソーシャルプルーフ

ポップアップは、最近の購入通知や訪問者数を表示することでウェブサイトの信頼性を高め、最終的に信頼を築けます。

Discount popups with time countdown

閲覧中に表示される最近の購入通知

2. トリガー設定による分類

2.1 離脱意図

Shopifyの離脱意図ポップアップは、カーソルの動きの追跡に基づいて作動し、訪問者が「exit(離脱)」または戻るボタンに近づいたときに表示されます。

作り方について詳しくは、Shopifyの離脱意図ポップアップをご覧ください!

2.2 時間ベースのポップアップ

このタイプのポップアップは、特定の読み込み時間の経過後に表示されます。購入を完了するのにもう少し時間が必要な、決めかねている顧客に向けて、このポップアップを使うとよいでしょう。

2.3 スクロールポップアップ

訪問者のスクロール動作に応じて、ポップアップが表示されます。例えば、訪問者がウェブサイトの末尾まで、あるいはページの4分の3までスクロールしたときに、ポップアップが作動します。

2.4 アクショントリガー

ポップアップは、サイト上の特定の場所やボタンをクリックするなど、訪問者の行動によって表示させることもできます。このタイプのポップアップは、自分のクリック操作によってポップアップが現れるかもしれないと訪問者がより意識しているため、エンゲージメント率が高くなる傾向があります。

Shopifyにポップアップを追加するには?

確かに、ポップアップはコードだけで一から作ることもできます。ただし、コーディングの具体的な手順は、コーダー一人ひとりのやり方によって異なります。この方法を検討する価値があるのは、豊富なコーディングの経験とスキルをお持ちの場合だけです。 そうでなければ、ストアのコードベースに思わぬ不具合が生じるのを避けるために、Shopifyテーマやアプリで利用できる機能を活用することを強くおすすめします。

それでは、Shopifyにポップアップを追加する方法を見ていきましょう!

Shopifyテーマを使ってポップアップを作成する

一部の有料Shopifyテーマには、ポップアップを作成・カスタマイズするための機能があらかじめ備わっています。お使いのテーマがポップアップに対応している場合、Shopify Editorでの手順はシンプルです。

  1. Online Store(Sales channelsのセクション内)> Themes > Customize に移動します。
  2. エディターで、Popupsのセクションを見つけます。ここで、ページの他のセクションを編集するのと同じように、内容やスタイルを含めポップアップのあらゆる要素を調整できます。
Shopify Editor

Shopify Editorにアクセスして、ポップアップを作成・カスタマイズする

現在お使いのテーマにポップアップ機能がない場合は、Shopify Theme Store.

プロのヒント

ストアにポップアップを追加したいだけで、ストアテーマを変更する必要がない場合は、ポップアップの作成にShopifyテーマを使うことはおすすめできない、という点を覚えておいてください。さらに、Shopifyテーマは$150〜$390という価格帯で、決して安くはありません。

Shopifyパートナーのアプリを使ってポップアップを作成する

ポップアップで特定の目標を達成しようと本気で取り組むなら、Shopifyパートナーによる専門的なポップアップアプリの活用を強くおすすめします。これらのアプリは、あらかじめ用意された幅広い種類のポップアップに加え、パフォーマンスの追跡と成果の最適化のための専用の分析セクションを提供します。Shopifyテーマでは、よく使われるポップアップを限られた範囲で作成できますが、データをレポートするための組み込みセクションはありません。

さらに、Shopifyポップアップアプリの費用はさまざまで、無料のものから、有料プランで$4からのものまで選択肢があります。

Shopifyアプリでポップアップを作成するプロセスは、アプリが違ってもおおむね共通で、分かりやすいものです。ここでは、qikify Sales Pop Up & Proofのインターフェースを使って説明します。手順は他のアプリでもおおむね同じです。

ステップ1:Shopify App Storeで適切なアプリを選ぶ

Shopify App Storeで「popup」と検索すると、最大558個ものアプリの中から選べます。1〜2種類のポップアップしか提供しないアプリもあれば、A/Bテストやレポートといった便利な追加機能とともに、多彩な選択肢を提供するアプリもあります。

Shopify Popup App On App Store

Shopify App Storeでの検索語「popup」の検索結果

ステップ2:ポップアップの目的を定める

自社の具体的なキャンペーンやビジネス戦略に応じて、ポップアップをさまざまな目的に合わせてカスタマイズできます。魅力的な割引の提供、価値あるリードの収集、メーリングリストの拡大、今後のキャンペーン情報の共有などが考えられます。

Types of Shopify popup

最終的な目標に応じてポップアップの種類を選ぶ

ステップ3:コンテンツを追加し、デザインをパーソナライズする

他のタイプのポップアップを作るのと同じように、このステップでは、コンテンツを入力し、ブランドのスタイルに合わせてデザインを整えます。ポップアップの効果は、訪問者の注意を引けるかどうかにかかっており、それは説得力ある見出しと目を引くデザインによって実現される、ということを忘れないでください。

Settings for the Shopify popup

Shopifyポップアップのスタイルとコンテンツを作成する

ステップ4:トリガー設定を行う

このステップでは、ポップアップのトリガー設定を選びます。

Trigger settings for Shopify popup

Shopifyポップアップのトリガー設定を選ぶ

Shopifyポップアップを最適化するには?

1. A/Bテストと分析でポップアップを最適化する

最初のポップアップのバージョンは、すぐに最良の結果を生むとは限りません。エンゲージメント率やコンバージョン率といった重要なデータを活用して、少しずつ改善を重ねましょう。

例えば、最初のコンテンツとデザインのセットを1週間実施し、翌週には少し異なるデザインを試します。さらに1週間後に結果を評価し、新しいデザインのほうが訪問者の注意をより効果的に引きつけているかを確認します。

プロのヒント

テストを行う際は、一度に変更する要素を1つだけにするようにしてください。そうしないと、どの変更が影響を与えたのかを特定するのが難しくなります。この原則は、ポップアップに限らず、あらゆる場面でのテストに当てはまります。

少しずつ最適化していくプロセスには時間がかかることもありますが、それによってパフォーマンスの向上が確実になります。ほとんどのShopifyアプリは、プラットフォーム内にテストと分析の機能を備えており、プロセスをよりスムーズにします。一方で、コーディングやShopifyテーマを使って手作業でポップアップを作成するのは、より込み入ったものになりがちです。だからこそ、私たちはShopifyアプリの活用を強くおすすめしています。

2. ポップアップをいつ・どこで・誰に表示するかを決める際の注意点

  • ポップアップを表示するタイミング:最初にアクセスしたとき、離脱意図のとき、またはサイトに一定時間滞在した後。
  • どこで:すべてのページ、または特定のページ。
  • 誰に:全員、新規訪問者のみ、またはリピーターに表示。

よく練られた詳細な計画は、すべての訪問者に向けてストア全体にポップアップを無作為に表示するよりも、良い結果を生む可能性が高くなります。ポップアップをさまざまなトラフィックのセグメントに合わせて調整し、その配置を検討し、表示のタイミングにも気を配りましょう。場面ごとに異なるポップアップを作るには、より多くの時間と手間がかかりますが、その分、より良い成果につながるはずです。

例えば、初めての訪問者に最新の商品を紹介するために、ウェルカムポップアップを使うことが考えられます。注文を完了していない訪問者には、離脱意図ポップアップを通じて割引コードを提示したり、カート内の商品について思い出させたりします。さらに、サイト上で操作が止まっている訪問者を引きつけるためにラッキーホイールを作るのも、ショッピング体験を高める良いアイデアです。

3. ポップアップの表示頻度を考える

ポップアップは、あまりに頻繁に、そして予期せず現れると、すぐに煩わしく感じられてしまいます。ポップアップがどのくらいの頻度で表示されるかに気を配りましょう。通常、この設定は、お使いのアプリに応じて「Repeat」や「Frequency」といったオプションで調整できます。

詳しくは、Shopifyの割引ポップアップをこちらでご覧ください。

まとめ

この記事では、Shopifyストアへのポップアップの追加方法をはじめ、ポップアップを使う際の基礎知識やヒントをご紹介してきました。ポップアップはちょっとした追加要素に見えるかもしれませんが、詳細な計画と少しずつの最適化のもとで思慮深く使えば、ストアに大きなメリットをもたらせます。顧客エンゲージメントを高め、より自然な形で宣伝し、訪問者から顧客へのコンバージョンを増やし、メーリングリストの構築にも役立ちます。ポップアップとは何か、どのように機能し、どのような可能性を秘めているのかをしっかり理解しておくことが極めて重要です。

最適化には忍耐が肝心である、ということを忘れないでください。それは、あなたのECの歩みとよく似ています。成功には、努力と献身が必要です。私たちのヒントに従って、より確かな成功への道を歩んでいきましょう。

私たちのアプリ、qikify Sales Pop Up & Proofを試して、あなた自身のShopifyポップアップを無料で作成してみましょう。すべての機能を無料プランで利用できます。今すぐ試してみて、望んだ成果が見えたら、スケールアップを検討してください。