如何使用 AppPresser 将您的 Divi 网站变成移动应用程序
已发表: 2017-05-06确保您的 WordPress 网站支持移动设备从未如此重要。 毕竟，移动用户现在占在线流量的大部分。 这意味着您必须竭尽全力确保他们的体验尽可能好。
借助 AppPresser 等服务，您现在可以为 WordPress 网站创建简单的应用程序，即使您没有开发背景。 在本文中，我们将教您如何使用该平台开发移动应用程序。 但是，让我们首先谈谈移动应用程序、网络浏览的未来以及 AppPresser 可以为您提供什么。
为什么移动应用是网页浏览的未来
鉴于统计数据，您很可能是通过移动设备阅读本文的——这甚至可能是您目前与网络互动的主要方式。 毕竟，我们大多数人一有机会就会拿出智能手机，包括上网冲浪。
使您的网站具有响应性并不意味着您必须牺牲风格才能使其可用。
作为网站所有者，迎合智能设备用户的最简单方法是针对较小的视口优化您的网站。 这样，无论使用何种设备，用户都将获得一致的体验。 但是，还有另一种选择——尽管需要做更多的工作——那就是为您的网站创建一个应用程序。
与常规的移动友好型网站相比，应用程序具有一些明显的优势：
- 它们为读者提供有关您网站的持续提醒。 在他们的设备上安装专用应用程序可能会导致一些用户考虑检查新内容。 您还可以使用比平时更高的访问频率。
- 您可以包含专用的、特定于移动设备的功能。 许多应用程序都包含有趣的功能，例如社交登录和推送通知。 当然，也可以在常规站点上实现这些，但它们作为应用程序的一部分感觉更自然。
- 看起来很专业。 为您的网站安装应用程序只会让它看起来很专业。 只要您提供现代、稳定的产品，用户就很可能会留下深刻的印象。
当然，为您的网站创建应用程序并不意味着您应该放弃使其适合移动设备。 将其视为最大化其曝光度的补充措施。 最好的部分是，应用程序创建过程并不复杂，这要归功于一些有趣的新服务。
AppPresser 简介
AppPresser 是一项服务，可让您将现有的 WordPress 网站转变为外观现代的移动应用程序。 使用该平台，您可以添加任何现有页面、创建菜单并受益于包括推送通知在内的高级功能，使您的应用程序看起来更专业。
最好的部分是，使用该服务非常简单。 事实上，完全有可能使用 AppPresser 在几个小时内启动并运行一个工作（和时尚）的应用程序。
您可能希望预先选择每月 19 美元的入门计划，该计划支持单个应用程序。 如果您需要的不止这些（或者您打算通过应用获利），还有其他可用的层级。
主要特点：
- 允许您创建适用于 Android 和 iOS 的移动应用程序。
- 包括一个 WordPress 主题和插件，使您能够访问高级应用程序功能。
- 提供社交登录和共享选项。
价格：每月 19 美元 | 更多信息
如何使用 AppPresser 将您的 Divi 网站变成移动应用程序
在我们深入学习本教程之前，您需要在 AppPresser（正如我们之前提到的，这是一项付费服务）和 Phonegap（您需要在最后一步使用）上注册一个帐户。
注册前者后，您将收到一封电子邮件，其中提供对 AppPresser 插件及其补充主题（在其他地方找不到）的访问权限。
至于主题，别担心——您不需要激活它。 它只需要安装以启用 AppPresser 插件和 Web 应用程序来访问数据，它只会显示在您的移动应用程序中。 如果您是 Divi 用户，使用 AppPresser 的主题和插件不会影响您的安装。
一旦你安装并激活了 AppPresser 插件，然后上传了它的主题（但没有激活它），进入第一步！
第 1 步：创建一个新应用程序并自定义其样式
首先，您需要使用您注册时使用的相同凭据登录您的 AppPresser 帐户。 该服务将提示您创建一个新应用程序，因此一旦您添加了标题，请单击Create App ：
接下来，您需要在开始自定义之前将您的网站链接到您的应用程序。 为此，请单击 AppPresser 仪表板上的“常规”选项卡，然后查找显示API 设置的部分：
复制您的站点 slug和应用程序 ID ，然后前往 WordPress 仪表板上的AppPresser选项卡。 您会找到两个相应的字段，因此将您的数据粘贴到那里，然后保存更改：
这样一来，您就可以开始进行应用程序的自定义了。 返回您的 AppPresser 仪表板，导航到Customize ，然后单击Customize and Build App按钮：
下一个屏幕应该看起来很熟悉，因为它是在 WordPress 实时定制器之后建模的，您还将看到一个移动设备的模型，其中显示了您的应用程序的原型。 完成后，您将能够下载它的完整工作版本。
在接下来的几个步骤中，我们将介绍定制器中最关键的部分，但现在让我们关注颜色选项卡。 在这里，您会找到多个选项来更改应用程序的颜色以及每个选项的作用的解释：
一旦您调整了应用程序的调色板并对结果感到满意，就该查看您的菜单了。
第 2 步：更改应用程序的菜单
每个 AppPresser 应用程序都以相同的默认菜单开始：主屏幕、介绍和关于页面，以及指向服务主页的链接。 要替换它们，您需要进入定制器中的“菜单”选项卡，然后单击“应用程序菜单”选项：
在下一个屏幕上，您可以从左侧菜单中选择元素。 在这种情况下，主页、介绍和关于按钮都会引导您进入自定义页面，您现在可以通过单击删除选项来选择是否删除它们的菜单项：
您还可以保留这些菜单项并自定义它们各自的页面（一分钟内更多）。 现在，删除您不想要的任何菜单项，并使用“添加项”选项用其他页面填充您的菜单。 为此，您将能够选择现有的 WordPress 页面、帖子或自定义页面（使用 AppPresser 构建）……
…单击WordPress/外部链接按钮将为您提供包含指向 WordPress 网站页面之一的链接的选项：
一旦您的菜单被填充（并安装了 AppPresser 主题），该应用程序将能够“导出”您网站的内容并自动显示它：
在不到一分钟的时间里，您就向您的应用程序添加了一个新的移动就绪页面。 在查看设置自定义页面之前，根据需要对其他页面重复此过程。
第 3 步：将自定义页面添加到您的应用程序
要设置自定义页面，请前往自定义程序中的相应选项卡。 与标准菜单一样，您会发现三个现有页面：主页、介绍和关于。 在这个阶段，您可以选择将它们中的每一个重新用于您自己的应用程序，或者只是忽略它们并创建新页面：
单击“添加新页面”按钮将为您提供两个选项：使用自定义 HTML 创建新页面……
...或从 AppPresser 的预构建样式之一中进行选择，其中包括列表格式和卡片布局：
要设置其中任何一个，您需要使用 WordPress API 创建自定义列表页面。 然后，只需将链接粘贴到应用程序内置样式正下方的字段中的新页面：
当您完成对自定义页面的修改后，是时候通过为您的应用程序调整一些额外的设置来结束这些事情了。
第 4 步：自定义应用程序的设置
在这个阶段，你应该有一个可以工作的应用程序——至少在定制器中——但一个仍然带有 AppPresser图标和徽标的应用程序。 要替换它们，请导航到定制器中的“设置”选项卡：
在这里，您可以指明您希望应用程序使用哪些菜单。 目前，我们建议您坚持使用您之前创建的那个，除非您想设置其他的。
如果您继续向下滚动，您将看到更改应用程序名称、描述和作者信息的选项。 如有必要，请填写这些字段，然后继续滚动直到到达图标和启动图像部分：
您需要在此处为每个可用选项上传 PNG 文件。 完成后，您的图标将出现在您的主菜单上方，并且您的应用程序加载时将显示您的启动画面。
请记住，AppPresser 包含有关您应该上传的图像大小的一些信息，因此除非您希望图像看起来失真，否则您应该遵守这些信息。 在这里完成后，是时候最终启动并运行您的应用程序了。
应用准备好启动后该怎么做
要完成构建您的应用程序，您需要进入定制器中的构建和预览部分。 在那里，您将看到一个用于输入 Phonegap 身份验证令牌的选项。 对于初学者来说，Phonegap 是一个框架，您需要使用它来将您的应用程序安装到设备上，或将其提交到商店。
更新令牌后，您将看到编译应用程序的选项，该服务将为您执行此操作。 然后，只需将其提交到 Android 和 iOS 商店（或两者），等待批准，并从您的常规网站链接到它们。
如果您正在考虑直接从您的站点分发您的应用程序，我们建议您不要这样做——主要是出于安全原因。 更重要的是，用户可能会觉得下载未经任何服务批准的应用程序并不安全，因此如果您跳过提交步骤，您的努力可能会付诸东流。 当然，WordPress 插件（例如 Easy Digital Downloads）可能符合要求，但上述相同的考虑因素仍应适用。
结论
为您的 WordPress 网站构建一个应用程序可能听起来有点矫枉过正，但实际上它可能是一个聪明的主意。 毕竟，诸如 AppPresser 之类的服务比以往任何时候都更容易。 更重要的是，由于推送通知等功能，应用程序可能正是您进一步吸引移动用户所需要的。
在这篇文章中，我们向您展示了如何使用 AppPresser 在移动应用程序中打开您的 Divi 网站。 让我们快速回顾一下这些步骤：
- 创建一个新应用程序并自定义其样式。
- 更改应用程序的菜单。
- 向您的应用程序添加自定义页面。
- 自定义您的应用程序的设置。
您对使用 AppPresser 为 Divi 创建移动应用程序有任何疑问吗？ 在下面的评论部分提问！
文章缩略图由 31moonlight31/shutterstock.com 提供