Course page view as in CoursePress theme

Description of issue: Copy the Courspress theme appearance to my current theme. I would like for courses to appear like in the CoursePress theme. So it is possible to add theme's templates php files to my current theme and make it work?

  • Predrag Dubajic

    Hi ccbbam,

    Hope you're doing well.

    Moving specific templates to your theme would not be an easy job because in addition to templates you would need to transfer required scripts and CSS, and since it would still use header and footer of your theme you would need to further adjust the CSS in order to get it working with the different classes than in the original CP theme.

    Due to this, I'm afraid that doing this would be custom development and you might need to hire a developer to assist you with that.
    We do have a jobs board where you can seek for dev help.
    https://premium.wpmudev.org/wordpress-development/
    Please note that no WPMU official staff members are allowed to work on the job board.

    I do see that Multiple Themes plugin is quite outdated but it seems that their support is still active on their site so you may seek some help there and ask about plugin future and if it's going to be updated:
    https://zatzlabs.com/forums/forum/multiple-themes/

    Best regards,
    Predrag

  • ccbbam

    Hi Predrag,

    Yes Nastia and Kris have tried to help me with page template but in fact no "simple" way to get that. I just asked because this WP world is somewhat new for me.

    I mean "simple" way because I believe some issues actually must be kept in perspective. Although I would like very much to have those beautifully formated course pages inserted like magic into the theme, I don´t feel they deserve the cost and effort of a custom development work.

    Of course, thanks for your kindness and guidance about the job board, I will certainly rely on them for some advanced issues I have in my list, ex. CRM features.

    Good news, right after your answer I added some custom CSS with the help of Stylebot chrome addon and with little effort was lucky to have a better visual appeal. With some more adjustments will be almost perfect, what is very good and enough for me.

    Maybe you could just give me an extra guidance on how to get that great breadcrumb with images, that is found on top of modules. Of course, if it is just a matter of adding some CSS lines, otherwise it is good as is.

    Finally, I hope multiple themes will be back in the future. And of course many thanks to all friends from WPMUDev.

  • Adam Czajczyk

    Hello ccbbam

    I myself am actually a huge fan of doing as much with pure CSS as possible, unless there's no other way, so I'm happy to hear that the CSS did the trick for you!

    As for those "great breadcrumbs with images on top of modules". I'm not quite sure which ones do you mean... Could you please explain that a bit more or - that'd be perfect! - maybe share a screenshot showing that (I assume you're still referring here to the native CP theme so you'd probably have to switch to it temporarily...)?

    Kind regards,
    Adam

  • ccbbam

    Hello Adam!

    Yes I have recently discovered the power of CSS customization! Much better when heroes friends (thanks Luis and Rupok) gave me the powerful mu-plugin hide-css-per-role, that has allowed me to selectively hide content per role.

    About coursepress, actually what I mentioned was not the breadcrumb, it was a sub-menu with images:

    I had success adding some simple css customization, but not to add images sub-menu images for the links (obs. everything from testing with chrome addon Stylebot :sweat_smile: )

    Kind regards!

    Cc

  • Adam Czajczyk

    Hello ccbbam

    Thanks for explanation!

    It seems that the support access to the site has expired already (it's time valid and deactivates itself automatically) but that's, fortunately, not that difficult thing to do.

    Let's say you want to add an image/icon to the "Cursos" menu item. First thing to do would be to use browser tools to find the ID of an "li" element for that menu item. In this case it's got an ID of "menu-item-cp-courses"

    You also need an image that you want to use. It should be rather small png or jpg image and should already be uploaded to your media library or somewhere to theme files (if it's a custom/child theme). Knowing the URL of that image and the id of the menu item, you can use this CSS:

    #menu-item-cp-courses {
      background:url('URL_OF_YOUR_IMAGE') top left no-repeat;
      background-size: 15px 15px;
      padding-left:20px;
    }

    Of course - replace the URL_OF_YOUR_IMAGE with an actual URL of the image you want to use.

    What this code does exactly is:

    - it set's an image as a background for that specific "

  • " tag which happens to be the CURSOS menu item
    - it positions the background image in top-left part of the
  • block and sets it to not repeat across entire block
    - then it sets its size (though that's not necessary if you use small enough images)
    - and finally - moves the link text to the right a bit so it wouldn't overlap with background.

    You can use that principle (actually that exact code) for all the menus on your site, you'll just need to replace the selector (element ID/class) and URL.

    I hope that helps :slight_smile:

    Best regards,
    Adam

Thank NAME, for their help.

Let NAME know exactly why they deserved these points.

Gift a custom amount of points.