Skip to main content
SNAP Course Page (03) 🎨

Banner CTA and Video

Updated over a year ago

About This Section

In this SNAP Design Page Template, we have placed the video in the main banner section that spans across the full width of the page. The pricing and CTA buttons have also been moved to the banner. The main content area then follows below splitting the page with the small sidebar that contains the quick attributes for the course.

SNAP Design Page templates will use the information provided inside the SNAP Information sections. The settings in this section will allow you to change the default styles, hide sections and content and other design options SNAP uses the default color settings that you have chosen with your Thinkific Theme Settings. In some cases there may be some "conflict" with colors in the design. If you see missing content or hard to see content, then adjust the Theme settings or set a custom color setting in this section. The setting will indicate what color setting is being used by default.

Settings

Sidebar

  • Background - this controls the color of the background for the sidebar

  • Show quick attributes - when enabled, this will show the quick attributes section

    • Attributes Text - color of the quick attributes text

    • Attributes Icon - color of the quick attributes icon

  • Show includes list - when enabled, this will show the includes section

    • Includes List Heading - the color of the includes list heading

    • Includes List Text - the color of the includes list text

    • Custom Color Includes List Icon? - when enabled, you can change the default color that the list icon uses

  • Show social share icons - when enabled, it will show the social share icons. These icons will trigger a social "share this page" popup on the social platform that was clicked

  • Stick Position From Top - this will control the position from the top of the page that the sidebar will stick (Desktop only). This is really important when you have a sticky navigation bar. It also depend on the amount of content you may have inside the sidebar based on the options

Banner Section

  • Custom Background Color Heading? - when enabled this will use the custom color settings

    • Background - the custom color used for the background

  • Custom Color Heading? - when enabled, the heading color will change based on the color you choose

  • Custom Color SubHeading? when enabled, the subheading color will change based on the color you choose

  • Custom Color Price? - checking this box will enable the custom color option. By default, this color will be the Theme Button Background

  • Custom Color Savings? - this controls the color of the savings area (when enabled)

  • Strike Price - the price that is displayed with a strikethrough

  • Use SNAP Course Information Banner Image? - when checked this will enable the background image provided in the SNAP Course Information banner instead of the background color. You can also set the Image Focal Point to position the image properly

When using background images - please be sure to not select any images where text is included. These images will automatically be cropped to fill the space provided. You will see different parts of the image on different size screens. Also, be sure to darken/lighten the image so that the text stand out.

  • Heading Size (Desktop), Heading Size (Mobile), SubHeading Size (Desktop), SubHeading Size (Mobile) - this will control the size of the text used for the heading and subheadings in both desktop and mobile sizes

Video Section

  • Video Type - this setting will control the type of video that is used in the SNAP Design.

    • Inline - will show the video within the content area

    • Popup - will show the video in a popup when the play icon is clicked

The video that is used is controlled by the SNAP Course Information setting. be sure to set this in order to enable this feature

Overview Section

  • Use this section? -when enabled the Course Overview section will be shown

  • Custom Color Heading? - when enabled, a custom color will be used for the section heading

  • Custom Color SubHeading? - when enabled a custom color will be used for the summary content. Any custom color used in the rich text editor will be used when specified

What You Will Learn Section

  • Use this section? - when enabled, the What you will learn section will be shown

  • Custom Background Color? - when enabled the background color can be changed

  • Custom Color Heading? - when enabled the section heading color can be changed

  • Custom Color SubHeading? - when enabled the section subheading color can be changed

  • Custom Color List Text? - when enabled the section list text color can be changed

  • Custom Color List Icon? - when enabled the section list icon color can be changed

Requirements Section

  • Use this section? - when enabled, the Requirements section will be shown

  • Custom Background Color? - when enabled the background color can be changed

  • Custom Color Heading? - when enabled the section heading color can be changed

  • Custom Color SubHeading? - when enabled the section subheading color can be changed

  • Custom Color List Text? - when enabled the section list text color can be changed

  • Custom Color List Icon? - when enabled the section list icon color can be changed

Who is this course for Section

  • Use this section? - when enabled, the Who is this course for section will be shown

  • Custom Background Color? - when enabled the background color can be changed

  • Custom Color Heading? - when enabled the section heading color can be changed

  • Custom Color SubHeading? - when enabled the section subheading color can be changed

  • Custom Color List Text? - when enabled the section list text color can be changed

  • Custom Color List Icon? - when enabled the section list icon color can be changed

Curriculum Section

  • Use this section? - when enabled, the Curriculum section will be shown

  • Custom Color Heading? - when enabled the section heading color can be changed

  • Curriculum List - when enabled the section list text color can be changed

  • Curriculum Icon - when enabled the section list icon color can be changed

Instructor Section

  • Use this section? - when enabled, the Instructor section will be shown

  • Custom Color Heading? - when enabled the section heading color can be changed

  • Custom Color Summary? - when enabled the section summary color can be changed

Reviews Section

  • Use this section? - when enabled, the Reviews section will be shown

FAQ Section

  • Use this section? - when enabled, the Instructor section will be shown

  • Custom Color Section Heading? - when enabled the section heading color can be changed

  • Custom Color Section Question? - when enabled the faq question color can be changed

  • Custom Color Answer? - when enabled the faq answer color can be changed

Did this answer your question?