Using Coursepress with Divi Theme from Elegant Themes

Hi there,

I'd like to use Coursepress with the Divi theme from Elegant Themes. It works in a basic way, but I'd like to integrate much of the custom styling of the Coursepress Pro theme. I have spotted mention around the forums of users using Divi and Coursepress well together with a few tweaks. Could you tell me, please, what CSS or file templates I need to copy over in order to make Coursepress look good in Divi? I assume I'll need to make a Child theme, which is fine, so instructions from there would be appreciated.

Thanks

  • Kasia Swiderska
    • Support nomad

    Hello Colin,

    Please take a look on this thread https://premium.wpmudev.org/forums/topic/coursepress-trouble-setting-it-up-for-our-needs - there is instruction on how to create child theme from Divi theme that will have all the needed functions and also behaves properly. There is also archive with files required for child theme to work.

    In most cases we provide custom code depending on what member need to achieve. If you could tell me what exact changes you want on your site I could provide some CSS code.

    kind regards,
    Kasia

  • Colin
    • Site Builder, Child of Zeus

    Thanks for the help Kasia.

    I've put those files in, but the template is still very basic. I'd like to bring in the Coursepress theme stylings - would you mind helping with that?

    For example, the course catalog page:
    https://www.thepodcasthost.com/hub/courses/

    And the course outline page:
    https://www.thepodcasthost.com/hub/courses/podcast-liberation-set-your-podcast-free/units/
    Eg. the percentage icons.

    And a standard course page:
    https://www.thepodcasthost.com/hub/courses/podcast-liberation-set-your-podcast-free/units/1-what-is-a-podcast-and-how-does-it-work/
    Eg. the buttons at the bottom don't have the coursepress theme styling.

    I've enabled support access so that you can have a look. Thanks!

  • Kasia Swiderska
    • Support nomad

    Hello Colin,

    I'm terribly sorry for delay on my end. About those changes - I think this was cache on your site because I did not add any additional code to your site.
    But I'm checking this and I think I would need to rewrite my code for Divi theme because I suspect that you are using latest Divi and my code was for one of the previous version (thats why sidebars are misplaced). Because this is paid theme I don't have access to updated version. If you could send me copy of the theme you have for testing purposes that would extremely helpful.
    Could you please send in the following via our secure contact form https://premium.wpmudev.org/contact/ :

    - Mark to my attention, the subject line should contain only: ATTN: Kasia Swiderska
    - Do not include anything else in the subject line, doing so may delay our response due to how email filtering works.
    - Link back to this thread
    - Link to zipped Divi uploaded on the service like Dropbox or Google drive
    - Include any relevant URLs for your site

    IMPORTANT: Please make sure you select "I have a different question" for your topic, so it doesn't go back to the forums - this and the subject line ensure that it gets assigned to me.

    kind regards,
    Kasia

  • Colin
    • Site Builder, Child of Zeus

    Hi Kasia,

    Would you mind giving me a timescale for this? If you think it'll be more than a few days, I'll need to tidy up some of the basic bits myself just now while waiting for the main style changes. Would appreciate your thoughts.

    Thanks,
    Colin

  • Rupok
    • Support Ninja

    Hi Colin

    Hope you had a wonderful day.

    If you think it'll be more than a few days, I'll need to tidy up some of the basic bits myself just now while waiting for the main style changes.

    I'll prefer you do your changes first, because I just had a look at the issues and I think, I'll need to make some extensive CSS test on your site, and will have to give you quite a few custom CSS code. So testing and giving code on a stable site is better for resolving the issue faster.

    Can you please confirm when you are done? I'll jump in as soon as you confirm.

    Have a nice day. Cheers!

  • Nithin
    • Support Wizard

    Hi Colin,

    Hope you are doing good. :slight_smile:

    I have made the required changes and have attached a child theme. Since templates have to be added, the changes fit well in a child theme. Please upload this theme under /wp-content folders and activate it to see the changes made as required in course catalogue, outline and standard pages.

    I hope this helps. Please let us know if you need any further help. :slight_smile:

    Kind Regards,
    Nithin

  • Colin
    • Site Builder, Child of Zeus

    Thanks Nithin, looking good!

    Quick question please, just to do some tidying up.

    I'm seeing the sidebar on the course pages. Can I have a separate sidebar that appears on course pages, so that I can have a menu, or instructions that only show when the student is within the course?

    Thanks,
    Colin

  • Rupok
    • Support Ninja

    Hi Colin

    Hope you had a wonderful day.

    Can I have a separate sidebar that appears on course pages, so that I can have a menu, or instructions that only show when the student is within the course?

    This is not your theme sidebar. This sidebars is included in the content of CoursePress single page. If you want to show your theme sidebar, open "single-course.php" from the child theme Nithin has provided, then replace Line 29 with the following:
    <?php get_sidebar(); ?>
    This will show Divi default sidebar, but please keep in mind, this will break the similarity between current look and CoursePress default theme design. The course content sidebar will go down at bottom again. Please let us know what you suggest.

    And regarding the condition, do you want to show that new sidebar only to a student who has already enrolled in that specific course? Or do you want to show that new sidebar only inside the course description page?

    Also, the percentage graphics still aren't showing up on the course outline page. How can we get them running please?

    Can you please share URL where we can see this live. I'm looking forward to hear from you and resolve these issues as soon as possible.

    Have a nice day. Cheers!

  • Colin
    • Site Builder, Child of Zeus

    Another little question - there's some space in the header of each module that I can't get rid of. It might be to do with a blank <p></p> and a in there. Can I get rid of them, or give them no size with CSS at least?

  • Nithin
    • Support Wizard

    Hi Colin,

    Hope you are doing good today. :slight_smile:

    Have added a new sidebar "Course Sidebar", you can add contents to it, under Appearance > Widgets.
    This sidebar will be visible only in the area shown in your screenshot. If you want the sidebar to be visible in other page, you could replace "get_sidebar();" function with the following code.

    <?php get_sidebar( 'course' ); ?>

    Another little question - there's some space in the header of each module that I can't get rid of. It might be to do with a blank <p></p> and a in there. Can I get rid of them, or give them no size with CSS at least?

    Could you please point to the exact page and enable support access, I'm not able to replicate in my system.

    Please find the theme attached below. Have a nice day. :slight_smile:

    Kind Regards,
    Nithin

  • Colin
    • Site Builder, Child of Zeus

    Hi Nithin,

    Thanks for the sidebar work!
    I've already made a fair few CSS & functions changes to the previous theme you sent - would you mind telling me which files you've updated, or the code you've added so I can add it to the existing one?

  • Nithin
    • Support Wizard

    Hey Colin,

    would you mind telling me which files you've updated, or the code you've added so I can add it to the existing one?

    I have added additional templates and edits to the file functions.php, this should fix the sidebar and presentation graphics.
    Templates include: archive-unit.php, sidebar-course.php, single-unit.php

    there's some space in the header of each module that I can't get rid of. It might be to do with a blank <p></p> and a in there. Can I get rid of them, or give them no size with CSS at least?

    Please try the theme which I have sent above, this is already fixed. :slight_smile:

    Have a nice day. :slight_smile:

    Best Regards,
    Nithin

  • Nithin
    • Support Wizard

    Hi Colin,

    The child theme seems to work from my side, could you please check and confirm whether the 'unit title' is missing after the new child theme is activated. If not, please run a quick plugin/theme conflict test as illustrated in getting support manual (flowchart) to rule out any conflicts.
    https://premium.wpmudev.org/manuals/using-wpmu-dev/getting-support/

    I hope this helps. Have a nice day. :slight_smile:

    Kind Regards,
    Nithin

  • Colin
    • Site Builder, Child of Zeus

    It's OK, I've altered the template to bring it up, thanks though.
    Quickly, to tie this up, I see the shortcode for unit title there, but it automatically introduces the H3 tag along with the title itself. Is there a shortcode or a viariable for both the unit title and the course title that does NOT bring in header tags too - rather, just outputs the title alone?

    Thanks,
    Colin

  • Nithin
    • Support Wizard

    Hi Colin,

    Hope you are doing good today. :slight_smile:

    Basically, I want to output the following:

    *Course Title* >> *Unit Title*

    function add_course_trial_link() {
    
    	$current_course_id = do_shortcode( '[get_parent_course_id]' );
    	$current_course_list = do_shortcode( '[course_title link ="yes" title_tag="" course_id="' . $current_course_id . '"]' );
    
    	$current_unit_id = in_the_loop() ? get_the_ID() :'';
    	$current_unit_list = do_shortcode( '[course_unit_title link="yes" unit_id="' . (int) $current_unit_id . '"]' );
    
    	if( !empty( $current_course_list ) && !empty( $current_unit_list ) ) {
    
    		echo $current_course_list . "<span class='course-seperator'> >> </span>" . $current_unit_list;
    	}
    }

    Please add the following code to your child themes functions.php file, and call the function in your single-unit.php file. Eg:

    <?php add_course_trial_link(); ?>

    You can find all the available Shortcodes under CoursePress Pro > Settings > Shortcodes

    Please let us know how that goes. Have a nice weekend. :slight_smile:

    Kind Regards,
    Nithin

  • WebDoc
    • The Incredible Code Injector

    Hi Nithin,

    So, I've been using the child theme you've provided for awhile now and it appears that there are some bugs from the latest Coursepress update. Can you please take a look and let me know what you find. Courses are not showing up on pages and I am getting the error below in multiple files:

    PHP Fatal error: Class 'Course' not found

    Thanks,
    David

Thank NAME, for their help.

Let NAME know exactly why they deserved these points.

Gift a custom amount of points.