本文概述了在构建课程活动时如何设置图像格式,包括现有功能、最佳实践和相关提示。
- 了解有关构建课程时的最大图像尺寸的更多信息。
平台中有关设置图像格式的功能
目前,平台在将图像上传到活动 Build(构建)页面的 Description(描述)部分时提供了两组选项——Alignment(对齐方式)和 Size(尺寸)。了解有关如何构建活动的更多信息。
- Alignment(对齐方式):目前可以使用左对齐和右对齐这两种对齐方式。选择后,您的图像将自动与课程播放器的左侧或右侧对齐,并且系统会设置图像周围的文本的格式。如果您希望居中对齐图像,请按照下面部分中的说明操作。
- Size(尺寸):提供 Large(大)(页面宽度的 100%,或 1080px)、Medium(中)(页面宽度的 50%,或 540px)和 Small(小)(页面宽度的 25%,或 270px)三个选项。如果您的图像比您选择的选项宽,它将重新格式处理为所选的尺寸,这可能会影响可见性,并导致图像模糊或粗糙。
将图像上传到课程活动时的提示
- 系统构建活动时使用两个浏览器选项卡,一个用于 Build(构建)页面,另一个供学习者查看课程活动。这将使您能够经常以学习者的视角查看活动在课程播放器中呈现的样子并做出相应更新。
- 请记住,学习者会使用不同的设备和不同的屏幕尺寸来观看课程。因此您的屏幕上的格式可能不是每个学习者都能体验到的。
- 虽然不是最佳做法,但根据所需的格式美学,您可以根据需要多次在 Description(描述)部分的文本周围按 Enter 键,确保文本不会环绕在图像周围。如果您的图像尺寸较小,并且采用左对齐或右对齐的对齐方式,那么文本将被自动放置在图像的左侧或右侧。如果您想将文本移动到图像下方,这是可以实现的,但请记住,其他设备上的学习者在观看活动时可能会有不同的式样感官需求。
如何居中对齐图像
1. 在课程活动的 Description(描述)部分中上传您的图像。
2. 上传后,点击 Description(描述)部分顶部的 Source Code(源代码)图标。
4. 紧接在此代码之前,即在“<img class”的左侧,输入“<center>”(不包括双引号)。紧接在此代码之后,即在“/>”的右侧,输入 </center>。它看起来将如下所示:
<center><img src="imagename.png or imagename.jpg, etc" alt="None" width="540" height="479" /></center>
5. 查看代码的对齐方式部分,即“image-left”(图像左对齐)或“image-right”(图像右对齐)。将对齐方式更改为“image-center”(图像居中对齐)。代码现在看起来应该如下所示:
<center><img src="imagename.png or imagename.jpg, etc" alt="None" width="540" height="479" /></center>
6. 点击 OK(确定)。 图像应该已经移动到 Description(描述)部分的中心位置。点击活动 Build(构建)页面底部的 Update(更新)。
7. 使用另一个浏览器窗口以学习者的视角来查看活动,并确保图像正确显示。