Customizing Membership Themes

Overview

You can personalize the appearance of your membership product pages using pre-designed themes. These themes help you create a consistent brand experience and style for your digital products. This guide explains how to select, customize, and apply a theme to your membership product.

Step 1: Choose a Product Theme

When you create a product, it defaults to the classic theme. However, you can choose from several system themes to better align with your brand. Each theme offers a distinct look and feel for your members.

To select a theme:

  1. Navigate to your product within the CRM.
  2. Click Customize.
  3. Browse the theme gallery, which displays available system themes.
  4. Select a theme to preview or customize it.

Note: User-created themes (My Themes) will be available in future updates.

Step 2: Customize Your Theme

After selecting a theme, you can tailor its appearance to match your brand. Click Customize in the theme gallery to open the customization builder.

Theme Settings

In the theme settings, you can adjust:

  • Primary Color: Affects buttons, top icons, lesson progress, course title, category title, lesson title, and instructor title.
  • Secondary Color: Affects instructor name, instructor description, lesson description, category description, and button text.
  • Primary Font: Applies to buttons, top icons, lesson progress, course title, category title, lesson title, and instructor title.
  • Secondary Font: Applies to instructor name, instructor bio, lesson description, category description, and button text.
  • Logo Placement: Determines whether the logo appears in the header or hero section.

Page Sections

You can also customize individual sections of your product and lesson pages. Click on a section in the sidebar editor to view its customization options.

Key sections include:

  • Header: Adjust background color and alignment.
  • Hero: Modify size, course title font and alignment, course description font and alignment, and background image or color.
  • Lesson Progress: Customize background color, font, and progress color.
  • Course Body: Adjust fonts, colors, and sizes for categories, subcategories, descriptions, lessons, and backgrounds.
  • Instructor: Customize background color and fonts for headings, names, titles, and bios.
  • Lesson Body: Modify background, title font and color, description font and color, button content and style, and next lesson settings.
  • Course Navigation: Adjust background color, fonts for categories and lessons, highlight colors, breadcrumb style, and next category settings.

Note: Clicking Save Changes updates the preview with your customizations. Use Reset to Default to revert to the theme's original settings. Customizations made in sections override theme settings.

Step 3: Apply or Save Your Theme

Once you've customized your theme, apply it to your product so members see the final design.

Apply to a Product

To apply a theme:

  1. Select your product.
  2. Click Customize.
  3. In the theme gallery, click Apply for your chosen theme.
  4. Alternatively, customize a theme and click Apply in the top-right corner.

Save for Global Use

To save a theme for use across multiple locations:

  • Click Save Theme after making changes. This saves the latest changes (after clicking Save Changes) for global use.
  • Note: Unsaved changes won't be included. Saving a theme globally doesn't affect products already using the same theme; you must reapply the theme to see updates.