Shopifyで離脱防止ポップアップを設置できる「リテリア Popup」について徹底解説

株式会社リテリアのアイコン
株式会社リテリア

はじめに

今回の記事は、Shopify アプリである「離脱防止ポップアップバナー挿入アプリ|リテリア Popup」の解説記事になります。

Shopify とは、ざっくり説明すると EC サイトを簡単に構築することができるプラットフォームであり、Shopify アプリとはそのプラットフォームの拡張機能のようなものです。WordPress の拡張機能のようなもの、と認識頂いて大丈夫です。

興味がある方は、以下の URL よりアプリのインストールを行って下さい。

https://apps.shopify.com/popup-8?locale=ja&from=zenn

「離脱防止ポップアップバナー挿入アプリ|リテリア Popup」は、Shopify ストアに離脱防止ポップアップバナーを埋め込むことができるアプリです。
アプリブロックを使用して離脱防止ポップアップバナーを埋め込むため、他のアプリと競合することはありません。

また、アプリブロックを使用して導入したアプリは、ストアに埋め込まれたコードを非常に簡単に削除することができるため、テーマを汚染する心配もありません。

こちらのアプリを使用すると、以下のような離脱防止ポップアップバナーを、簡単に作成することができます。

それでは、アプリをインストールするとできること・インストール方法・使い方の解説を行っていきます。

離脱防止ポップアップとは

まず、離脱防止ポップアップについて簡単に解説していきます。離脱防止ポップアップとは、ユーザーがページを離脱するような動作に対して強制的にポップアップを仕込むことで、可能な限りユーザーの離脱を防止する施策と考えて下さい。

例えば、パソコンのユーザーがブラウザ左上のブラウザバックをするとき、右上の ☓ ボタンを押してブラウザを閉じようとしたとき、ユーザーが上スクロールをしたとき、一定時間以上が経過したときなどが考えられます。

ユーザーのこれらの挙動に対してポップアップを仕込むことで、コンバージョン率の向上が見込めます。

その施策をノーコードで簡単に行うためのアプリが、こちらの離脱防止ポップアップバナー挿入アプリ|リテリア Popupです。

離脱防止ポップアップバナー挿入アプリ|リテリア Popupを導入して、ストアのコンバージョン率を向上させましょう。

インストールはこちらから行うことができます。

https://apps.shopify.com/popup-8?locale=ja&from=zenn

その他のポップアップアプリとの違い

離脱防止ポップアップバナー挿入アプリ|リテリア Popupは、ユーザーが離脱する挙動を行った後に任意の画像を表示させることができるアプリです。

その他のポップアップアプリのように、ポップアップのテンプレートが存在する訳ではありません。ただ、事業主様が指定した画像を表示させることができるだけです。

そして、表示させたポップアップに何かしらのリンクを設定することができます。そのため、離脱しそうなユーザーにポップアップを表示させ、特定の商品詳細ページにユーザーを飛ばす、といった使い方が可能になります。

また、ポップアップにテンプレートを使用せず、あえて画像バナーを入れて頂くことにしています。というのも、Shopify サイトにおいて最も訴求力が高いのは、画像バナーであると考えているためです。

こちらのアプリは、ポップアップが出現する条件の設定に特化しており、その出現条件に応じて訴求力の高いバナーを表示させることを目的としています。

興味のある方は、こちらよりインストールを行って下さい。

https://apps.shopify.com/popup-8?locale=ja&from=zenn

離脱防止ポップアップバナー挿入アプリ|リテリア Popup のざっくり解説

それでは、離脱防止ポップアップバナー挿入アプリ|リテリア Popupのざっくり解説を行っていきます。

こちらのアプリは、以下の特徴があります。

ノーコードで簡単に離脱防止ポップアップバナーを設定できる

離脱防止ポップアップバナー挿入アプリ|リテリア Popupは、ノーコードで簡単に離脱防止ポップアップバナーを表示させることに特化したアプリです。

ポップアップの出現条件のカスタマイズに力を入れています。

日本語対応したシンプルな管理画面

