Integrating CoursePress Pro into Theme

Hello,

I am trying to integrate CoursePress Pro into X Theme and would really appreciate some help getting started.

I'm not a developer, but feel like I can probably pull this off with some guidance.

To start, I'd like some help on how to create the main Course details page that would appear on this URL: /courses/my-course/

What I can do is drop shortcodes into columns on a page and get them properly formatted with CSS.

What I need help with is how to create these Pages or .php templates so that each course is referenced when its link is clicked. Also, what is the overall process I need to follow to make custom templates for each of the different course pages including what do I need to adjust in settings?

Specifically, could someone explain how I would set up the courses/my-course page? Then I think I should be able to do the rest on my own.

Thanks,
Jesse

  • Predrag Dubajic

    Hey @Jesse,

    Hope you're doing well today :slight_smile:

    I am trying to integrate CoursePress Pro into X Theme and would really appreciate some help getting started.

    Can you please give me some more info on this part, are you looking to integrate coursepress within the theme so there is no need to install plugin, or you are simply trying to get the plugin work nicely with this theme?

    To start, I'd like some help on how to create the main Course details page that would appear on this URL: /courses/my-course/

    What I can do is drop shortcodes into columns on a page and get them properly formatted with CSS.

    What I need help with is how to create these Pages or .php templates so that each course is referenced when its link is clicked. Also, what is the overall process I need to follow to make custom templates for each of the different course pages including what do I need to adjust in settings?

    If I understand this part correctly you are looking to customize the look of course details page?
    You can go to CoursePress/includes/templates folder, and use templates from there to edit layout of your pages.

    For example you can modify single-course-before-details.php to change course details page.

    Please note that all changes made to plugin files will be overwritten with plugin update.

    Best regards,
    Predrag

  • Jesse

    Thanks @Predrag Dubajic.

    Can you please give me some more info on this part, are you looking to integrate coursepress within the theme so there is no need to install plugin, or you are simply trying to get the plugin work nicely with this theme?

    I am trying to get the plugin to work nicely with the theme. Basically, to achieve a similar layout as the CoursePress theme, without having to use the CoursePress theme.

    Some follow up questions:
    Does this all have to be done in the .php templates?
    How can I do this so that the changes will not be overwritten when the plugin or theme is updated. I currently have a Child Theme set up.
    Is there any way to use the templates from the CoursPress theme instead of the templates from the plugin without installing the theme?

    Thanks!
    Jesse

  • Jesse

    Just to stick to a specific example, for the /my-course page, what would I need to change to:
    1. Make it look like the same page in the CoursePress theme
    2. Make the changes in a manner that would not be overwritten with plugin/theme updates.

    Thanks,
    Jesse

    PS WPMUDev could also just make this really easy on everyone who has posted similar questions and just make the plugin templates match the CoursePress theme templates...

  • Predrag Dubajic

    Hi @Jesse,

    Thanks for the additional info.
    If you are only looking to make visual changes to the courses then there is no need to modify php files, you can use plugin like this one http://wordpress.org/plugins/my-custom-css/ to add custom CSS to your theme and all changes will still be there after the update.

    CoursePress uses default styling so users can more easily adopt it to the theme they are using.

    Since you are trying to get CoursePress theme look you can use CSS from CoursePress theme style.css file and take the parts you need to accomplish this look.
    This file is located in coursepress/themes/coursepress/ folder.

    Best regards,
    Predrag

  • Jesse

    Hi, Sorry for the confusion, but I'm not really looking for the styling here as much as the layout. The layouts for all the templates in the theme are very structured and neat. The templates for the plugin are not at all and everything is all over the place.

    I was asking for you to explain how to accomplish this using just 1 template so that it would not be overwritten by updates to either the CoursePress Plugin or my theme.

    Thanks,
    Jesse

  • Predrag Dubajic

    Hi @Jesse,

    There is a solution but it might require bit more work to get everything working as intended.

    What you need to do is create new file in root folder of your theme and call it single-course.php.

    Now go to coursepress/includes/templates/ folder and copy everything from single-course-before-details.php to your single-course.php file.

    You will still need to add some wrappers and other stuff used in your theme to make the page look like your theme but after that you are safe when it comes to plugin update.

    Best regards,
    Predrag

  • osiris

    I have a similar problem, but need more specific guidance.

    Specifically, which parts of the style.css file should I copy into a custom CSS plugin to make the following happen:
    1) make course listing look exactly like default course press theme
    2) make an individual course page look exactly like default course press theme

    I tried copy/pasting the entire "course archives" part of the CSS, but it is not working with my theme. The course image is completely chaotic, and not being resized to the appropriate size.

    Please take a look (i made one course for the purpose of experimentation):
    http://www.cpetaxacademy.com/courses/

  • Dimitris

    Hey there osiris,

    hope you're doing good today!

    Copy/pasting the CSS rules won't be enough as these are based on the markup that the built-in theme provides.
    In order to have the same look you should also create some custom templates for those as explained in Predrag's last reply here https://premium.wpmudev.org/forums/topic/integrating-coursepress-pro-into-theme#post-880063 for single course pages.
    As this can be tricky though, you may have to hire an experienced developer to make this work for you. You can always advise our Jobs & Pros section for such custom development.

    Finally, as this is a rather old thread and many things have changed since then, I'd advise you to create a new thread with your issues and we could keep up from there. :slight_smile:
    https://premium.wpmudev.org/forums/#question
    https://premium.wpmudev.org/manuals/using-wpmu-dev/the-good-support-ticket/

    Warm regards,
    Dimitris

Thank NAME, for their help.

Let NAME know exactly why they deserved these points.

Gift a custom amount of points.