Are you just getting started with optimizing your push notification campaigns? The first place to start is your push notification popup.
A push notification popup is a simple popup that encourages your website visitors to opt for your push notifications. But not all popups are the same. In fact, you can get a lot of extra signups just based on the type of popup you choose along with some basic design optimizations.
We’ve spent a lot of time analyzing best practices for push notifications. So, in this article, we’ll show you how you can style your push notification popups for both mobile and desktop.
And the best part? Your popups are going to be conversion optimized from day one!
听起来不错？让我们开始吧。
What is a Push Notification Popup Modal?
推送通知弹出窗口是一个出现在网站或移动应用程序界面之上的小型窗口，用于向网站访问者显示消息或通知。
The popup modal can be triggered by various events. You can set up popups to get triggered on page visit, on scroll depth, and even on custom actions such as button click. Usually, you’ll see a call to action on the popup modal such as “Subscribe” or “Allow” to get consent from visitors to send them push notifications.
您可以创建可以直接细分订阅者的弹出窗口，或者创建仅收集具有地理位置和浏览器等默认属性的订阅者的常规弹出窗口。
Push notification popup modals are used to engage with website visitors. But you need to make them as non-intrusive as possible so that you don’t annoy your visitors.
推送通知选择加入的类型
推送通知选择加入主要有两种类型：
- 单步选择加入：用户只需单击一次即可订阅推送通知。它不允许任何自定义，并且仅使用系统默认样式。
- 两步选择加入：对于两步选择加入，用户需要单击两次才能订阅。但好处是您可以自定义从设计到文案的所有内容。
但您应该知道，有许多不同的选择加入子类别。
主要是，我们会看到两步选择加入的许多变体，因为单步选择加入实际上是不可自定义的。
您可以选择使用 Safari 风格的选择加入：
大型 Safari 风格框选择加入：
带铃铛的条形框选择加入：
带分段的大型 Safari 框：
浮动条选择加入：
或简单的单步选择加入：
如果您不确定应该选择哪种，请继续阅读。我们将在本文后面讨论每种选择加入类型的可自定义功能。
最酷的部分是……
您可以直接从您的 PushEngage 仪表板自定义您为网站选择的任何推送通知选择加入。
如果您想玩得花哨点，甚至可以更改选择加入弹出窗口的位置。选择加入的所有内容都是完全可自定义的，包括桌面和移动设备的文本或背景颜色。
订阅选择加入中的另一个重要元素是通知叠加层。
叠加层为您提供了额外的空间来解释订阅推送通知的好处。对于单步选择加入，您的通知叠加层变得非常重要，因为您无法编辑选择加入的文案。
How to Optimize Your Push Notification Optin
在您的 PushEngage 仪表板中，转到设计 » 弹出窗口并选择一种订阅选择加入类型进行自定义：
最酷的部分是您可以同时使用多个推送通知弹出窗口。
现在，您可以运行多个选择加入并测试哪一个最适合您的网站，而无需在它们之间切换。
当我们为每种推送通知选择加入设置样式时，我们将讨论每种选择加入的不同之处。如果您是推送通知选择加入的新手，我们建议您阅读整篇文章，并决定哪种选择加入类型适合您的网站。
但是，如果您已经熟悉了不同类型的推送通知选择加入，您应该跳转到您想要设置样式的选择加入类型：
- 如何自定义 Safari 风格的推送通知选择加入
- 如何自定义大型 Safari 风格的订阅框
- 如何自定义放置在顶部的横幅
- 如何自定义带分段的大型 Safari 风格
- 如何自定义浮动横幅推送通知订阅
- 如何自定义单步推送通知订阅
让我们看看每种订阅类型以及如何自定义它们。
如何自定义 Safari 风格的推送通知订阅
让我们开始自定义桌面版的 Safari 风格推送通知订阅。Safari 风格订阅是一种看起来像标准 Safari 弹窗的弹窗。但是，如果您创建的是 Safari 风格的推送通知订阅，那么无论访问者使用什么浏览器，他们都会看到 Safari 风格的样式。这与他们设备运行的操作系统无关。
所以，您并不局限于仅使用 Apple 生态系统。无论订阅者使用什么浏览器或操作系统，这些样式都会被保留。
您应该了解的第一个功能是订阅框在屏幕上的显示位置。您可以决定要在网站上何处显示订阅框，或者从下拉菜单中选择订阅框的位置。
自定义样式
点击“编辑弹窗”，然后在“弹窗设计”选项卡下设计您的订阅框：
在这里，您可以自定义弹窗模态框的所有内容。编写您自己的弹窗消息并自定义按钮标签。然后，使用您的品牌颜色作为“背景颜色”和按钮颜色。
您甚至可以查看预览，看看弹窗在不同位置的外观。您有三个位置可供选择：
- 左上角
- 右上角
- 顶部居中
查看实时网站，看看哪种效果最好，然后选择您的显示位置。
向下滚动到“启用订阅规则”，您可以配置何时显示推送通知订阅。
您还可以创建一个带有“法律同意通知”的“订阅叠加层”：
完成后，点击“保存并选择显示选项”按钮。在那里，您可以设置订阅框的显示时间，方法是设置访问者在访问目标页面后延迟显示。
完成后，只需点击“保存并启用弹窗”。完成后的效果应如下所示：
如何自定义大型 Safari 风格的订阅框
一个大型 Safari 风格的框出现在页面中央，适用于移动设备和桌面设备。这是一个两步订阅过程，因此您也可以自定义此类订阅的许多内容。
自定义样式
在深入了解大型 Safari 风格订阅的可自定义内容之前，让我们先看看不可自定义的内容。由于其尺寸，此类订阅只有一个显示位置选项。
但是，与常规的 Safari 风格订阅一样，您可以自定义：
- 背景颜色
- 允许按钮颜色
- 阻止按钮颜色
您还可以使用实时编辑器自定义文本和字体选项。其余的自定义选项与常规 Safari 订阅完全相同，包括订阅显示设置和中间页面。
如何自定义放置在顶部的横幅
一个铃铛放置栏会出现在页面右下角或左下角，适用于手机和桌面。它是一个可定制的、两步选择的选项，具有与大型 Safari 风格选择框相同的定制选项。它正如其名。它是一个带有通知铃铛的栏，您的网站访问者需要点击它来订阅。
定制铃铛放置栏选择项
正如我们所说，您只能将此选择项放置在右下角：
或页面左下角，适用于手机和桌面。
从这个意义上说，它与大型 Safari 风格框只有很小的区别。在样式方面，您可以更改铃铛的颜色和铃铛放置栏的背景：
其余设置与 Safari 风格选项完全相同。
如何自定义带分段的大型 Safari 风格
带分段的大型 Safari 风格框正如其名。它是一个大型 Safari 选择项，可以选择自动分段您的订阅者。
为您的推送通知订阅者创建分段可以极大地帮助您个性化您的广告系列。如果您有一个拥有多样化内容的网站或博客，并且已经知道您的最高流量来源，那么您应该尝试使用带分段的大型 Safari 风格框。
这种类型的选择项是用户驱动的，因为用户决定他们想接收哪种通知。
创建分段后，请转到 设计 » 弹出窗口 并创建一个新的 带分段的大型 Safari 风格 选择项：
点击“编辑弹窗”，然后在“弹窗设计”选项卡下设计您的订阅框：
您可以在这里定制选择项的几乎所有内容，从文案到在选择项上使用您的品牌颜色。在 桌面分段选项 字段中，您可以选择您希望访问者订阅的分段。
此选择加入的优点在于，同一位订阅者可以直接从弹出窗口中选择订阅多个细分受众群。
向下滚动到“启用订阅规则”，您可以配置何时显示推送通知订阅。
您还可以创建一个带有“法律同意通知”的“订阅叠加层”：
完成后，点击“保存并选择显示选项”按钮。在那里，您可以设置订阅框的显示时间，方法是设置访问者在访问目标页面后延迟显示。
完成后，只需点击 保存并启用弹出窗口 ：
如何自定义浮动横幅推送通知订阅
一个浮动栏选择项会出现在页面底部或顶部，适用于手机和桌面。同样，这是一个两步选择的选项，带有一个中间页面。因此，您可以定制它的很多内容。
如何样式化浮动栏
浮动栏选择项与铃铛放置栏选择项非常相似。因此，样式选项也相当相似。主要区别在于，您会获得像其他任何两步选择项一样的选择项文案和按钮。
您可以将它们放置在屏幕底部：
或屏幕顶部：
然后，您可以像其他任何选择项一样定制选择项的其余部分。这包括背景颜色、按钮颜色、整个选择项中的任何文本、中间页面和显示选项。
如何自定义单步推送通知订阅
简单回答：您不能。
单步推送通知选择项无法定制，因为它使用系统默认值来创建弹出窗口。您可以定制的是随您的选择项一起出现的铃铛图标。
您可以将单步通知的铃铛放置在右下角：
或左下角：
您还可以更改铃铛颜色和铃铛图标的悬停文本：
向下滚动到“启用订阅规则”，您可以配置何时显示推送通知订阅。
您还可以创建一个带有“法律同意通知”的“订阅叠加层”：
请记住，这仅适用于桌面版本。移动版本只有系统默认设置，您也无法更改其放置位置。
您的单步推送通知选项的移动版本将如下所示：
在选择加入设置方面，您可以设置选择加入的显示延迟。您还可以更改 cookie 有效期，以记住某人是否拒绝选择加入您的推送通知。
这就是单步选项的所有功能。我们建议您首先从单步选项开始，以提高您的订阅率。
如果您刚开始使用推送通知，那么建立列表将是您业务的重中之重。随着时间的推移，您可以切换到更具可定制性的两步选项。
What to do After Setting Up a Push Notification Popup Modal
Once you’re done customizing one push notification popup modal, go ahead and create more. You can create as many popup modals as you like using PushEngage. As you saw, you can customize when to show each popup modal. So, you can use multiple popups to retarget your visitors.
You can also create different popup modals for different pages. Customizing the push notification popups on your site can help you convert your traffic into push subscribers and genuine business leads on autopilot.
不信？查看这些资源：
我们建议使用 PushEngage 来创建您的推送通知广告系列。PushEngage 是全球排名第一的推送通知软件。因此，如果您还没有，请立即开始使用 PushEngage！