離脱防止ポップアップバナー挿入アプリ|リテリア Popupは、完全に日本語対応した日本製のアプリです。管理画面が日本語であるため、迷いなく導入することができます。

作成したバナーを設定

離脱防止ポップアップバナー挿入アプリ|リテリア Popupは、ポップアップとしてバナー画像を設定して頂く必要があります。ポップアップのテンプレートは使用しておりません。こちらに、事業主様の Shopify ストアの雰囲気に合った、訴求力の高いバナー画像を設定して頂く形になります。

バナーの出現条件を細かく設定

離脱防止ポップアップバナー挿入アプリ|リテリア Popupは、バナーの出現条件を細かく設定することができます。

上スクロールした際にバナーを出現させるといった設定や、カーソルが画面外に出た時にバナーを表示するといった設定を行うことができます。

また、再出現の可否を選択でき、再出現する際のクールタイムも設定することができます。

ここまでで、離脱防止ポップアップバナー挿入アプリ|リテリア Popupのざっくりとした説明は終了です。

それでは次に、具体的にインストール方法を見ていきましょう。

アプリのインストール

それでは、実際にアプリのインストールを行っていきましょう。

ストアの管理画面のアプリ管理から、ストアをカスタマイズに移動しましょう。

アプリの検索窓に、離脱防止ポップアップバナー挿入アプリ|リテリア Popupと入力して下さい。

広告に敗北していますが、4 番目に出てきました。

こちらをクリックして、アプリ画面に移動して下さい。

アプリを追加するをクリックして、ストアにアプリを追加しましょう。
Shopify パートナー用のアカウント(通称開発アカウント)でインストールを行うと、全ての機能を無料で利用することができます。
ちなみに、マーチャント用のアカウントだと、月額 4.90 ドルで利用できます。7 日間の無料プラン付きです。

アプリを追加するをクリックすると、以下の画面に遷移します。

右上のアプリをインストールをクリックして、アプリのインストールを行いましょう。

以下の管理画面に遷移します。ここまでで、アプリのインストールは終了です。

ポップアップバナーをテーマに導入

それでは次に、ポップアップバナーをテーマに導入しましょう。

まずは、離脱防止ポップアップバナーを有効化していきます。

アプリをインストールするテーマを選択しましょう。

インストールするテーマを選択した後は、テーマに反映有効化をクリックします。

有効化が終了すると、以下のようなポップアップが画面したから出てきます。

有効化が終了したら、次にプレビューをクリックしましょう。

テーマ設定アプリを埋め込むから、ポップアップバナーセクションが追加されているのが確認できます。

ここまでで、アプリの導入は一通り完了です。

それでは次に、細かいアプリの使い方を見てみましょう。

## ポップアップバナーを設定
先程の画像のポップアップバナーセクションをクリックすると、ポップアップバナーの細かい設定を行うことができます。

まずは、何はともあれ画像を設定しましょう。

バナー画像を設定したあとは、バナーのリンクを設定します。そうすることによって、バナーをクリックしたユーザーを、リンクで指定した場所に飛ばすことができます。

次に、バナーの幅の設定を行いましょう。

スマホ時と PC 時、それぞれについてバナーの横幅を設定することができます。

ポップアップバナーの出現条件をカスタマイズ

それでは次にバナーの出現条件をカスタマイズしましょう。

ポップアップバナー出現条件(画面外)

カーソルが画面外に出た時にバナーを出現させるかどうかをカスタマイズできます。

これにより、ブラウザバックはタブを閉じようとしたユーザーに、ポップアップバナーを見せることが可能になります。

また、再出現させるかどうかや、再出現のクールタイムも設定することができます。

ポップアップバナー出現条件(上スクロール)

ユーザーが上スクロールした際にバナーを表示させることができます。

こちらも、再出現させるかどうかや、再出現のクールタイムも設定することができます。

ポップアップバナー出現条件(一定時間経過後)

一定時間経過後にポップアップバナーを表示させます。

こちらは一度きりです。バナーが表示されるまでの時間を設定することができます。

