Change Motivator's Display Settings

Modified on Mon, 23 Oct, 2023 at 12:53 PM

Overview

SC Sales Motivator allows you to customize the banner's storefront display. You're able to adjust the colours, font size, and timing of the Motivator bar. You can also use your own custom CSS styling to further style the app.


Setup

To customize the app's display, please follow these steps:

  1. From within the Motivator admin, select Display Settings.

    From Motivator's top navigation bar, select Display Settings

  2. Select the initial banner's colours, padding, and border colour & size.

    Under Step 1 Styling, choose your banner's background colour, underneath that choose the padding (in pixels) for spacing, and the colour and size of the bottom of the border (side by side options)

  3. Select the main text's colour, size, and boldness.

    Note: This is the styling for the main text that displays on the banner.

    Under Step 2 Style the Main Text, choose the font colour (left side), font size (right side), and Select the Yes or No checkbox for the text being bolded

  4. Select the balance text's colour, size, and boldness.

    Note: This is the styling for the balance amount shown in each of the qualifying messages.

    Under Step 3 Style the Balance Text (the text informing customers of their balance to reaching the goal), repeat the same steps as above

  5. Select the confirmation text's colour, size, and boldness.

    Note: This is the styling for the text on the final confirmation banner.

    Under Step 4 Style the Confirmation Bar, repeat the same steps as above to customize the confirmation banner

  6. Select the banner timing.

    Note: This is how long the banner will display to your customers each time it shows on the storefront. Visit How does the display timer work in Motivator? for more information.

    Under Step 5 Timing, enter how long (in seconds) the banner will display for

  7. Enter any custom CSS styling in the Additional CSS box.

    Note: Making adjustments to Motivator requires a knowledge of CSS. If you are not comfortable with completing this on your theme, one of our partners would be happy to help with a paid customization on your store. Please reach out to HeyCarson via this form.

    Under Step 6 Custom CSS, use the textbox to enter in custom styling using CSS

  8. Select Save.

Was this article helpful?

That’s Great!

Thank you for your feedback

Sorry! We couldn't be helpful

Thank you for your feedback

Let us know how can we improve this article!

Select at least one of the reasons
CAPTCHA verification is required.

Feedback sent

We appreciate your effort and will try to fix the article