Overview
The Enhanced Course Grid displays your courses in a clean, customizable grid — with featured images, optional descriptions, progress bars, prices, and Start/Resume buttons. It’s built primarily for signed-in learners who want to see what they’re enrolled in and what’s available next.
By default the grid renders four columns with expandable rows and orders courses in a sensible learner-first sequence: enrolled courses (sorted by completion percentage) first, then non-enrolled courses, then anything tagged “coming soon.”
What the grid can show:
- Featured images displayed at equal sizes
- Optional short descriptions beneath course names (HTML is supported in the Short Description field)
- Progress bars for enrolled learners
- A Start or Resume button per course
- A price or price banner in the upper-left corner
- “Coming Soon” status, driven by a standard WordPress tag (not a LearnDash tag)
Common uses include a member dashboard of enrolled courses sorted by progress, a public catalog of available courses, and category-filtered grids for specific topics or programs.
Important: If you use HTML in the Short Description field, disable the LearnDash Course Grid plugin — it strips HTML out of that field.
Where to set the Short Description (Toolkit Pro v4.4.1+): The course Short Description field is on the course edit screen, under a dedicated Uncanny Toolkit tab in the LearnDash settings header. v4.4.1 added this tab so the field stays easy to find under WordPress 7.0’s block editor, which otherwise collapses classic metaboxes out of view.
Configure It
Add the grid with the Enhanced Course Grid block or the [uo_courses] shortcode, then shape it around these decisions:
- Which courses to include — Use
enrolled_only="yes"for a personal dashboard, ornot_enrolled="yes"for an “available courses” catalog. Filter by topic withcategory(WordPress) orld_category(LearnDash course category); both accept comma-separated slugs. When you pass multiple categories, taxonomy_relation decides whether a course must match AND (all) or OR (any, the default). - Whether to give learners a filter dropdown — Turn on
categoryselector(WordPress) orcourse_categoryselector(LearnDash). Empty categories are hidden automatically. - Layout — Set
cols(1–5; default 4). Use limit to control how many courses appear before the View More button (all shows everything and removes the button). Hide that button withhide_view_more, or point it at a full catalog page withmore="URL". - What to show on each card — Toggle
show_image,price,hide_description,hide_progress,hide_credits,hide_title, andlink_to_course. We recommendhide_progress="yes"on sites with many courses for better performance. - Action buttons — Set
start_course_button="show"to show a Start button for enrolled learners at 0% progress, andresume_course_button="show"to show a Resume button for learners with progress (this requires the Resume module enabled). - Sort order — The default uses
default_sortingby status (course-progress,enrolled,not-enrolled,coming-soon,completed). To sort alphabetically or by date instead, setorderby(title,date,menu_order) plusorder(asc/desc) and addignore_default_sorting="yes"so your order takes precedence. - Colors and labels — Restyle with
border_hover,view_more_color,view_more_hover,view_more_text_color, and relabel buttons withview_more_text/view_less_text.
Important: default_sorting doubles as a filter. Any status you leave out of your custom default_sorting list is excluded from the grid entirely. For example, omitting not-enrolled hides non-enrolled courses.
Example
A learner dashboard showing only enrolled courses, no prices, sorted by progress then completion:
[uo_courses enrolled_only="yes" price="no" default_sorting="course-progress,enrolled,completed"]
Shortcode reference
[uo_courses]
| Attribute | What it does | Values | Default |
|---|---|---|---|
category | Show courses in one or more WordPress categories | all or slug(s), comma-separated | all |
ld_category | Show courses in one or more LearnDash course categories | all or slug(s), comma-separated | all |
categoryselector | Show a WordPress-category filter dropdown (empty categories hidden) | show, hide | hide |
course_categoryselector | Show a LearnDash-category filter dropdown (empty categories hidden) | show, hide | hide |
taxonomy_relation | Match ALL or ANY of the supplied categories | AND, OR | OR |
enrolled_only | Show only enrolled courses | yes, no | no |
not_enrolled | Show only non-enrolled courses | yes, no | no |
cols | Columns per row | 1–5 | 4 |
limit | Courses shown before the View More button (all removes it) | all or an integer | 4 |
hide_view_more | Hide the View More button | yes, no | no |
hide_description | Hide the course description | yes, no | no |
hide_progress | Hide the progress bar (improves performance) | yes, no | no |
hide_credits | Hide the assigned credit value | yes, no | no |
hide_title | Hide the course title | yes, no | no |
more | Send View More to a URL instead of expanding the list | A URL | (none) |
show_image | Show the featured image (min. recommended 624 × 468 px) | yes, no | yes |
price | Show the price / price banner in the upper left | yes, no | yes |
link_to_course | Link grid items to their course pages | yes, no | yes |
default_sorting | Sort by status; omitted statuses are excluded | course-progress,enrolled,not-enrolled,coming-soon,completed (any order) | course-progress,enrolled,not-enrolled,coming-soon,completed |
orderby | Course ordering method | title, date, menu_order | title |
order | Sort direction (based on orderby) | asc, desc | asc |
ignore_default_sorting | Let orderby take precedence over default_sorting | yes, no | no |
start_course_button | Show a Start button for enrolled learners at 0% | show, hide | hide |
resume_course_button | Show a Resume button for learners with progress (needs Resume module) | show, hide | hide |
| border_hover | Border color on grid-item hover | A color value | (none) |
| view_more_color | View More button fill color | A color value | (none) |
| view_more_hover | View More button fill color on hover | A color value | (none) |
| view_more_text_color | View More button text color | A color value | (none) |
| view_more_text | View More button label | Custom text | (none) |
| view_less_text | View Less button label | Custom text | (none) |
Customization
CSS: Copy /wp-content/plugins/uncanny-toolkit-pro/src/assets/legacy/frontend/css/course-grid-view.css to /wp-content/themes/your-theme/uncanny-toolkit-pro/css/course-grid-view.css and edit the copy.
Template override (v3.1+): Copy wp-content/plugins/uncanny-toolkit-pro/src/templates/course-grid.php to wp-content/themes/yourtheme/uncanny-toolkit/course-grid.php.
Developer filters for ribbon text:
- apply_filters( ‘uo_course_grid_ribbon_text’, $output, $course->ID )
- apply_filters( ‘uo_course_grid_ribbon_price’, $course_price, $course->ID )
Important: Don’t edit CSS or template files inside the plugin directly — they’re overwritten on upgrade. Always work from the theme override.
Note — other caveats:
- WooCommerce: The grid can’t integrate with WooCommerce unless you make significant changes to the WooCommerce store-page template.
- Featured images: WordPress crops images to a 1.33:1 ratio; upload at least 624 × 468 px.
- Closed courses: A course with no price listed displays as “Free,” which may be inaccurate.
- Resume button: Only appears for learners with progress recorded after plugin version 2.5 was installed.
Hello,
I apparently have a compatibility problem with woocommerce.
I used the shortcode [uo_courses] and everything works … until I ask woocommerce to use this page as a shop page. At this moment the presentation changes. Here are screenshots to better understand.
Before: https://drive.google.com/open?id=1uD8oaHcaGa06DEe2OQjl1sLYfo5x5VXE
After: https://drive.google.com/open?id=1Zemq-JEJ1K1a71FzREESXYjkPezJ3aT_
Thanks a lot for your help ! It makes me crazy !!
This cannot work unless you make significant changes to the WooCommerce template for the store page. When you set this page in WooCommerce settings, Woo will take it over and modify things about it. We cannot recommend using our shortcodes if you’re also using it as a Woo store page.
How can I disable the Catagories pull downmenu on the Course Grid page?
Sorry Frank, very briefly (for about 3 hours) there was a release that showed the drop-down selection by default. That shouldn’t have happened, and you can hide it by adding this attribute to your course grid shortcode: categoryselector=”hide”. If you’re still having issues make sure to send us a support ticket (we don’t monitor the Knowledge Base as much).
Hello, is this plug-in able to display only lessons and/or only topics in a grid too, like Learn Dash Course Grid?
Yes, it’s available in this module: https://www.uncannyowl.com/knowledge-base/enhanced-lessontopic-grid/
Hi, I love the layout. But is there any way to have the drop-down (courseselector) NOT show empty categories? We utilize categories across our page that have nothing to do with courses and the drop-down always shows all.
The LD “out of the box” dropdown does not show empty ones, so as long as no courses have a given category it wouldn’t show up… Any chance there is a way to do that with the UO courseselector??
Thanks!
Hi Helma, we’re going to hide empty categories from the dropdown in the next release. Thanks for your feedback!
Thanks Ken! And sorry for the duplication through a ticket – wasn’t sure if my comment here had come through. Looking forward to that next release 😉
I cannot figure out what I am doing wrong. I have the Enhanced Course Grid enabled in my plugins, but when I place the shortcode all I see is:
[uo_courses]
Any idea what I may be doing wrong? Other shortcodes (resume course, etc) seem to be working fine).
Hi Todd, if you’re sure the module is enabled, can you submit a support ticket through the portal so we can take a closer look? https://www.uncannyowl.com/my-account/submit-a-request/ That’s not an issue we’ve seen before. Thanks!
Hi Ken. Thank you for the followup.
I was able to figure out the issue. I use Elementor and one of their widgets is a “Shortcode” block. For whatever reason, the Uncanny Owl shortcodes work great if I place them on a page using Elementor’s “Text” block, but they seem to be more problematic when I use Elementor’s “Shortcode” block.
The Shortcode block seems to work fine for most other shortcodes, e.g., LearnDash, PDF Embedder, etc., but not as well for some of the UO ones. Now I just put them in a text block and they work great.
Hej,
the css file is not in the directory mentioned above: /wp-content/plugins/uncanny-toolkit-pro/src/assets/frontend/css/course-grid-view.css.
I believe you need to update the instructions!
Thanks
Bjorn
Thanks for letting us know! The instructions have been updated with the new location.
Hello,
How can I update the progression for all my student when I add a lesson or a topic to a course. So if the progression show 66% because the student see 2 on 3 lessons, and I add an other lesson for have 4 lesson, I want to show the progression at 50% and not at 66% ?
Thanks
I’m not sure that there is a way to fix progression when you change the course structure. If there is, we unfortunately haven’t seen it. LearnDash might have better guidance for this issue.
Hi,
you write that “when uploading a featured image, WordPress will automatically crop it to 1.33:1 aspect ratio. ”
This seems to be true for the course pages. But [uo_courses] on my site shows the original aspect ratios next to each other, which doesn’t look good,
Can this be fixed easily?
Hi Peter, please send us an email at [email protected] so we can look into this for you.
Hi,
The course grid is working great for us, so first of all thank you! I was just wondering if it’s possible to individually style different course grids on the same page? We’ve got a few grids, each with a different course category, and it would be great to have different background colours for each grid. Is there a way of assigning a CSS class or ID to each grid to differentiate between them?
Thanks!
You could try adding a
around the different grid shortcodes on your page, then targeting them using that class.
Hi,
I have a “follow-up” question around the drop-down (courseselector) field. Is there a way to NOT show the numbers of courses behind at all?
Reason I ask is that they pull all of the available courses, but since we are using a membership plugin, it is more confusing than helpful as I might see a (7) behind a category, but when I click on that category, I will only get 1 course that is available to me based on my membership level…
So not showing any number sounds better than showing a “confusing” number… Any chance something can be added to the shortcode to hide the “course count”?
Thanks!
Helma
Unfortunately there’s no way to hide the category count and we don’t plan to add that feature. You could modify the plugin file directly (line 422 of src/classes/show-all-courses.php), but that customization would get wiped out every time you upgrade and we couldn’t provide support for it.
Thanks for the reply, Ken! While certainly not ideal, this will work for us for now.. Appreciate it!
Helma
Love this module, it does exactly what I was looking for! Is there a preferred way to set the number of columns to only “2”? At the minimum of 3 columns, the course image is too small for our purposes (we only have one course). I could certainly set .uo-3-col to “width: 50%” and be done with it, but I don’t like the inconsistency (i.e., forcing “uo-3-col” to act as if it’s 2 columns) and would prefer a more elegant solution if there is one. Thanks!
Daniel
I’m afraid that right now our grid only supports 3 to 5 columns. You could potentially leave it at the default 4 columns and use this:
body .uo-4-col {
width:50%;
}
There is no way to do it via the shortcode though unless we add explicit support, and right now it’s unfortunately not in our roadmap.
After our latest website update the “Resume” button at the bottom of each column has disappeared. We have ensured that the “resume_course_button” flag is set to “show”. What else would you recommend doing to fix this issue?
Thanks!
You should definitely open a ticket. This conflict with the LearnDash update has been resolved but we probably won’t push an update until next week. If you open a ticket we can provide the fix in advance.