Open the Theme settings panel to customize global stylings. Choose colors, set typography, add social media links, and more. Change the way your store looks on every page and block.

To open the Theme settings panel:

1. Log in to your store.
2. Click Online Store > Themes > Customize.
3. On the next page, click the Theme Settings icon on the left panel.

Colors

Open this folder to set color schemes that align with your branding. There are four sets of schemes: General, Accent 1, Accent 2, and Accent 3. Each combination has a color option for the Headings, Body text, and Background.

Use these color combinations across your store. Here's an example.

To customize the colors in the Header:

1. Open the Home page template.
2. Click the Header section.
3. Go to the panel on the right.
4. Click the field under the Color Scheme heading.
5. Select an option.
6. Click Save.

Momentum automatically applies the color scheme to the selected section.

Typography

Open the Typography folder to change the font, size, and case. Format your storefront's text just the way you like it.

There are two font options: headings and body text. To change the default font, click the Change button and select a font on the list. You can add a font if your favorite typeface is not on the list.

Social media

Add links to your social media accounts. If an account field is blank, Momentum does not display that social media icon on your storefront.

• Scroll down the panel, and you'll see options to enable sharing icons on product pages and blog posts. Use the checkboxes to add one or more platforms - Facebook, Twitter, and Pinterest. 

• To add social media sharing to your store, place the Social media icons block in any Blog posts template or the Product form block.

Products

Open this folder to edit optional elements of the product detail area. Check the box to display badges and use the drop-down menu to choose how (or if) to display discount savings (value, percentage, or hide).

There's also an option to display a dynamic checkout button. If enabled, the customer can click a button and quickly buy the item they're viewing. This process skips over the cart and takes them directly to a checkout process. 

Favicon

A Favicon (short for favorite icon) is a small image that sits in the browser tab (and often bookmark lists). It helps you (and your store visitors) identify a page - and the brand it represents - at a glance.

Click the Select image button and upload a file from your device.

Styles

Add a subtle hint of style to your pages. Use the border radius slider to add or remove round corners on common elements, like size options or ADD TO CART buttons.

• If you're familiar with coding basics and want to add customizations, paste some custom CSS code into the field. We recommend using these areas for basic coding updates as this can then be transferred to an updated version of the theme automatically without needing to manually update the themes code again.

Custom Javascript

Coders, here's your chance to inject a bit of interactivity. Paste your custom Javascript into the field. We recommend using these areas for basic coding updates as this can then be transferred to an updated version of the theme automatically without needing to manually update the themes code again.

Checkout

Edit the appearance of the Checkout page and ensure the final steps of your customer's transaction are intuitive and enticing. Settings include adding a background image to the banner, main content area, and order summary. 

• You can also edit the customer's order summary. Add a background color, customize typography, and change the color of accents, buttons, and errors.