Design packages · Dash
No course image? No problem.
Set a default image per course category. Every course without its own image shows its category image instead, and your catalog looks consistent. Fallback included.
- 2 free sets
- Fallback image included
- Requires Dash Plus
One gap, fixed for good
Course catalog in a Dash grid
Courses without images
Some courses have images, some don’t. The catalog looks unfinished.
With category images
Every course gets its category’s image. One upload per category.
2 packages · all free
Explore our designs
Ready in minutes
How to use the packages
-
Install Dash Plus
Category images are a Dash Plus feature.
-
Download a package
Download a free set, including the fallback image.
-
Assign the images
Set up your course categories, then drag and drop the images onto them: Site administration › Blocks › Dash.
-
Show them in Dash
Use the courses data source, e.g. in a grid, and map the image to “background image” or “Image URL field”.
Design guide
Create your own category images
JPG, PNG or GIF. Our images are 500 × 345 px; adjust to your Dash setup.
What makes category images work
Leave room around the motif
Depending on viewport and block settings, parts of the image are cropped. Keep icons centered with space around them.
Always design a fallback
For courses in categories without an image.
Animate sparingly
Lively GIFs overwhelm a grid. Animate one category at most to highlight it.
Cropped? Increase the height
If images are cut off in a viewport, increase their pixel height. For more control, add your own class in the theme’s raw SCSS and enter it under “CSS classes” in the Dash block settings.
Want to match your brand colors?
Our category icons are SVG files you can recolor.