你有没有注意到像Facebook这样的流行网站上使用的网页推送通知? 最近我们的一位读者询问是否可以在WordPress中添加网页推送通知。 当然如此。 在本文中,我们将向您展示如何将网页推送通知添加到您的WordPress网站。
为什么要向您的WordPress网站添加Web推送通知?
网络推送通知是在用户的桌面上显示的可点击的消息。 即使用户的浏览器未打开,也可以显示它们。
除了桌面,Web推送通知也可以在移动浏览器上使用。
包括Facebook,Pinterest,LinkedIn和其他许多网站在内的热门网站已经在使用网络推送通知。 它被证明比短信,电子邮件营销和其他社交媒体更有吸引力。 据调查,推送通知在移动设备上的开放率为50%。
这意味着更多的参与者为您的WordPress网站,并显着提高您的整体页面浏览量和回访者。
话虽如此,让我们看看如何将网页推送通知添加到WordPress网站。
使用OneSignal在WordPress中设置Web推送通知
OneSignal是一项免费服务,允许您将推送通知添加到任何网站,网页或移动应用程序。
首先你需要安装并激活OneSignal插件。 更多细节
激活后,插件将在您的WordPress管理栏中添加一个名为OneSignal的新菜单项。 点击它会把你带到插件的设置页面。
设置页面分为安装和配置选项卡。 设置选项卡实际上是关于如何在WordPress中设置OneSignal推送通知的详细文档。 它与我们将在本教程中向您展示的步骤相同。
要设置OneSignal,您需要将不同的API密钥和应用程序ID添加到插件设置中。
让我们开始吧。
第1步:创建Google密钥
首先,您需要访问Google服务向导网站。
只需为您的应用程序提供一个名称并添加一个Android包名称即可。 OneSignal不使用Android软件包名称,但它是必填字段。
接下来,选择您的国家和地区,然后点击“选择和配置服务”按钮。
这将带您进入下一个屏幕,您将被要求选择您想要与您的应用程序一起使用的Google服务。 您需要点击“启用Google云消息传递”按钮。
您现在将看到您的服务器API密钥和发件人ID。
您需要复制您的发件人ID并将其粘贴到Google项目编号字段下的WordPress插件配置选项卡中。
您还需要复制Server API密钥并将其粘贴到计算机上的文本文件中。 本教程稍后将需要使用此API密钥。
第2步:设置Chrome和Firefox推送通知
我们现在将在Chrome和Firefox上设置推送通知。 首先,您需要访问OneSignal网站并创建您的免费帐户。
一旦你创建了你的账户,你需要登录并点击“添加一个新的应用程序”按钮。
您将被要求输入您的应用程序的名称。 你可以使用任何你想要的名字,然后点击“创建”按钮继续。
在下一页中,您将被要求选择一个平台进行配置。 您需要选择“网站推送”,然后点击下一步按钮继续。
之后,您将被要求选择浏览器平台。 您将在一个框中看到Google Chrome和Mozilla Firefox,在另一个框中看到Safari。
您需要点击Google Chrome和Mozilla Firefox框。 本文稍后将介绍如何设置Safari。
点击下一步按钮继续。
下一步,系统会要求您输入您的WordPress网站网址,Google服务器API密钥以及默认通知图标图片的网址。
如果您的网站不支持SSL / HTTPS,那么您需要选中旁边的复选框 “我的网站不完全是HTTPS” 选项。 如果你喜欢,你也可以在你的网站上设置SSL,但这不是必需的。
Google Chrome不支援非SSL或HTTP网站的网页推送通知。 OneSignal通过将用户订阅到他们自己的https域上的子域来解决这个问题。
检查 “我的网站不完全是HTTPS” 选项将显示HTTP后备选项。 您需要为您的应用程序选择一个子域名,然后输入您在第一步中生成的Google项目号码或发件人ID。
点击保存按钮继续。 现在你可以退出这个对话框。 系统会提示您提示您的设置尚未完成,稍后可以继续。 单击是关闭对话框。
第3步:获取OneSignal密钥
您现在需要为您的网站获取OneSignal Keys。 在应用程序面板中点击应用程序设置。
这将带你到你的应用程序设置页面。 您需要单击“密钥和ID”选项卡。
这将显示您的OneSignal应用程序ID和Rest API密钥。
您需要将它们复制并粘贴到您网站上的OneSignal WordPress插件的配置选项卡中。
第4步:设置Safari Web推送通知
请记住,我们跳过了Safari Web推送通知设置。 现在我们将向您展示如何设置Safari Web推送通知。
登录到您的OneSign帐户并进入您的应用程序设置页面。 向下滚动到Web平台,然后单击Apple Safari旁边的配置按钮。
这将弹出一个对话框,您将被要求输入您的网站名称和网站的网址。
那么你需要检查旁边的框 “我想上传我自己的通知图标” 选项。
您现在将看到一个选项来上传不同的图标大小。 这些是方形图像,使用Photoshop或任何图像编辑程序来创建精确大小的图标。
点击选择文件按钮上传所有的图标。
点击保存按钮,然后关闭对话框。
刷新应用程序设置页面并向下滚动到Web平台部分。 这次你会在Apple Safari下看到“Web ID”。
您需要复制此Web ID并将其粘贴到您网站上的OneSignal插件的“配置”选项卡中。
就是这样,您已经成功为您的WordPress网站设置了OneSignal网络推送通知。
第5步:测试您的WordPress网站上的Web推送通知
默认情况下,OneSignal插件会将订阅图标添加到您的WordPress网站。 在支持的浏览器中访问您的网站,然后点击订阅按钮。
你会看到默认的“感谢你订阅”的消息。
现在登录到OneSignal帐户。 点击您的应用程序名称,然后点击应用程序设置。
向下滚动到网络平台部分,然后点击Google Chrome和Firefox旁边的配置按钮。
您将看到您之前填写的平台配置屏幕。 只需点击保存按钮,然后点击继续。
您将被要求选择目标SDK。 您需要选择WordPress,然后点击下一步。
由于您只有一个用户,您的用户ID将自动填充。
点击下一步按钮,你会到达 “测试设置” 步。
点击 “发送测试通知” 按钮。
一个信号现在将发送网络推送通知。
通知外观可能会有所不同,具体取决于您用于订阅的浏览器。 当通知出现在电脑屏幕上时,您需要点击它。
它将带您到确认屏幕,显示您已成功为您的网站设置OneSignal网络推送通知。
返回到OneSignal网站上的配置屏幕,然后点击“ 检查通知状态 ‘按钮。
您现在将看到另一个成功消息,表示您已成功将Web推送通知添加到您的WordPress网站。
如何使用OneSignal在WordPress中发送Web推送通知
您的WordPress网站上的OneSignal网络推送通知插件会在您发布新帖子时自动向所有订阅者发送通知。
您也可以手动从OneSignal应用程序仪表板发送通知。 登录到您的OneSign帐户并点击您的应用程序名称。
从左侧的菜单中,点击“新消息”按钮。
这会将您带到新的信息屏幕。 您可以为您的通知输入标题和一些内容。
您也可以点击选项,细分,时间表/稍后发送进一步自定义您的网络推送通知。
例如,您可以将其链接到您网站上的特定页面,将其发送到您用户的特定部分,或安排在特定时间发送。
我们希望这篇文章帮助你添加网站推送通知你的WordPress网站