New to the community? Start here

Better design for listing the courses

Hello,

I'm curious how I could improve the design of the course listings on http://noduslabs.com/courses/ so they look something like that (take from your competitor Clever Course)

Let me know if you have any CSS code or a feature that would allow me to display my courses like this, instead of just the list of the articles.

[attachments are only viewable by logged-in members]

Fri, 15 Jan 2016 10:27:52
  • Adam Czajczyk
    • Support Gorilla

    Hello Dmitry,

    I hope you’re well today and thank you for your question!

    If you theme supports such an option, you could just set a “grid”/”multi-column” layout for archive pages. This is usually done via theme settings page or “Customize” in your dashboard. That’s by far the simplest way and many modern themes do support such option.

    Alternatively, this would require creation of custom templates for course pages. You could use included “CoursePress” themes templates as an example and then add some custom CSS to it.

    Last solution would be to go with custom CSS for your existing pages. In case of your site’s current theme, the base rule would be as follows:

    .post-type-archive-course .post-list li {display:inline-block;max-width:30%;clear:none;}

    This will make course “block” 1/3 of current content area width and display up to 3 course “blocks” in a row. You could then add some more rules to this in order to set colors, fonts etc.

    I hope that helps!

    Best regards,

    Adam