Editing Course Hero Images in onCourse

You can use images you have uploaded into onCourse as hero images for a specific course. To do so, you first need to add a snippet of code to your site’s CourseItem.tml file.

ℹ️

The CourseItem.tml file can be found in WebDAV by going to templates → default → CourseItem.tml.

This snippet is pasted below:

HTML

<div class="hero-image-banner">
	<div t:type="ui/image" name="${courseItemModel.course.code}_hero" class="course-img" width="275" height="183"></div>
</div>

Open the CourseItem.tml in a text editing tool, like NotePad++ or Sublime, then copy and paste this code into the file somewhere out of the way. Ensure that you set the name of the uploaded hero image in onCourse to x_hero, where 'x' is the course code of the course the image is intended for - e.g. for a Pottery course with the course code POT001, in onCourse you’d want to name the image POT001_hero.

You can edit the height and width values, but be aware that this may result in inconsistent results if the images you upload are all different szes to begin with.