” completed_text=”耶
完成了”]注意：您可以通过修改短代码中的文本来更改按钮上显示的文本和完成的文本保存设置此简码创建一个按钮，允许用户单击它并将课程记录为完成请注意，当您单击按钮完成课程时，侧边栏中相应课程的菜单项将略微淡化并在其右侧显示一个复选标记继续将您刚刚创建的文本模块保存到您的库中，名称为“Complete Button”现在，您可以根据需要使用该库项目在所有页面上输入相同的模块注意：您可能希望继续将包含完成按钮的新版本课程页面布局保存到您的库中，这样您在构建未来课程页面时就不必继续将其添加为次要项目WPComplete 插件还允许您显示图表，向用户显示他们在特定课程中的进度我们将在课程的侧边栏中添加一个条形图来显示 UX 设计课程的进度还记得我们如何为 UX 设计课程创建自定义小部件区域以在课程页面侧边栏中显示课程菜单吗？那么现在我们要在课程菜单的正上方添加一个进度条图这样用户就可以在炫酷的视觉显示中看到他们的进度要添加条形图，请转到您的 WordPress 仪表板并导航至Appearence > Widgets然后切换打开您之前创建的“UX Design”自定义小部件，并将 HTML 小部件拖到当前存在的自定义菜单小部件顶部的小部件区域中在 HTML 内容框中，输入以下简码：[wpc_progress_bar course=”用户体验设计”]此短代码将显示特定课程“UX 设计”的进度条图该课程名称对应于您在“This is a part of:”旁边的 WPComplete 框选项中输入的内容如果您将来有另一门课程，只需在为该课程添加简码时在“UX Design”位置输入新课程名称即可注意：有关此插件可用的简码的完整列表，请转到简码备忘单现在转到“第 1 章：基础知识简介”以查看它的外观单击页面底部的完成按钮现在查看侧边栏，看看发生了什么变化条形图现在显示您已完成课程的 33%课程页面的菜单项现在显示为褪色，右侧带有复选标记，表明该课程已完成很酷吧？让我们回顾一下到目前为止我们所拥有的：1. 我们有一个新的课程页面模板，作为我们未来课程的转到模板2. 我们有一个为每门课程创建自定义菜单的系统3. 我们有一个系统可以为每门课程设置自定义小部件区域，以在课程页面上显示该特定课程的自定义菜单4. 我们可以在我们的课程页面上添加一个完成按钮，单击该按钮后，会在条形图和相应的菜单链接中显示进度将我们的网站变成功能性线上课程的最后阶段是整合会员级别，以将我们的内容限制为付费客户建立会员页面如果您还没有这样做，请安装并启用 Restrict Content Pro 插件安装后，该插件将自动创建 5 个页面来处理会员流程如果您在默认页面编辑器中查看每个页面，您会发现每个页面的内容中唯一添加的是简码例如，如果您转到“注册”页面，您会看到内容编辑器中唯一显示注册表单的简码“[register_form]”由于您需要显示每个自动生成页面的内容的是短代码，因此您可以使用 Divi Builder 轻松地为这些页面构建布局例如，如果您想要一种快速简便的方法来自定义您的注册页面，请转到您的课程页面并部署可视化构建器使用名称“电子课程页面标题”（或类似名称）将布局的顶部部分保存到您的库中然后单击其中一个显示课程的简介，并将该模块保存到您的库中，名称为“e-course blurb content box”（或类似名称）现在转到您的注册页面，将简码复制到剪贴板（突出显示简码并单击 ctrl + c）然后部署 Divi Builder，然后部署可视化构建器从您的图书馆添加名为“电子课程页眉”的新保存部分将包含标题的文本模块更新为“Register”而不是“Courses”然后单击以在该部分的当前模块下从您的库中添加一个模块选择您刚刚保存到库中的“电子课程简介内容框”模块然后按如下方式更新设置：在内容选项卡下…擦除标题内容：按 ctrl + v 输入您保存到剪贴板的短代码 [register_form]擦除图像 url保存设置注意：这是快速简便的方法我使用了一个 blurb 模块，因为这是引入模块样式的最快方法您可能希望改用文本模块现在在隐身浏览器中查看您的注册页面您仍然需要自定义表单的设计（在本教程中不打算这样做），但这可以通过一些检查和自定义 CSS 轻松完成您可以按照相同的过程来更新插件生成的所有 5 个会员页面要查看哪些页面被用于处理会员资格，请转到 WordPress 仪表板并导航至“Restrict ”>“设置”，您将在“常规”选项卡下看到所有正在使用的页面的列表添加免费订阅级别向您的线上课程添加免费订阅级别是捕获潜在客户、将其添加到电子邮件营销活动并以高级会员资格追加销售的好方法要添加免费订阅级别，请转到 WordPress 仪表板并导航至Restrict > 订阅级别然后填写设置以创建您的免费会员资格以下是免费订阅级别的输入示例：名称：FREE描述：这是 Coding School 的免费订阅用户角色：订户将其他选项保留为默认设置然后点击添加会员级别添加高级订阅级别高级会员通常是您可以付费访问免费会员无法访问的更高级别内容的地方与免费会员一样，用户必须在注册表上注册唯一的区别是他们将被定向到付款表格以购买订阅如果用户已经是免费会员，他们可以使用他们当前的注册信息升级到高级订阅，然后支付升级费用要添加 Premium 订阅级别，请转到 WordPress 仪表板并导航至Restrict > 订阅级别然后填写设置以创建您的高级订阅以下是为高级订阅级别输入内容的示例：名称：高级说明：这是 Coding School 的高级订阅持续时间：1 年价格：29用户角色：订阅者根据订阅级别限制课程现在我们已经创建了免费和高级订阅级别我们可以根据用户的订阅级别选择限制页面/帖子甚至特定内容该插件使这个过程非常简单让我们开始吧，将我们创建的第一课的访问权限限制为免费订阅为此，请去编辑标题为“第 1 章：基础知识简介”的课程页面请注意页面编辑器顶部的“限制此内容”框在该框中，您有一个下拉输入框，允许您选择谁应该有权访问内容您要选择订阅级别的成员. 选择后，您会看到更多选项出现选择第一个选项“任何订阅级别的成员”那是因为我们希望拥有高级订阅的会员也可以访问此内容注意：此设置将对非订阅用户隐藏整个页面如果您想隐藏页面上的某些内容并使其仅对免费或高级订阅者可用，您可以使用短代码来包装您想要隐藏的内容由于我们使用的是 divi 构建器，因此使用短代码包装内容可能具有挑战性，但您可以考虑做的一件事是仅使用短代码将内容包装在 blurbs 的实际内容框中，并使标题可见对于标题为“第 2 章：信息架构”的下一课，我们将把页面限制为仅限高级订阅者为此，请转到编辑页面并在页面编辑器顶部的“限制此内容”框中，选择订阅级别的成员然后选择“特定订阅级别的成员”选项然后选择“高级”现在只有拥有高级订阅的人才能访问该页面通过更新页面保存您的更改更改受限内容的重定向页面当用户试图访问受限制的内容时，您可以将用户重定向到特定页面由于我们希望用户注册以访问课程，因此我们将用户重定向到注册页面是有道理的为此，请转到 WordPress 仪表板并导航至“Restrict”>“设置”，然后单击“杂项”选项卡找到重定向页面选项，然后从下拉输入框中选择注册页面保存选项现在，每次非订阅用户尝试访问受限页面时，他们都会自动重定向到注册页面你可以很快地测试这个保存页面并在隐身浏览器中打开页面，以查看用户在尚未注册时看到的内容注意：如果您愿意，可以为此用例创建一个额外的注册页面，以便您可以包含更具体的号召性用语，例如“抱歉，您目前无权访问此内容，请在下方注册” 用下面的登记表添加您的支付网关此时您需要确保您的支付网关已与 Restrict Content Pro 集成您可以通过导航到“Restrict”>“设置”并单击“付款”选项卡来执行此操作在那里您可以选择要启用的网关以及输入集成网关所需的信息您有九个选项可供选择，包括 Stripe 和 Paypal我不会详细介绍设置这些设置所涉及的细节，但我的建议是确保并彻底测试您的支付网关以确保它们正常工作自定义您的电子邮件通知Restrict Content Pro 允许您在新会员注册时为新会员和管理员自定义通知电子邮件通过在电子邮件正文中包含一个好的号召性用语来利用此选项，鼓励用户通过指向第一课的链接开始课程您可以通过转到“Restrict”>“设置”并单击“电子邮件”选项卡来找到电子邮件设置可选的电子邮件营销集成您可能有一个 Mailchimp 或Aweber帐户，您希望在他们注册时将其添加到其中您可以使用 Restrict Content Pro 插件提供的众多附加组件之一来做到这一点只需导航至“Restrict”>“附加组件”，然后找到您想要的电子邮件平台现在怎么办？现在您已经设置了您的线上课程网站，您仍然需要完成每个页面的所有内容设置、向按钮添加 URL 以及许多其他调整但是基础已经打好了希望这能让您设置一个可以轻松构建的平台最后的总结有人可能会争辩说，使用 WordPress 世界中所有出色的工具，您可以非常轻松地开始和运行在线课程但随之而来的是设计的挑战如果设计不是您的强项，那么让这些网站看起来不错并不容易幸运的是， “学习管理布局包”等预制Divi 布局为设计问题提供了很好的解决方案开箱即用的布局既实用又美观但是接下来的问题是找到合适的插件将您漂亮的布局转换为实用的在线课程有许多很棒的 WordPress 会员插件和学习管理系统插件，它们的成本和复杂程度各不相同这篇文章的目的是让您以低成本建立并运行一个具有简单会员资格的精美线上课程网站对于那些希望使用免费插件创建它的人，很抱歉让他们失望了我认为本教程最好使用 Pro 版本，因为在我看来最终结果物有所值
（图片来源网络，侵删）
0 评论