Skip to main content

New Theme Customizer for Courses in Stack

Overview​

The New Theme Customizer in Stack is a dynamic feature that lets you personalize your course site's appearance effortlessly. From logos and search bars to hero sections and course sidebars, you have full control over key design elements to craft a visually appealing and branded learning experience.

With intuitive visibility toggles, color and text overrides, custom content blocks, and template-saving options, you can design course sites that perfectly align with your brand identity—no coding skills required. Real-time previews ensure that your changes are instantly visible, while system and custom templates provide flexibility for quick deployment.

This guide details each feature and customization option available to you.

How to Use the New Theme Customizer​

  1. Navigate to the "Customize" option in your Course Outline.
  2. Click on "Browse System Templates".
  3. Select the "Neo Classic" Theme to utilize the New Customizer.
  4. Modify the theme using the available customization options and save it for future use.
  5. If saved, you can find it later under the "My Templates" option on the main "Customize" screen.

Key Features and Customization Options​

  • Visibility: Toggle to Show/Hide
  • Category Types: Text, Image
  • Logo Action: Choose an action for clicking the logo to redirect users to:
    • Site Home
    • Product Home
  • Height Options: Small, Medium
  • Placement: Typically in the top-left or center of the header
  • Visibility: Toggle to Show/Hide
  • Search Helper Text: Add instructional text inside the search bar
  • Appearance Properties:
    • Background Color Override
    • Text Color Override

3. Hero Section​

Customize the hero section to change the appearance of the top-most part of your course page.

  • Visibility: Toggle to Show/Hide
  • Appearance Types:
    • Image background
    • Color Picker for solid backgrounds
  • Overlay Options:
    • No Overlay (Checkbox)
    • Overlay Color and Opacity customization
  • Course Info Customization:
    • Title: Text, Color Override, Bold/Italics, Alignment (Left, Center, Right)
    • Description: Text, Color Override, Bold/Italics, Alignment
  • Spacing Options: Full Height, Medium, Small
  • Start Button Customization:
    • Text: Color Override, Content
    • Button: Color Override, Alignment

4. Welcome Body​

Add multiple content blocks to the welcome body, including images, text, videos, and CTAs.

  • Image Block:
    • Upload an image
    • Set an image action (URL link on click)
  • Text Block:
    • Text Alignment (Left, Center, Right)
    • Color Override, Bold, Italic
  • Video Block:
    • Upload a video directly
  • Custom Block:
    • Text: Alignment, Color Override, Bold, Italic
    • Image: Upload an image, add an action URL
    • CTA Button: Customize button color, text color, content, and destination link
    • Video: Upload a video

5. Course Syllabus​

The Course Syllabus outlines your Course Modules and Lessons.

  • Visibility: Toggle to Show/Hide
  • Syllabus Type Selection:
    • Categories: Organize courses by category
    • Posts: Display syllabus as a list of course posts
  • Customizable Text Fields:
    • Categories Label
    • "Coming Soon" Text
    • "Show More" Text

6. Course Sidebar​

  • Progress Bar:
    • Show/Hide
    • Color Override
    • Custom Text Override (with an info icon for description)
  • Instructor Section:
    • Show/Hide
    • Headshot Display: Show/Hide, Upload Image
    • Instructor Info: Heading, Name, Title, Bio
  • Cross-Sell Section:
    • Promote another Offer directly from your Course Product
    • Customize the appearance of your Offer within the Cross Sell block
    • Select an Offer
    • Set a CTA Text to encourage sign-ups
  • Custom Blocks:
    • Add a custom block to your Sidebar
    • Text: Customize content, color, style, and alignment
    • Image Block: Upload an image and assign an action URL
    • CTA Button: Customize content and destination link

Additional Customization Options​

Lesson Page Customization​

  • Breadcrumb Navigation: Show/Hide to act as a trail leading back to the Course homepage.
  • Lesson Player Settings:
    • Background Color Override
    • Auto Advance (On/Off)
  • Lesson Body: Configure the appearance of your Lesson Body
    • Text Alignment: Left, Right, Center
    • Text Color Override

Category Page Customization​

  • Categories Sidebar:
    • Progress Bar: Show/Hide, Color Override
    • Text Override (with "i" icon for tooltips)

Explore these features to make your course site uniquely yours with Stack's New Theme Customizer!