Skip to main content

Catalog & Course Image Tips

The Course and Catalog Cards in the Tortal LMS rely on "Background image" styling code. So creating the perfect fit for your cover images may require a bit of adjustment to make them really pop.

What is "Background Image" Styling?

Basically, it's in the code.  To allow for the Catalog and Course cards to present in a neat and order grid, the "Background Image" effect, forces your images to line the up with its vertical and horizontal center.  
Tortal best supports images in Landscape orientation. 


 Users will see only what's in the center of the Image. 
 

How to create the perfect cover images for your Tortal Course and Catalogs. 

Cropped the image
  • 180px wide
  • 4:3 or 16:9 ratio. 
  • Center your content, and leave room at the edges. 
Free online tool -
 
Reduced the Image Size
  • Images must be below 100KB

Free Online Tool

Image Compressor - Compress Images Online in High Quality (imageresizer.com)

 

This allowed for the effect you see in the Catalog.

How to set a Catalog or Course image? 

Using the Edit a Catalog Tool or the Edit a Course Tool you can set your Cover images. 

Untitled-4.jpg

1. To upload your own image, click the blue "Upload Image" button and follow the process. Please see "Image Best Practices" section further down in this article for essential information on this process.

2. If you would like to use an image from our stock library, use the scroll bar to browse and select your desired image. Click the image you want to use.

3. When editing a catalog image, simply click the save button to save your selected image. When editing a course image, click the next button and follow through the process until you see the finish button. Click the finish to confirm your image change. 

 

Related articles