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