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

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

はじめに

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

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

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

離脱防止ポップアップバナー挿入アプリ|リテリア Popup

「離脱防止ポップアップバナー挿入アプリ|リテリア 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の解説を行いました。

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

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

離脱防止ポップアップバナー挿入アプリ|リテリア Popup

recommendおすすめ記事

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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