这是一篇完整的「在线课程平台搭建」教程,我们将使用 WordPress+WooCommerce 强大的架站软件,量身打造定制化的网站。
不论是何种性质的教程平台,想建置:影音、文章、图片等 .. 多种媒体形式的课程网站。 以及想拥有:新增+管理在线课程、作业上传、学生(会员)系统、评分测验、接受付款等 .. 功能。 更多 线上课程平台推荐。
这篇教程文章都能够一一帮助你完成:)
本次教程,会从搭建网站(基本主题 / 插件安装 > 线上课程插件操作 > 网站上线,一步步带领各位站长完成线上课程网站建置~
我们将使用 WordPress 在线课程插件: LearnDash 搭建在线课程网站。
Astra 主题安装+套用课程模板
这章节,会教如何安装 WordPress 主题主题+套用模板,让网站看起来美观且功能性更强。
Astra 是一款热门多功能的轻量级主题,主题执行速度快速,可拿来建立多种类型的网站。
为了方便接下来教程,建议先跟我一起安装 Astra 主题,有免费版可安装。 更多可参考 Astra 主题入门、Astra Pro 进阶教程。
WordPress 主题主题安装
首先,前往 WordPress 后台 > 外观 > 主题主题,点击 安装主题主题。
![sbg-theme-install-5 前往 WordPress 主题安装](https://img.itaoda.cn/wp-content/uploads/2023/05/sbg-theme-install-5.png?imageMogr2/auto-orient/format/webp/blur/1x0/quality/60|watermark/2/text/5rqQ56CB56S-/font/5b6u6L2v6ZuF6buR/fontsize/1200/fill/IzAwMDAwMA==/dissolve/6/gravity/Center/dx/10/dy/10|imageslim)
在搜索字段输入 Astra,我们安装 Astra 提供的免费版本,安装完成后请记得 启用,才会真正套用主题。
![sbg-blog-theme2-7 创建Blog :wordpress 主题主题安装](https://img.itaoda.cn/wp-content/uploads/2023/05/sbg-blog-theme2-7.png?imageMogr2/auto-orient/format/webp/blur/1x0/quality/60|watermark/2/text/5rqQ56CB56S-/font/5b6u6L2v6ZuF6buR/fontsize/1200/fill/IzAwMDAwMA==/dissolve/6/gravity/Center/dx/10/dy/10|imageslim)
主题启用完成,前往网站前台看一下成果,看起来还不错的 WordPress 主题,成功出现啦。
使用 Astra模板
Astra 有提供多种现成模板,安装模板导入插件就能直接使用,可节省网页设计时间。
前往 外观 > Astra Options,点击 Install Importer Plugins 安装模板导入插件。 或是安装 Starter Templates 插件,这两种方法都是一样的。
![n-att-01-5 安装 Astra 起始样板插件](https://img.itaoda.cn/wp-content/uploads/2023/05/n-att-01-5.png?imageMogr2/auto-orient/format/webp/blur/1x0/quality/60|watermark/2/text/5rqQ56CB56S-/font/5b6u6L2v6ZuF6buR/fontsize/1200/fill/IzAwMDAwMA==/dissolve/6/gravity/Center/dx/10/dy/10|imageslim)
安装并启用模板插件,会看到 Astra 支持多种页面编辑器模板,选择热门的 Elementor 类型。
![n-att-02-6 选择页面编辑器相关的模板](https://img.itaoda.cn/wp-content/uploads/2023/05/n-att-02-6.png?imageMogr2/auto-orient/format/webp/blur/1x0/quality/60|watermark/2/text/5rqQ56CB56S-/font/5b6u6L2v6ZuF6buR/fontsize/1200/fill/IzAwMDAwMA==/dissolve/6/gravity/Center/dx/10/dy/10|imageslim)
进入后,有多种免费模板可供安装,但有些是进阶版才能使用,更多 Astra Pro 进阶版教程。
套用课程主题模板
我们搜索 Learn Baking 进行安装。 (建议先跟我安装一样的,方便接下来教程,学会后都能再更换)。
选择“ Import Complete Site ”完整导入该模板。
![wlms-82-1](https://img.itaoda.cn/wp-content/uploads/2023/05/wlms-82-1.png?imageMogr2/auto-orient/format/webp/blur/1x0/quality/60|watermark/2/text/5rqQ56CB56S-/font/5b6u6L2v6ZuF6buR/fontsize/1200/fill/IzAwMDAwMA==/dissolve/6/gravity/Center/dx/10/dy/10|imageslim)
导入完成,到前台检查,恭喜大家完成简单的网站外观设置,之后也可以找到自己喜欢的模板来制作)
![wlms-83-1](https://img.itaoda.cn/wp-content/uploads/2023/05/wlms-83-1.png?imageMogr2/auto-orient/format/webp/blur/1x0/quality/60|watermark/2/text/5rqQ56CB56S-/font/5b6u6L2v6ZuF6buR/fontsize/1200/fill/IzAwMDAwMA==/dissolve/6/gravity/Center/dx/10/dy/10|imageslim)
5. LearnDash 是什么?
![wocp-01-5](https://img.itaoda.cn/wp-content/uploads/2023/05/wocp-01-5.jpg?imageMogr2/auto-orient/format/webp/blur/1x0/quality/60|watermark/2/text/5rqQ56CB56S-/font/5b6u6L2v6ZuF6buR/fontsize/1200/fill/IzAwMDAwMA==/dissolve/6/gravity/Center/dx/10/dy/10|imageslim)
LearnDash 是一款老牌且强悍的 WordPress 在线课程插件,目前有许多 500 强公司及大学正在使用,虽只有付费版本,但它强大且完整的功能,是我想推荐它的主因。 更多 LearnDash 完整教程。
LearnDash 具备所有线上课程插件必备功能,包含:上传各种文档形式的课程文件、课程内容下载、销售课程、学生奖励积分、老师管理、作业及测验等 .. 。
设有自动电子邮件通知,以及后台详细的课程相关数据报告,且前台网站可定制样式,并且具备响应式设计,一次设计便可适用于任何装置。
![wocp-23-edited-4 WordPress在线课程插件 :LearnDash 可自定义义多方面样式](https://img.itaoda.cn/wp-content/uploads/2023/05/wocp-23-edited-4.png?imageMogr2/auto-orient/format/webp/blur/1x0/quality/60|watermark/2/text/5rqQ56CB56S-/font/5b6u6L2v6ZuF6buR/fontsize/1200/fill/IzAwMDAwMA==/dissolve/6/gravity/Center/dx/10/dy/10|imageslim)
在课程设计方面, LearnDash 带有简单的区块式编辑器,可在页面上嵌入,在设计上更直观。
还可建置多层级课程,并且有课程计时器,纪录学生的阅读时间。
也可为课程设置学习条件,例如:解锁 B 课程,必须先学习 A 课程。
除此之外,测验系统也有多种不同问题类型可设置,如:问答、选择、多选、对错等 .. ,让测验卷变得更丰富。
![wocp-04-4 WordPress在线课程插件 :LearnDash 设置多种问答类型测验](https://img.itaoda.cn/wp-content/uploads/2023/05/wocp-04-4.png?imageMogr2/auto-orient/format/webp/blur/1x0/quality/60|watermark/2/text/5rqQ56CB56S-/font/5b6u6L2v6ZuF6buR/fontsize/1200/fill/IzAwMDAwMA==/dissolve/6/gravity/Center/dx/10/dy/10|imageslim)
学生及教师方面, 可设置学生及老师群组,让教师可在群组中配置作业、额外课程、管理等 .. 多功能。
LearnDash 也设有学习论坛,方便教师以及学生讨论问题。
课程学习至某个段落,可向学生显示成绩、排行榜、课程积分,与证书和徽章系统有良好搭配,增加学生的成就感。
![wocp-03-edited-4](https://img.itaoda.cn/wp-content/uploads/2023/05/wocp-03-edited-4.png?imageMogr2/auto-orient/format/webp/blur/1x0/quality/60|watermark/2/text/5rqQ56CB56S-/font/5b6u6L2v6ZuF6buR/fontsize/1200/fill/IzAwMDAwMA==/dissolve/6/gravity/Center/dx/10/dy/10|imageslim)
最重要的付款方面, LearnDash 提供了大量的付款方案相关设置,包括:订阅、一次性购买、会员资格、在线课程购物车等 .. 。
且LearnDash与WooCommerce串接,让的站长可使用线上付款的相关功能。
![wocp-02-1024x630-5 WordPress在线课程插件 :LearnDash 可使用 WooCommerce 相关购物车、付款功能](https://img.itaoda.cn/wp-content/uploads/2023/05/wocp-02-1024x630-5.png?imageMogr2/auto-orient/format/webp/blur/1x0/quality/60|watermark/2/text/5rqQ56CB56S-/font/5b6u6L2v6ZuF6buR/fontsize/1200/fill/IzAwMDAwMA==/dissolve/6/gravity/Center/dx/10/dy/10|imageslim)
方案评论
LearnDash 是目前最推荐使用的在线课程插件,它适用于 WordPress 热门主题,可以更完整且全面的功能来管理在线课程网站,适合建置不同类型的课程网站。
且LearnDash与许多第三方插件串接,可以安装许多额外的插件、附件来扩充其功能。
能与 WooCommerce 串接,是我最主要推荐的原因之一,的站长可以不用烦恼付款的问题。
课程销售也有许多方案供站长选择,像是:先免费试阅后付费、一次性付款、订阅会员制、课程组合包等 ..,可以更好地销售你的线上课程:
上述的这些都是 LearnDash 强大的功能范围。
如果你正在考虑使用哪款 WordPress 在线课程插件,那 LearnDash 应该会是最优质的选择之一:)
6. LearnDash 方案如何选择?
了解了什么是LearnDash之后,这个章节,我们就要来开始安装+启用LearnDash啦!
首先,前往LearnDash官网,点击右上角Get LearnDash(取得LearnDash)按钮,前往LearnDash方案购买页面。
![wlms-05-1](https://img.itaoda.cn/wp-content/uploads/2023/05/wlms-05-1.png?imageMogr2/auto-orient/format/webp/blur/1x0/quality/60|watermark/2/text/5rqQ56CB56S-/font/5b6u6L2v6ZuF6buR/fontsize/1200/fill/IzAwMDAwMA==/dissolve/6/gravity/Center/dx/10/dy/10|imageslim)
LearnDash 目前只提供年租制的方案,所以下面所有的价格,都是按年付费。
下图分为三个方案:「 BASIC 」1 个站点、「PLUS PACKAGE 」10 个站点、「 PRO PACKAGE 」25 个站点。
站长们依据需求做选择即可。
![wlms-84-1](https://img.itaoda.cn/wp-content/uploads/2023/05/wlms-84-1.png?imageMogr2/auto-orient/format/webp/blur/1x0/quality/60|watermark/2/text/5rqQ56CB56S-/font/5b6u6L2v6ZuF6buR/fontsize/1200/fill/IzAwMDAwMA==/dissolve/6/gravity/Center/dx/10/dy/10|imageslim)
我选择的是 PLUS PACKAGE 方案,因为此方案可搭建多达 10 个在线课程网站,且有包含 LearnDash 提供的 ProPanel 功能。
小备注: ProPanel 可供站长分析现有学生、学习状况、课程的订购成长等 .. 数据,在后面我们也会介绍。
选好方案后,我们直接进行结账,会跳到输入结账信息的页面,让站长们确认购买方案。
![wlms-07-1](https://img.itaoda.cn/wp-content/uploads/2023/05/wlms-07-1.png?imageMogr2/auto-orient/format/webp/blur/1x0/quality/60|watermark/2/text/5rqQ56CB56S-/font/5b6u6L2v6ZuF6buR/fontsize/1200/fill/IzAwMDAwMA==/dissolve/6/gravity/Center/dx/10/dy/10|imageslim)
确认购买方案无误,我们往下填写结账信息,填写完毕,按下Submit Order即可完成购买。
![wlms-08-1](https://img.itaoda.cn/wp-content/uploads/2023/05/wlms-08-1.png?imageMogr2/auto-orient/format/webp/blur/1x0/quality/60|watermark/2/text/5rqQ56CB56S-/font/5b6u6L2v6ZuF6buR/fontsize/1200/fill/IzAwMDAwMA==/dissolve/6/gravity/Center/dx/10/dy/10|imageslim)
这样我们就完成 LearnDash 的购买流程啦:)
7 . LearnDash 安装+启用凭证
完成购买, LearnDash 会寄送多封电子邮件,包含:收据、欢迎使用信件、会员后台登入路径及信息等 .. 。
从邮件中的网址可直接连接到 LearnDash 会员后台。
Step 1:安装 LearnDash 课程插件
进入LearnDash会员后台,我们使用信件中官方给予的账号+密码登录。
![wlms-09-1](https://img.itaoda.cn/wp-content/uploads/2023/05/wlms-09-1.png?imageMogr2/auto-orient/format/webp/blur/1x0/quality/60|watermark/2/text/5rqQ56CB56S-/font/5b6u6L2v6ZuF6buR/fontsize/1200/fill/IzAwMDAwMA==/dissolve/6/gravity/Center/dx/10/dy/10|imageslim)
登入以后,我们会看见会员后台有:LearnDash、ProPanel 的下载点+凭证,还有演示站点。
选择“ Download ” 按钮下载 LearnDash 。
![wlms-10-1](https://img.itaoda.cn/wp-content/uploads/2023/05/wlms-10-1.png?imageMogr2/auto-orient/format/webp/blur/1x0/quality/60|watermark/2/text/5rqQ56CB56S-/font/5b6u6L2v6ZuF6buR/fontsize/1200/fill/IzAwMDAwMA==/dissolve/6/gravity/Center/dx/10/dy/10|imageslim)
下载完成,我们会获得一个文档包。
接着前往 WordPress 后台,找到插件 > 安装插件 > 上传插件,把 LearnDash 插件文档包上传安装+启用。
![wlms-11-1](https://img.itaoda.cn/wp-content/uploads/2023/05/wlms-11-1.png?imageMogr2/auto-orient/format/webp/blur/1x0/quality/60|watermark/2/text/5rqQ56CB56S-/font/5b6u6L2v6ZuF6buR/fontsize/1200/fill/IzAwMDAwMA==/dissolve/6/gravity/Center/dx/10/dy/10|imageslim)
这样 LearnDash 插件就完成安装啰:)
Step 2:启用凭证
接着我们启用 LearnDash 使用凭证。
前往LearnDash会员后台,选择LearnDash>License Details按钮,前往购买凭证页面。
找到 License Key 复制你的启用证书。
![wlms-12-1](https://img.itaoda.cn/wp-content/uploads/2023/05/wlms-12-1.png?imageMogr2/auto-orient/format/webp/blur/1x0/quality/60|watermark/2/text/5rqQ56CB56S-/font/5b6u6L2v6ZuF6buR/fontsize/1200/fill/IzAwMDAwMA==/dissolve/6/gravity/Center/dx/10/dy/10|imageslim)
小备注: Authorized Domain Usage 区域可管理已使用该凭证的域。
接着前往 WordPress 后台 > LearnDash > Setting 页签 > LMS License 区块 ,填入购买时填写的电子邮件,并将凭证复制贴上。
最后选择Update License上传购买凭证。
![wlms-13-1](https://img.itaoda.cn/wp-content/uploads/2023/05/wlms-13-1.png?imageMogr2/auto-orient/format/webp/blur/1x0/quality/60|watermark/2/text/5rqQ56CB56S-/font/5b6u6L2v6ZuF6buR/fontsize/1200/fill/IzAwMDAwMA==/dissolve/6/gravity/Center/dx/10/dy/10|imageslim)
这样就完成LearnDash启用凭证啰,恭喜大家,我们可以开始使用LearnDash的功能了~
全站设定
安装+启用 LearnDash 之后,我们马上开始搭建线上课程网站的第一步:进行全站设定吧:)
LearnDash 的全站设定相对简单好上手,我也会一步步带领大家操作。
准备好的话,我们就开始啰~
General 一般设定
前往 WordPress 后台 > LearnDash > Setting 页签 > “ General (一般设定)」区块。
因为一般设定有较多区块面板,所以我会分小章节,分别讲解。
Design & Content Elements 设计&内容元素
进入“ General (普通设置)」面板后,首先,我们会先看到” Design & Content Elements“区域 。
在这里,我们可以调整:全站色彩、Logo、课程显示的相关选项。
依照图片顺序,将焦点模式、LearnDash会员注册功能,即改变 Logo、 视频响应式大小 ,一一做相对应的开启+变更。
![wlms-14-1](https://img.itaoda.cn/wp-content/uploads/2023/05/wlms-14-1.png?imageMogr2/auto-orient/format/webp/blur/1x0/quality/60|watermark/2/text/5rqQ56CB56S-/font/5b6u6L2v6ZuF6buR/fontsize/1200/fill/IzAwMDAwMA==/dissolve/6/gravity/Center/dx/10/dy/10|imageslim)
- Accent Color:主视觉色,整个课程主题+列表使用的主要颜色。
- Progress Color:用于所有进度条相关项目的颜色设定。
- Notifications Warnings , etc… :警告、重要信息时会显示此颜色。
- Focus Mode:焦点模式。 提供无干扰的课程体验,让学生可以专注在课程页内容,启用后会一次适用于所有课程。
- Login & Registration:启用 LearnDash 模版的登录和注册页面。
- Logo Upload:更改全站显示 Logo 。
- Video Responsive CSS:让全站视频呈现响应性设定。 如果后续发现影片无法正常显示问题,再关闭该选项。
这边我想特别让大家看一下开启「Focus Mode 」焦点模式的课程面板。
焦点模式会在前台的课程页面上,新增一块课程进度控制面版,若关闭此功能,就不会出现下图的控制面板。
![wlms-40-1](https://img.itaoda.cn/wp-content/uploads/2023/05/wlms-40-1.png?imageMogr2/auto-orient/format/webp/blur/1x0/quality/60|watermark/2/text/5rqQ56CB56S-/font/5b6u6L2v6ZuF6buR/fontsize/1200/fill/IzAwMDAwMA==/dissolve/6/gravity/Center/dx/10/dy/10|imageslim)
全部设定完成,按下「Save(保存)」即可。
Global Pagination Settings 全局分页设置
往下滑我们会看见 Global Pagination Settings 区域,这边可为各种列表指定每页显示的课程、测验项目数量。
若没有特别需求,维持原设定即可。
![wlms-15-1](https://img.itaoda.cn/wp-content/uploads/2023/05/wlms-15-1.png?imageMogr2/auto-orient/format/webp/blur/1x0/quality/60|watermark/2/text/5rqQ56CB56S-/font/5b6u6L2v6ZuF6buR/fontsize/1200/fill/IzAwMDAwMA==/dissolve/6/gravity/Center/dx/10/dy/10|imageslim)
Admin User Settings 管理员用户设置
接着往下,看到「Admin User Settings 」区域,这里可控制管理员在课程页面的权限。
若无特别需求,维持预设设定即可,详细说明如下图:
![wlms-16-1](https://img.itaoda.cn/wp-content/uploads/2023/05/wlms-16-1.png?imageMogr2/auto-orient/format/webp/blur/1x0/quality/60|watermark/2/text/5rqQ56CB56S-/font/5b6u6L2v6ZuF6buR/fontsize/1200/fill/IzAwMDAwMA==/dissolve/6/gravity/Center/dx/10/dy/10|imageslim)
- Course Auto-enrollment:允许管理员访问课程页面时不需注册课程。
- Bypass Course limits:允许管理员以任意顺序访问课程内容,绕过所有进度及访问限制。
- Include in Reports:在数据分析报告中包含管理员的使用资料。
Custom Labels 标签设定
接着我们切换到Setting页签 >Custom Labels区块,这里可以设定后台的全部标签。
没有一定要输入什么,依照站长习惯填入标签,或是使用默认设置也可以:)
如果在变更之后,想切换回预设的英文标签,设定为空白后储存即可。
![wlms-81-1](https://img.itaoda.cn/wp-content/uploads/2023/05/wlms-81-1.png?imageMogr2/auto-orient/format/webp/blur/1x0/quality/60|watermark/2/text/5rqQ56CB56S-/font/5b6u6L2v6ZuF6buR/fontsize/1200/fill/IzAwMDAwMA==/dissolve/6/gravity/Center/dx/10/dy/10|imageslim)
小提醒:此区块是更改后台的标签字,如果前台有英文字需要进行翻译、调整,可参考 Loco Translate 插件教程 来进行前台字符串调整~
因为后面的几项设定区块,的站长不太会使用到,也不会影响到线上课程网站的搭建,我就不一一介绍了。
若在其他设定区块有使用上的疑问,欢迎留言询问唷:)
恭喜大家完成了第一步的全站设定,我们一起前进下一章节!
课程面板完整设定
这个章节,我会教大家认识课程面板的相关使用设定,并带领大家新增一门完整的课程。
这些功能介绍会包含:课程总览、课程章节、单堂小课程、作业上传、测验等 .. 重要功能,所以大家要好好学习这一章节!
准备好的话,我们就马上开始吧~
课程总览(Course)
第一步,我们要先来新增课程总览,也就是课程总简介的部分。
课程总览新增
我们先到 LearnDash LMS > Courses > 选择「 Add New 」新增一个课程总览(培训班)。
![wlms-01-1](https://img.itaoda.cn/wp-content/uploads/2023/05/wlms-01-1.png?imageMogr2/auto-orient/format/webp/blur/1x0/quality/60|watermark/2/text/5rqQ56CB56S-/font/5b6u6L2v6ZuF6buR/fontsize/1200/fill/IzAwMDAwMA==/dissolve/6/gravity/Center/dx/10/dy/10|imageslim)
进入编辑页面,填入课程主标题、课程内容大纲。
这边还需调整:永久链接的网址代称(需设置英文或数字,否则前台网站会无法正常显示)、课程分类、课程标签。
![wlms-19-1 LearnDash 输入课程简介、修改永久链接等 .. 设定](https://img.itaoda.cn/wp-content/uploads/2023/05/wlms-19-1.png?imageMogr2/auto-orient/format/webp/blur/1x0/quality/60|watermark/2/text/5rqQ56CB56S-/font/5b6u6L2v6ZuF6buR/fontsize/1200/fill/IzAwMDAwMA==/dissolve/6/gravity/Center/dx/10/dy/10|imageslim)
接着设定精选图片,因为精选图片之后会呈现在前台课程列表上,所以尺寸以及设计很重要唷。
全部变更完成,可先按“ 发布 ”或是“ 更新 ”存储课程总览设定。
![wlms-20png-1](https://img.itaoda.cn/wp-content/uploads/2023/05/wlms-20png-1.png?imageMogr2/auto-orient/format/webp/blur/1x0/quality/60|watermark/2/text/5rqQ56CB56S-/font/5b6u6L2v6ZuF6buR/fontsize/1200/fill/IzAwMDAwMA==/dissolve/6/gravity/Center/dx/10/dy/10|imageslim)
我们前往课程总览的网址检查前台网站,发现成功新增第一门大课程啰:)
![wlms-24-1](https://img.itaoda.cn/wp-content/uploads/2023/05/wlms-24-1.png?imageMogr2/auto-orient/format/webp/blur/1x0/quality/60|watermark/2/text/5rqQ56CB56S-/font/5b6u6L2v6ZuF6buR/fontsize/1200/fill/IzAwMDAwMA==/dissolve/6/gravity/Center/dx/10/dy/10|imageslim)
太好了~我们距离课程网站的建置成功迈出第一大步,那我们先回到后台,继续相关设定吧!
课程总览设定
切换到“ Settings ”面板,这边我们可以为这堂课程设置:内容显示权限、付款设置、课程先决条件等 .. 。
先看第一个区块: Display and Content Options 。 这个区块可以设定课程教材说明、显示权限,如下图所示:
![wlms-26-1](https://img.itaoda.cn/wp-content/uploads/2023/05/wlms-26-1.png?imageMogr2/auto-orient/format/webp/blur/1x0/quality/60|watermark/2/text/5rqQ56CB56S-/font/5b6u6L2v6ZuF6buR/fontsize/1200/fill/IzAwMDAwMA==/dissolve/6/gravity/Center/dx/10/dy/10|imageslim)
- Course Materials:课程教材,可选择是否显示课程所需材料供学员参考。
- Course Certificate:证书,设定完成该门课程学员可获得的证书。
- Course Content:阅览该门课程的权限,是否对外开放/只限注册会员预览。
- Custom Pagination:在底页显示的章节+单堂课程数量,若无特别需求维持预设即可。
若是有配置课程教材 / 其余数据,会在前台网站新增一个“ Materials ”切换按钮,可查看该课程需要准备的物品:)
![wlms-30-1](https://img.itaoda.cn/wp-content/uploads/2023/05/wlms-30-1.png?imageMogr2/auto-orient/format/webp/blur/1x0/quality/60|watermark/2/text/5rqQ56CB56S-/font/5b6u6L2v6ZuF6buR/fontsize/1200/fill/IzAwMDAwMA==/dissolve/6/gravity/Center/dx/10/dy/10|imageslim)
我们回到 Course 设置,往下看第二个区块:「 Course Access Settings 。
这里可操作访问者 / 会员对课程的访问相关权限等 .. 设定。
![wlms-27-1](https://img.itaoda.cn/wp-content/uploads/2023/05/wlms-27-1.png?imageMogr2/auto-orient/format/webp/blur/1x0/quality/60|watermark/2/text/5rqQ56CB56S-/font/5b6u6L2v6ZuF6buR/fontsize/1200/fill/IzAwMDAwMA==/dissolve/6/gravity/Center/dx/10/dy/10|imageslim)
- Access Mode:可设定访问这门课程的权限,新增付款方式(后续章节会有详细教程)。
- Course Prerequisites:开启访问这门课程必须先学习某些课程的功能。
- Any Selected:学习任一门被选择课程,即可学习此门课。
- All Selected:学习所有被选中课程,才可学习此门课。
- Courses to Complete:选择必须先学习的课程。
访问课程权限关乎到付款设置,会在后面的章节进行详细说明,这边我们先跳过不谈。
往下的选项是课程先决条件,开启过后可设定学习此堂课程的必要条件,也就是学员必须先学习某些课程,才可开始学习此堂课。
以烘焙教室来举例,可能有站长希望学生在学习蛋糕食谱之前,必须先学会揉面团、打发奶油课程,那便可以在这里设定先决课程。
接着往下可以设置:课程积分、课程访问期限,如下图。
![wlms-28-1](https://img.itaoda.cn/wp-content/uploads/2023/05/wlms-28-1.png?imageMogr2/auto-orient/format/webp/blur/1x0/quality/60|watermark/2/text/5rqQ56CB56S-/font/5b6u6L2v6ZuF6buR/fontsize/1200/fill/IzAwMDAwMA==/dissolve/6/gravity/Center/dx/10/dy/10|imageslim)
课程积分可以当奖励学生学习的额外项目,是否设置可依照站长的需求。
付费 / 注册后几天删除课程访问权限,可以结合多种课程促销方案,例如:免费试用、期间限定课程等 .. 销售方式,让站长自由发挥:)
接着我们往下看到:「Course Navigation Settings 」区块,这里可设定该堂课程的学习形式,分为:自由、线性两种模式。
「自由」模式可让学员自由选择学习课程的顺序,而「线性」模式则是必须照着章节顺序学习。
![wlms-29-1](https://img.itaoda.cn/wp-content/uploads/2023/05/wlms-29-1.png?imageMogr2/auto-orient/format/webp/blur/1x0/quality/60|watermark/2/text/5rqQ56CB56S-/font/5b6u6L2v6ZuF6buR/fontsize/1200/fill/IzAwMDAwMA==/dissolve/6/gravity/Center/dx/10/dy/10|imageslim)
以上就是课程总览(Course)的全面设定,完成设定后,我们选择更新保存,继续进行下一步骤!
主课程 / 课程章节(Lesson)
建立+设定好课程总览后,我们的下一步就是建立+设定主课程,也就是课程章节的部分。
课程章节新增
我们一样在 Course > 切换「 Builder 」 面板 > “ New Lesson ” 按钮 > 输入主课程(课程章节)名称 > 按下“ Add Lesson 。
成功新增一个附属于课程总览下的课程章节。
![wlms-21-1](https://img.itaoda.cn/wp-content/uploads/2023/05/wlms-21-1.png?imageMogr2/auto-orient/format/webp/blur/1x0/quality/60|watermark/2/text/5rqQ56CB56S-/font/5b6u6L2v6ZuF6buR/fontsize/1200/fill/IzAwMDAwMA==/dissolve/6/gravity/Center/dx/10/dy/10|imageslim)
记得每次添加章节过后,都要按下更新保存设置唷。
接着,我们示范如何填写课程章节的内容~
按下课程章节旁边的「 Edit 」。
![wlms-22-1](https://img.itaoda.cn/wp-content/uploads/2023/05/wlms-22-1.png?imageMogr2/auto-orient/format/webp/blur/1x0/quality/60|watermark/2/text/5rqQ56CB56S-/font/5b6u6L2v6ZuF6buR/fontsize/1200/fill/IzAwMDAwMA==/dissolve/6/gravity/Center/dx/10/dy/10|imageslim)
我们会跳转到此项课程章节的编辑页面,输入课程章节介绍,设定永久链接(不设定永久链接会无法链接至课程章节页面)。
同样也可设定标签+分类(不一定要设定,各站长可自行决定)。
![wlms-23-1](https://img.itaoda.cn/wp-content/uploads/2023/05/wlms-23-1.png?imageMogr2/auto-orient/format/webp/blur/1x0/quality/60|watermark/2/text/5rqQ56CB56S-/font/5b6u6L2v6ZuF6buR/fontsize/1200/fill/IzAwMDAwMA==/dissolve/6/gravity/Center/dx/10/dy/10|imageslim)
记得要按下更新保存刚刚填写的课程章节内容。
成功新增~我们可以到前台查看刚刚新增的课程章节。
![wlms-33-1](https://img.itaoda.cn/wp-content/uploads/2023/05/wlms-33-1.png?imageMogr2/auto-orient/format/webp/blur/1x0/quality/60|watermark/2/text/5rqQ56CB56S-/font/5b6u6L2v6ZuF6buR/fontsize/1200/fill/IzAwMDAwMA==/dissolve/6/gravity/Center/dx/10/dy/10|imageslim)
可以看到“ 01. 马卡龙烘焙方法 课程章节,附属于如何制作马卡龙课程总览之下,还出现有标记学习完成的按钮 Mark Complete 。
当学生学习完整个章节,按下完成按钮,总进度便会前进一格。
在成功新增第一个课程章节后,我们马上来学习如何设定课程章节吧!
课程章节设定
回到 Lesson 页面 > 切换到「Settings 」面板,我们可以对该课程章节进行细节设定。
第一个区块,同样是Display and Content Options ,也就是内容及显示设定,不过课程章节与课程总览的设定项目是不同的唷~
详细如下图说明:
![wlms-31-1](https://img.itaoda.cn/wp-content/uploads/2023/05/wlms-31-1.png?imageMogr2/auto-orient/format/webp/blur/1x0/quality/60|watermark/2/text/5rqQ56CB56S-/font/5b6u6L2v6ZuF6buR/fontsize/1200/fill/IzAwMDAwMA==/dissolve/6/gravity/Center/dx/10/dy/10|imageslim)
教材部分,与课程总览( Course )一样,可新增该章节所需要教材 / 资料。
视频部分,我们可以使用网址、上传 iFrame 、短代码等 .. 形式,将影片嵌入至章节,设定完成章节及附属单堂课程之前或之后必须阅览影片,以及各种播放设定。
往下的设定还有:作业上传、课程计时器功能。
![wlms-32-1](https://img.itaoda.cn/wp-content/uploads/2023/05/wlms-32-1.png?imageMogr2/auto-orient/format/webp/blur/1x0/quality/60|watermark/2/text/5rqQ56CB56S-/font/5b6u6L2v6ZuF6buR/fontsize/1200/fill/IzAwMDAwMA==/dissolve/6/gravity/Center/dx/10/dy/10|imageslim)
作业上传功能开启后,学员可以在课程章节处上传作业,在设定里可调整:文档格式及大小、积分奖励、自动 / 手动批改,作业上传次数、学生可否删除作业等 .. 设定。
课程计时器是限定学生在一定时间内,不能按下完成按钮,将该章节标记为学习完成。
小备注:影片、作业、时间限制这三个功能,每个课程章节只能选择一项设定唷!
最后一个区块「Lesson Access Settings 」,可调整:课程章节附属、访问者阅览权限、发布日期。
![wlms-34-1](https://img.itaoda.cn/wp-content/uploads/2023/05/wlms-34-1.png?imageMogr2/auto-orient/format/webp/blur/1x0/quality/60|watermark/2/text/5rqQ56CB56S-/font/5b6u6L2v6ZuF6buR/fontsize/1200/fill/IzAwMDAwMA==/dissolve/6/gravity/Center/dx/10/dy/10|imageslim)
- Associated Course:指定该课程章节附属于某项课程总览下。
- Sample Lesson:范例课程。 即使课程设定付费,也可让未付费的用户学习,作为参考。
- Lesson Release Schedule:课程章节发布日期,可设定三个时间点:立即发布、会员注册几天后发布、指定日期统一发布。
这些设定可以配合销售方案,来进行更细节的操作唷; )
全部设定完成,记得点击更新保存课程章节内容设定。
接着我们回到Course>找到现在正在设定的课程总览> Builder,来新增附属在课程章节(Lesson)下的单堂小课程(Topic)。
单堂小课程(Topic)
回到 Builder ,开始新增+设定课程章节里的单堂小课程吧!
单堂小课程新增
我们找到想新增单堂小课程的课程章节 > 选择下箭头打开 > 按下 New Topic 」> 输入小课程名称 > 「 Add Topic 」新增。
![wlms-35-1](https://img.itaoda.cn/wp-content/uploads/2023/05/wlms-35-1.png?imageMogr2/auto-orient/format/webp/blur/1x0/quality/60|watermark/2/text/5rqQ56CB56S-/font/5b6u6L2v6ZuF6buR/fontsize/1200/fill/IzAwMDAwMA==/dissolve/6/gravity/Center/dx/10/dy/10|imageslim)
我们可以持续加入单堂小课程,这边我依序新增了两堂小课程。
![wlms-36-1](https://img.itaoda.cn/wp-content/uploads/2023/05/wlms-36-1.png?imageMogr2/auto-orient/format/webp/blur/1x0/quality/60|watermark/2/text/5rqQ56CB56S-/font/5b6u6L2v6ZuF6buR/fontsize/1200/fill/IzAwMDAwMA==/dissolve/6/gravity/Center/dx/10/dy/10|imageslim)
接着我们可移动到想编辑内容的小课程上,选择「 Edit 」进行内容变更。
![wlms-37-1](https://img.itaoda.cn/wp-content/uploads/2023/05/wlms-37-1.png?imageMogr2/auto-orient/format/webp/blur/1x0/quality/60|watermark/2/text/5rqQ56CB56S-/font/5b6u6L2v6ZuF6buR/fontsize/1200/fill/IzAwMDAwMA==/dissolve/6/gravity/Center/dx/10/dy/10|imageslim)
进入变更页面后,我们同样输入单堂课程内容,并且记得变更永久链接,都完成之后,记得要按更新储存。
课程分类、课程标签,同样新增与否站长自行决定即可:)
![wlms-38-1](https://img.itaoda.cn/wp-content/uploads/2023/05/wlms-38-1.png?imageMogr2/auto-orient/format/webp/blur/1x0/quality/60|watermark/2/text/5rqQ56CB56S-/font/5b6u6L2v6ZuF6buR/fontsize/1200/fill/IzAwMDAwMA==/dissolve/6/gravity/Center/dx/10/dy/10|imageslim)
其他的单堂小课程,也可以依照上面教程,将内容编辑填写完成。
单堂小课程设定
接着我们切换Settings面板,来查看单堂课程的设定。
单堂课程的设定与课程总览、课程章节基本上功能重复,大致如下图:
![wlms-39-1](https://img.itaoda.cn/wp-content/uploads/2023/05/wlms-39-1.png?imageMogr2/auto-orient/format/webp/blur/1x0/quality/60|watermark/2/text/5rqQ56CB56S-/font/5b6u6L2v6ZuF6buR/fontsize/1200/fill/IzAwMDAwMA==/dissolve/6/gravity/Center/dx/10/dy/10|imageslim)
因为相关功能与课程章节大致相同,我就不再赘述,站长们可以对照课程章节的设定功能去做相对应调整唷:)
设定完成,可以按更新保存,接着一一去设定其他单堂小课程。
测验(Quiz)
回到Course> Builder,我们一样使用 Builder 面板新增测验功能。
测验&题目新增
点开下箭头 >「New Quiz 」按钮 > 输入测验题目 >「 Add Quiz 」成功新增一项测验!
![wlms-41-1](https://img.itaoda.cn/wp-content/uploads/2023/05/wlms-41-1.png?imageMogr2/auto-orient/format/webp/blur/1x0/quality/60|watermark/2/text/5rqQ56CB56S-/font/5b6u6L2v6ZuF6buR/fontsize/1200/fill/IzAwMDAwMA==/dissolve/6/gravity/Center/dx/10/dy/10|imageslim)
新增测验后,我们可以随意拖动测验的位置,按住拖曳到「1-1 准备材料」小课程底下。
测验不一定要附属在小课程里,也可以在小课程之外,可依照自己使用习惯做调整。
![wlms-42-1](https://img.itaoda.cn/wp-content/uploads/2023/05/wlms-42-1.png?imageMogr2/auto-orient/format/webp/blur/1x0/quality/60|watermark/2/text/5rqQ56CB56S-/font/5b6u6L2v6ZuF6buR/fontsize/1200/fill/IzAwMDAwMA==/dissolve/6/gravity/Center/dx/10/dy/10|imageslim)
接着我们同样按下「Edit 」变更测验内容+新增题目,填写测验内容、修改永久配置,接着按下「更新」储存。
![wlms-43-1](https://img.itaoda.cn/wp-content/uploads/2023/05/wlms-43-1.png?imageMogr2/auto-orient/format/webp/blur/1x0/quality/60|watermark/2/text/5rqQ56CB56S-/font/5b6u6L2v6ZuF6buR/fontsize/1200/fill/IzAwMDAwMA==/dissolve/6/gravity/Center/dx/10/dy/10|imageslim)
新增一份空白的新测验后,我们还要为这份测验新增题目。
LearnDash 题目类型有许多种,大致分为:单选题、多选题、简答题、排序题等 .. 多达8种题目类型可让测验卷有多样化的变化。
在测验中新增题目:切换到「Builder 」面板 >「 New Question 」按钮 > 输入题目 > 「 Add Questuon 」新增。
![wlms-44-1](https://img.itaoda.cn/wp-content/uploads/2023/05/wlms-44-1.png?imageMogr2/auto-orient/format/webp/blur/1x0/quality/60|watermark/2/text/5rqQ56CB56S-/font/5b6u6L2v6ZuF6buR/fontsize/1200/fill/IzAwMDAwMA==/dissolve/6/gravity/Center/dx/10/dy/10|imageslim)
成功新增第一道题目后,我们就来设定题目的类型以及选项、答案吧!
新增题目后,选择下三角打开题目,找到Question旁边的蓝色铅笔输入题目,最右边的下拉菜单可以选择题目类型,以及答完题目可或得的积分。
答案的部分,按下 New answer 」可以新增答案,旁边的 Correct 可设置该题目的正确答案。
![wlms-45-1](https://img.itaoda.cn/wp-content/uploads/2023/05/wlms-45-1.png?imageMogr2/auto-orient/format/webp/blur/1x0/quality/60|watermark/2/text/5rqQ56CB56S-/font/5b6u6L2v6ZuF6buR/fontsize/1200/fill/IzAwMDAwMA==/dissolve/6/gravity/Center/dx/10/dy/10|imageslim)
都设定及储存完成后,我们可以继续新增题目,直到整份测验卷都完成:)
测验卷完成后,我们到前台查看测验卷吧!
![wlms-47-1](https://img.itaoda.cn/wp-content/uploads/2023/05/wlms-47-1.png?imageMogr2/auto-orient/format/webp/blur/1x0/quality/60|watermark/2/text/5rqQ56CB56S-/font/5b6u6L2v6ZuF6buR/fontsize/1200/fill/IzAwMDAwMA==/dissolve/6/gravity/Center/dx/10/dy/10|imageslim)
太好了,测验卷成功新增~
以上就是新增+设定一门完整的课程功能介绍,相信看完这个章节,你一定对如何新增多层课程得心应手啦:)
小备注:除了在课程总览(Course)的 Builder 建立课程章节、单堂小课程、测验外,也可以在 LearnDash 后台进入相对应的页面来调整这些物件唷~
课程页面风格化设计
默认的课程页面使用古腾堡页面编辑器,本身的页面编排就很精美。
不过,我们也可以使用别款页面编辑器,来更加美化课程页面。 更多 页面编辑器推荐列表 。
这边我以 Elementor 做一些简单示范:)
我们重复一样的步骤,新增课程总览(Course)页面,输入标题及内容,设定永久链接、新增精选图片等 .. 。
完成后我们选择“ 使用 Elementor ” 按钮进行编辑。
![wlms-74-1](https://img.itaoda.cn/wp-content/uploads/2023/05/wlms-74-1.png?imageMogr2/auto-orient/format/webp/blur/1x0/quality/60|watermark/2/text/5rqQ56CB56S-/font/5b6u6L2v6ZuF6buR/fontsize/1200/fill/IzAwMDAwMA==/dissolve/6/gravity/Center/dx/10/dy/10|imageslim)
进入 Elementor 以后,我们可以依照喜好添加多种字段、元素设计,让课程页面变得更丰富精美:)
![wlms-75-1](https://img.itaoda.cn/wp-content/uploads/2023/05/wlms-75-1.png?imageMogr2/auto-orient/format/webp/blur/1x0/quality/60|watermark/2/text/5rqQ56CB56S-/font/5b6u6L2v6ZuF6buR/fontsize/1200/fill/IzAwMDAwMA==/dissolve/6/gravity/Center/dx/10/dy/10|imageslim)
如何使用 Elementor 进行更精致的页面设计,可以参考教程文章:Elementor 全面中文指南 。
首页课程列表上线
逐步建立好课程,相信你一定会很好奇,我们该如何显示课程列表在前台网站供访问者/ 学员预览呢?
就跟商品陈列一样,我们需要制作一个陈列课程的页面。
我们可以安装 LearnDash 附件,并且使用 Elementor 在页面上新增课程列表短代码,来完成精美的课程列表页面:)
Setp 1:安装 LearnDash Course Grid 附件
第一步,我们先安装 LearnDash 提供的附件:LearnDash Course Grid 。
LearnDash > Adds-on > 找到 LearnDash Course Grid > 选择“ Install Now ”,安装+启用 LearnDash Course Grid 。
![wlms-48-1](https://img.itaoda.cn/wp-content/uploads/2023/05/wlms-48-1.png?imageMogr2/auto-orient/format/webp/blur/1x0/quality/60|watermark/2/text/5rqQ56CB56S-/font/5b6u6L2v6ZuF6buR/fontsize/1200/fill/IzAwMDAwMA==/dissolve/6/gravity/Center/dx/10/dy/10|imageslim)
完成安装+启用后,我们可以到现在使用模板的首页检查,发现课程列表变成精致的网格排版啰:)
![wlms-49-1](https://img.itaoda.cn/wp-content/uploads/2023/05/wlms-49-1.png?imageMogr2/auto-orient/format/webp/blur/1x0/quality/60|watermark/2/text/5rqQ56CB56S-/font/5b6u6L2v6ZuF6buR/fontsize/1200/fill/IzAwMDAwMA==/dissolve/6/gravity/Center/dx/10/dy/10|imageslim)
如果不是使用同组模板的站长不用担心,下一个步骤,我会教大家使用短代码 / 小工具,将课程列表新增至页面。
你可以将课程的网格列表依据喜好,放置在页面上任意位置。
Setp 2:添加短代码 / 小工具至页面
到 WordPress 后台 > 页面 > 添加页面 ,我们输入标题为课程列表。
接着打开区块小工具,在LearnDash LMS Blocks列表中,找到「 LearnDash Course List 」小工具,拖曳进去页面。
![wlms-50-1](https://img.itaoda.cn/wp-content/uploads/2023/05/wlms-50-1.png?imageMogr2/auto-orient/format/webp/blur/1x0/quality/60|watermark/2/text/5rqQ56CB56S-/font/5b6u6L2v6ZuF6buR/fontsize/1200/fill/IzAwMDAwMA==/dissolve/6/gravity/Center/dx/10/dy/10|imageslim)
别忘记新增完还要修改永久链接,接着就可以储存+发布页面啰!
我们到前台检查,发现已经新增了一个精美的课程列表页面:)
![wlms-51-1](https://img.itaoda.cn/wp-content/uploads/2023/05/wlms-51-1.png?imageMogr2/auto-orient/format/webp/blur/1x0/quality/60|watermark/2/text/5rqQ56CB56S-/font/5b6u6L2v6ZuF6buR/fontsize/1200/fill/IzAwMDAwMA==/dissolve/6/gravity/Center/dx/10/dy/10|imageslim)
除了使用「LearnDash Course List」区块小工具以外,我们还可以使用短代码:。 [ld_course_list col=3 order="asc"]
这组代码可以应用在 Elementor 等相关的页面编辑器,在各个不同页面里嵌入课程列表。 更多 Elementor Pro 自定义程序代码功能 。
Step 3:课程网格设计
我们可以修改网格中的课程介绍文字、标签字、报名按钮文字,让课程列表更符合中文用户的使用习惯。
首先,到LearnDash>Course>Settings面板,滑到最下面,会发现多了一个Course Grid Settings区域。
在这个区域,我们可以填入:介绍文字、标签文字、按钮文字。 都填写完毕,按更新保存。
![wlms-52-1](https://img.itaoda.cn/wp-content/uploads/2023/05/wlms-52-1.png?imageMogr2/auto-orient/format/webp/blur/1x0/quality/60|watermark/2/text/5rqQ56CB56S-/font/5b6u6L2v6ZuF6buR/fontsize/1200/fill/IzAwMDAwMA==/dissolve/6/gravity/Center/dx/10/dy/10|imageslim)
我们可以到前台检查,发现网格列表文字修改成功,右边则是未修改过的网格课程; )
![wlms-53-1](https://img.itaoda.cn/wp-content/uploads/2023/05/wlms-53-1.png?imageMogr2/auto-orient/format/webp/blur/1x0/quality/60|watermark/2/text/5rqQ56CB56S-/font/5b6u6L2v6ZuF6buR/fontsize/1200/fill/IzAwMDAwMA==/dissolve/6/gravity/Center/dx/10/dy/10|imageslim)
小备注:除了 LearnDash Course List ,还有其他好用的 LearnDash 附件或第三方插件,可以在 LearnDash 的 Adds-on 列表里找到更多~
原文链接:https://www.itaoda.cn/blog/11779.html,转载请注明出处。
评论0