How to Edit Lessons in Classroom Mode with a Page Builder

MemberPress Classroom Mode strips out extra Scripts and Styles that are enqueued by other plugins and your theme. This is necessary to ensure the clean classroom look and feel. If you want to edit your lessons and course overview with a page builder (like Elementor) you have two options.

  1. Turn off Classroom Mode
  2. Enable Extra Scripts and Styles in Classroom Mode

Turn off Classroom Mode

If you want to turn off classroom mode, and instead just use your current theme, the directions to do so are below. But be aware that some of the functionality of classroom mode won't be available for you to use. 

  1. Go to MemberPress->Settings
  2. Select the "Courses" tab
  3. Toggle Classroom Mode to off
  4. Press the "Update Options" button at the bottom of the page.

Enable Extra Scripts and Styles in Classroom Mode

If you want to keep the clean look and feel of classroom mode and all the functionality you can enabled extra scripts and styles using some settings and custom code.

  1. Go to MemberPress->Settings
  2. Select the "Courses" tab
  3. Scroll down to the bottom of the page
  4. Set WP Footer Hook to "Enabled"
  5. Press the "Update Options" button at the bottom of the page.

Note: If you previously added a code snippet to enable the footer (like the one blow) you will need to remove this code from your themes of snippet plugin. 

add_action('mpcs_courses_footer', 'do_wordpress_footer');
function do_wordpress_footer() {
  do_action('wp_footer');
}

  1. Next, if your page builder is listed below, you can use that code snippet in the next step. 
    1. If not, you will need to determine while style scripts need to be loaded and the handle your specific page builder uses. This can be a difficult process, so we recommend you either contact the page builders development team for assistance. 
    2. This is the format for the code snippet you will need to add:
    3. add_filter('mpcs_classroom_style_handles', function($allowed_handles){
      	$allowed_handles[] = 'YOUR_STYLE_HANDLE_HERE';
      	return $allowed_handles;
      });
      		
  2. Add the code snippet to either your functions.php file (if you have a child theme) or a plugin that allows you to add php code (like Code Snippets or Woody Code Snippets).

Page Builder Scripts

We don't have all the scripts needed for all the page builders. But we have found that customers have had success with the ones listed below. If you discover a list that works for your page builder, and would like it included here, please contact support.

Elementor

add_filter( 'mpcs_classroom_style_handles', function( $allowed_handles ) {
  $allowed_handles[] = 'elementor-icons';
  $allowed_handles[] = 'elementor-frontend';
  $allowed_handles[] = 'elementor-post-' . get_the_ID();
  $allowed_handles[] = 'elementor-pro';
  $allowed_handles[] = 'elementor-gallery';
  $allowed_handles[] = 'elementor-icons-fa-solid';
  $allowed_handles[] = 'elementor-icons-fa-brands';
  $allowed_handles[] = 'elementor-icons-fa-regular';
  $allowed_handles[] = 'prismjs_style';
  $allowed_handles[] = 'editor-preview';
  $allowed_handles[] = 'pro-editor-preview';
  $allowed_handles[] = 'flatpickr';
  $allowed_handles[] = 'select2';
  $allowed_handles[] = 'elementor-select2';
  $allowed_handles[] = 'elementor-pro-admin';
  
  return $allowed_handles;
});
Did this answer your question? Thanks for the feedback There was a problem submitting your feedback. Please try again later.