終わりに

今回は、離脱防止ポップアップバナー挿入アプリ|リテリア Popupの解説を行いました。

少しでも興味があれば、以下のリンクよりアプリをインストール頂けるとありがたいです。

ここまでお付き合い頂き、誠にありがとうございました。

https://apps.shopify.com/popup-8?locale=ja&from=zenn

recommendおすすめ記事

らくらくお気に入りリスト | リテリア wishlistのアイコン
アプリ解説

Shopifyでお気に入り機能を実装するアプリ『リテリア wishlist』を解説

セット売り|リテリア セット販売のアイコン
アプリ解説

日本語に完全対応したセット販売アプリ「セット売り|リテリア セット販売」について徹底解説

らくらく見出し挿入アプリ|リテリア Titleのアイコン
アプリ解説

Shopifyで高スタマイズタイトルを簡単に導入できるアプリ「リテリア Title」について解説

スマホナビゲーション|リテリア Navigationのアイコン
アプリ解説

Shopify ECサイトをスマホで利用しているユーザーのためのアプリ「スマホナビゲーション|リテリア Navigation」解説

よくある質問どこでも挿入|リテリア FAQのアイコン
アプリ解説

ShopifyストアにFAQ(よくある質問)を挿入できるアプリ『リテリア FAQ』の使い方を徹底解説

どこでもYouTube動画埋め込み|リテリア Videoのアイコン
アプリ解説

ShopifyストアにYouTube動画を埋め込む方法を徹底解説!

らくらくバナー設置アプリ|リテリア Bannerのアイコン
アプリ解説

Shopifyでリンク付き画像を簡単に設置できる「リテリア Banner」に付いて解説

追従購入ボタンらくらく挿入|リテリア Buy Buttonのアイコン
アプリ解説

商品ページに追従ボタンを簡単に導入できるShopifyアプリ | リテリア Buy Button について解説

送料無料キャンペーン|リテリア 告知のアイコン
アプリ解説

【公式解説】簡単に送料無料バーを設定できる Shopify アプリ「リテリア 告知」について解説!

スライドショー挿入アプリ|リテリア スライドショーのアイコン
アプリ解説

高カスタマイズ画像スライドショーを挿入できるShopifyアプリ「リテリア スライドショー」の使い方を徹底解説

クーポンコード 1クリックでコピー|リテリア Couponのアイコン
アプリ解説

画像をクリックするだけでクーポンコードをコピーできるShopifyアプリ「リテリア Coupon」の解説

らくらく日本語フォント設定|リテリア Font Pickerのアイコン
アプリ解説

Shopifyで日本語フォントを使えるアプリ『リテリア Font Picker』について徹底解説

商品ページ発売予告アプリ|リテリア Coming Soonのアイコン
アプリ解説

Shopifyの商品詳細ページに発売予告機能を追加できるアプリ「リテリア Coming Soon」について解説

どこでもカートに追加|リテリア ぽんぽんカートのアイコン
アプリ解説

【Shopifyアプリ】トップページやコレクションページから1クリックでカートに追加出来るアプリについての解説

らくらく商品レビュー|リテリア Reviewのアイコン
アプリ解説

日本製商品レビューShopifyアプリ「リテリア Review」の使い方を徹底解説

らくらくランキング表示アプリ|リテリア Rankingのアイコン
アプリ解説

Shopifyでコレクションをランキング表示するアプリ『リテリア Ranking』を徹底解説

らくらく余白調整|リテリア Marginのアイコン
アプリ解説

簡単に余白を調整できるShopifyアプリ「リテリア Margin」を使ってストアのデザイン性を向上させよう

Aboutページらくらく作成|リテリア About Usのアイコン
アプリ解説

ShopifyストアのAboutページに表を埋め込むことができるアプリ「リテリア About Us」を解説

LINE誘導ボタンらくらく設置|リテリア LINE誘導のアイコン
アプリ解説

LINE誘導ボタンを簡単に設置できるShopifyアプリ「リテリア LINE誘導」について徹底解説