My courses page layouts

My Courses page can be displayed in different layout styles, allowing you to choose the look and structure that best match your brand and learning experience. Any layout you select will automatically adapt to your content and store branding.

Below is a brief overview of each available design, along with demo links.

Design #1 — classic course list

Straightforward vertical list with clear titles and actions. Best for simplicity and readability.

Demo: https://courses-design-1.myshopify.com/apps/my/courses/list

Design #2 — cards with progress

Card layout that highlights progress and “continue” actions, making it easy to resume learning.

Demo: https://courses-design-2.myshopify.com/apps/my/courses/list

Design #3 — compact grid

Tighter grid layout that shows more courses on one screen and reduces scrolling.

Demo: https://courses-design-3.myshopify.com/apps/my/courses/list

Design #4 — visual and image-focused

Large thumbnails with stronger visual emphasis — good when course covers matter.

Demo: https://courses-design-4.myshopify.com/apps/my/courses/list

Design #5 — minimalist

Clean layout with fewer elements, works great on mobile and small screens.

Demo: https://courses-design-5.myshopify.com/apps/my/courses/list

Design #6 — detailed cards

Larger cards with more structure, giving extra context without clutter.

Demo: https://courses-design-6.myshopify.com/apps/my/courses/list

Updated on: 31/12/2025