Shortcode for latest courses + images of the courses

Hi! On the home page I would like to put 3 or 4 of the most recent courses with their images, kind of like featured blog posts you see on some sites. How do I do this for Coursepress, is there a shortcode? Thank you!

  • Rupok
    • Support Ninja

    Hi Meredith, hope you had a wonderful day.

    Well, there is no shortcode for querying courses with parameters, but you can manually show courses with shortcodes.

    Go to your "Dashboard > CoursePress Pro > Settings > Shortcode [Tab]". There you will see all shortcodes listed. You will get shortcode for showing title, description, dates, pictures, media etc. according to course ID. Use those shortcodes for showing your desired content on any page you want.

    Please let us know if you have any confusion. We will be glad to help.

    Have a nice day. Cheers!
    Rupok

  • Meredith
    • The Bug Hunter

    Okay so I've got the courses & their images displaying on the homepage with the shortcode. Now is there a way to make them in columns like when you go to the My Courses page?

    The second picture is how it is now. The first picture is how I want it to look, and how it is on the My Courses page. Hope that makes sense, I know I'm not explaining myself very well.

  • Rupok
    • Support Ninja

    Hi Meredith, hope you had a wonderful day.

    Well, it seems like you are using Visual Composer. That's great actually, I could easily get column classes. However, you need to add "vc_col-sm-4" class with "course-list-item" class. The best way of doing this is using a MU Plugin. For creating a mu plugin, create a folder named "mu-plugins" inside your "wp-content" folder. Then inside that "mu-plugins" folder, create a file with any name and with a .php extension. Now paste the code inside that file and save.

    <?php
    add_action( 'wp_footer', 'multiple_column_course_list' );
    function multiple_column_course_list() {
        ?>
        <script type="text/javascript">
          jQuery(document).ready(function() {
            jQuery( ".course-list-item" ).addClass( "vc_col-sm-4" );
          });
        </script>
        <?php
    }

    For getting more idea on mu plugins, you can go through this article: http://premium.wpmudev.org/manuals/wpmu-manual-2/using-mu-plugins/

    Please let us know how it goes. It should work.

    Have a nice day. Cheers!
    Rupok

  • Meredith
    • The Bug Hunter

    Ahh, nifty! Thanks! :smiley:

    Just a few more things...

    - Can we display them in order of newest first?

    - Can I get the enroll buttons to look like how it does in the screenshot, more centered and some padding?

    - Can we make the course titles a smaller heading tag, instead of an h1?

    Thank you!!

  • Rupok
    • Support Ninja

    Hi Meredith, hope you had a wonderful day.

    Can we display them in order of newest first?

    I'm afraid, you can only sort them by Course Title with currently available options. [course_list] parameter has "order" parameter which sorts courses by Title. You can see this in shortcode description. Please check the attached screenshot for reference.

    Can I get the enroll buttons to look like how it does in the screenshot, more centered and some padding?

    You can use the following custom CSS to achieve this:

    button.apply-button, a.apply-button, input.apply-button[type=&quot;submit&quot;], input.apply-button[type=&quot;button&quot;] {
      float: left !important;
      margin-top: 30px;
      width: 250px;
    }

    Can we make the course titles a smaller heading tag, instead of an h1?

    You can use the following custom CSS to achieve this:

    .course-title {
      font-size: 20px !important;
    }

    You can add this to theme's stylesheet, in a child theme, or using a plugin like My Custom CSS.

    Please let us know if you have any further inquiry. We will be glad to help.

    Have a nice day. Cheers!
    Rupok

  • Rupok
    • Support Ninja

    Hi Meredith, hope you had a wonderful day.

    Can you try from another browser or try clearing your browser cache and cookies? I could check that code again and fix it if I could see your site. I tried to login with Support Access but seems like it expired. Can you grant us permission again so I can check and try to fix if any error is there in the code?

    I'm looking forward to hear from you and resolve this issue as soon as possible.

    Have a nice day. Cheers!
    Rupok

  • Kasia Swiderska
    • Support nomad

    Hello Meredith,

    I've adjusted styles a little bit on your site and this is effect:

    is it OK? I've added this code to Simple CSS:

    span.apply-button.apply-button-finished {padding: 0 !important; text-align: center !important;}

    Let me know if you still need any further assistance here.

    kind regards,
    Kasia

  • Meredith
    • The Bug Hunter

    Well it seems to be doing what it should do when I delete the courses and publish them in order I want them to be displayed by. Glad it sorted itself out :slight_smile:

    I do have another question about this though which is is there a way to make the pictures more even on the home page when the titles are different lengths?

    Thanks!!!

  • Rupok
    • Support Ninja

    Hi Meredith, hope you had a wonderful day.

    You can set some pre-defined height for course title in that case with following custom CSS Code:

    .course-list-item .course-title {
      height: 130px;
    }

    You can add this to a theme's stylesheet, in a child theme, or using a plugin like My Custom CSS.

    Please let us know your feedback. We will be glad to assist further if required.

    Have a nice day. Cheers!
    Rupok

Thank NAME, for their help.

Let NAME know exactly why they deserved these points.

Gift a custom amount of points.