Looking for a way to add web push notifications to your website?
Push notifications can help you generate a lot of traffic, engagement, and sales on autopilot and with very little effort. But a major question is how do you even do it?
In this article, we’ll show you how to add push notifications to your website even if you’ve never done it before.
この記事では、PushEngageを使用してウェブサイトにプッシュ通知を設定します。PushEngageは世界No.1のプッシュ通知ソフトウェアです。そのため、キャンペーンは安全に管理されます。
さあ、始めましょう。
サイトにプッシュ通知をインストールする方法
Let’s start with a preview of what you can expect as a result of this article. If you follow these steps, by the end of this article, you should be able to send push notifications from your site like this one:
It doesn’t matter what your website was built with. No matter what tech stack you used to develop your site, you can always install push notifications on your site. We’ll cover all of that in the next few segments.
さあ、始めましょう。
ステップ1：PushEngageアカウントの設定
PushEngage のホームページにアクセスし、開始ボタンをクリックします。
PushEngageを試すために無料プランを選択するか、ビジネスの成長に真剣に取り組んでいる場合は有料プランを選択できます。有料プランには、より多くのキャンペーンオプションと、さらに大きな購読者リストを構築する機能が付属しています。
アカウントにサインアップしたら、PushEngageダッシュボードにアクセスし、設定 » サイト設定 » インストール設定に移動します。
ここでサイトの詳細とブランディングを設定します。プッシュ通知用のロゴとサイトURLを設定してください。プッシュ通知を適切にテストできるように、今すぐこれを行う必要があります。
ステップ2：PushEngageからインストールコードを取得する
次に、PushEngageダッシュボードにアクセスしてインストールコードを取得する必要があります。設定 » サイト設定 » インストール設定に移動します。
This is where things start to get a little bit technical.
Inside this tab, you’ll see that you can get a different code for different types of websites.
Find the right one for your site and copy it.
タブに記載されていないCMSでサイトを実行している場合は、サイトにSSL証明書がインストールされているかどうかに基づいて、HTTPまたはHTTPSタブのいずれかに移動できます。
HTTPSサイトを使用している場合、このステップの非常に重要な部分は、サーバーのルートフォルダにアクセスできることです。HTTPSサイトでプッシュ通知を機能させるには、同じタブからservice-wroker.jsファイルをダウンロードする必要があります。そして、それをルートフォルダにアップロードしてください。
NOTE: If you can’t upload the service-worker file to the root folder, you have the option to upload the file to another folder. Go to PushEngage Dashboard » Settings » Site Settings » Advanced Settings.
Just follow the instruction in the Service Worker Settings and you’re golden:
これで完了です！
プラグインを使用せずに、WordPressにWebプッシュ通知を正常にインストールしました。
Step #3: Placing the Installation Code In Your Site’s HTML
Essentially, no matter what type of website you have, you’ll want to place this installation code in the HTML <head> of your website. And the process to do this is different for different platforms. If you’d like to get a platform-specific guide on how to install web push notifications to your website, check out these resources:
- WordPressにプッシュ通知をインストールする
- WooCommerceにプッシュ通知をインストールする
- Wixにプッシュ通知をインストールする
- Zohoにプッシュ通知をインストールする
- Volusionにプッシュ通知をインストールする
- Weeblyにプッシュ通知をインストールする
- ClickFunnelsにプッシュ通知をインストールする
- PrestaShopにプッシュ通知をインストールする
- OpenCartにプッシュ通知をインストールする
- CS-Cartにプッシュ通知をインストールする
- Squarespaceにプッシュ通知をインストールする
If you’re running a custom site built on HTML, you’ll know exactly where to place the code. But The process of placing the installation code in the head of your site will change based on your CMS or website builder.
For certain CMSs, you can insert your installation code directly from your dashboard. In other instances as with PrestaShop, you’ll need to use the PushEngage API Key instead. So, we recommend following these platform-specific tutorials for any other site.
ステップ4：PushEngageオプトインの設定
最後に、PushEngageダッシュボードで、設定 » サブスクリプション設定 » サブスクリプションダイアログボックス » 編集に移動します。
ここからプッシュ通知のオプトインをカスタマイズできます。ヘルプが必要な場合は、カスタムプッシュ通知オプトインの作成方法に関するこの記事を確認してください。
インスピレーションが必要な場合は、コンバージョン率の高いプッシュ通知オプトインに関するこの記事を確認できます。
ステップ5：ウェルカム通知の作成
オプトインの設定が完了すると、サイトは購読者を取得できるようになります。
しかし、プッシュ通知が正しく機能していることをどのように確認できますか？
設定がスムーズに進んだかどうかを確認するために、ウェルカムプッシュ通知を作成することをお勧めします。ウェルカム通知とは、新しい購読者に送信して、購読を確認し、歓迎するためのプッシュ通知です。
設定 » サイト設定 » インストール設定に移動し、ウェルカムメッセージを設定します。
最後に、サイトに戻り、すべてがスムーズに機能しているかどうかを確認するために、独自のプッシュ通知を選択してください。
これで完了です！
ウェブサイトにウェブプッシュ通知を正常に設定しました。PushEngageダッシュボードに戻り、プッシュ通知キャンペーンの作成を開始する時間です。
まとめ
今回は以上です、皆さん！
プッシュ通知が初めての場合は、公開する前にプッシュ通知テストの本格的なプロセスに従う必要があります。これにより、訪問者が見て問題が発生する前に一般的な問題をトラブルシューティングできます。
このいずれかで困った場合は、カスタマーサクセスマネージャーにご連絡いただくことをお勧めします。どのような問題でも喜んでお手伝いさせていただきます。
まだの方は、ぜひPushEngageをお試しください。PushEngageは世界No.1のプッシュ通知サービスです。ビジネスの成長に真剣に取り組んでいるなら、PushEngageに投資すべきです。
