This doc will guide you through the steps to add a background image to your lesson headers within an Execution Plan.

Learn how to add Custom CSS within eLearn Commerce

We'll customize this section here:

Let's add a Custom Background! In this case, it's the eLearn Commerce partial logo. You'll want to aim for an image that is 46p or smaller in height for best display.

.wpep-wrapper .wpep-container #course-single #course-primary #course-content .wpep-course-form .section-accordion-group .lesson-accordion .lesson-accordion-group .ui-accordion-header {
   background: rgba(0, 0, 0, 0) url("https://codestore.codeiscode.com/wp-content/uploads/2016/09/codeiscode-header-logo-red.png") repeat scroll 0 0;
}

In case you're not using a white background, simply add this Custom CSS to your setup and replace the image link with your own.

How to also change the text color

.wpep-wrapper .wpep-container #course-single #course-primary #course-content .wpep-course-form .section-accordion-group .lesson-accordion .lesson-accordion-group .ui-accordion-header {
   background: rgba(0, 0, 0, 0) url("https://codestore.codeiscode.com/wp-content/uploads/2016/09/codeiscode-header-logo-red.png") repeat scroll 0 0;
}

.wpep-wrapper .wpep-container #course-single #course-primary #course-content .wpep-course-form .section-accordion-group .lesson-accordion .lesson-accordion-group .ui-accordion-header .lesson-heading {
    color : #000000 !important;
}

Simply add this Custom CSS to your setup and replace the image link with your own and the #000000 color code with the code for your desired color.

Did this answer your question?