Skip to main content

Theme Settings

Overview​

Use Theme settings to customize the store's typography, colors, cart, social media, and more.

The Theme settings menu provides controls for adjusting the Gentech theme's settings. For example, you can use the color schemes to adjust the color groups used in the theme.

Adjust a theme setting​

To adjust a theme setting, follow the following steps.

  1. On the store’s admin page, select Online store from the side menu.

  2. In the Current theme area, select Customize.

  3. From the customize theme menu, select Theme settings. Depending on the size of your device’s screen, the menu is on the left or right side.

  4. From the Theme settings menu, select a menu section.

  5. In the expanded menu section, select a setting to adjust.

  6. Adjust the settings.

tip

When you’re finished adjusting the theme, to avoid losing unsaved changes, select Save at the top of the Theme settings menu.

Theme Gentech's settings​

1. Logo & Favicon​

Use the Theme settings > Favicon menu options to customize your store’s logo & favicon.

Gentech theme settings

Use the image picker to select an image from your store’s image library to use as a favicon. The maximum image size for a favicon is 32pxx32px. Uploaded favicon images that exceed these dimensions will be scaled down to 32pxx32px.

2. Colors​

Use this settings to set how colors are used throughout your store.

Gentech theme settings

You can use the available color schemes, or edit them or create new schemes. Color schemes can be applied to sections throughout the online store.

Use the search behavior to control how the search results are displayed. When the product suggestions are enabled, the search view can show the products beside other search results of collections or blog posts.

Gentech theme settings

4. Typography​

Use this setting to set how text is displayed throughout your store. You can select the font families for subheadings, headings body texts, and anywhere else with typeface.

Gentech theme settings

Keep in mind that using the System fonts is preferable since they load faster than other font.

5. Layout​

Use this settings to change the theme page's layout - from the width to space between sections, and grid.

Gentech theme settings

6. Animation​

Use this settings to change the duration of the animation and the effect.

7. Corner radius​

Use this settings to change the radius of the corner on overall theme, with Pill being the highest.

8. Buttons​

Use this settings to change the style of the button.

Gentech theme settings

9, Input fields​

Use this settings to change the style of the input.

10. Products cards​

Use this settings to change the look of the product cards for products.

11. Cart​

Use the Theme settings > Cart menu options to set how customers purchase products on your store’s cart page.

Gentech theme settings

  • Cart type. Use the Cart type dropdown to set your cart to display as a Drawer or Page, when the Add to cart button is selected. With this option set to Drawer, the cart displays on the current page within a side element called a drawer. To turn off this functionality, and redirect visitors to the cart page, set the dropdown to Page.
  • Cart drawer placement: Choose to show the cart on the left or right of the screen
  • Show cart free shipping: Show the free shipping bar and set the rule for the amount of order that the customer can receive free shipping.

12. Modal​

Use this settings to change the look of the modal with border, shadow and the animation.

For example, change how the Quick Preview modal looks.

13. Drawer​

Use this settings to change the setting of the drawer animation, like cart drawer or menu drawer

14. Swatches​

Use this settings to change the setting of the product variant swatches, like the size, or using variant images or not.

15. Variant pickers​

Use this settings to change the look of the variant pickers, like their width.

16. Image lazyload​

Enable/Disable and chose between 3 type of lazy loadings.

17. Currency format​

Enable this settings to show the currency code on the store.

  • Show currency code: Enable so cart and checkout prices always show currency codes. Example: $1.00 USD.

18. Social media​

This section describes the Theme settings > Social Media menu options to integrate social media into your store.

  • Social media accounts: Add the link to your store's social media. Enter links for Instagram, Facebook, Twitter, Pinterest, Snapchat, TikTok, Tumblr, Youtube, and Vimeo.
note

When you enable social media links, the theme displays corresponding social media links as text/ icons throughout your store.

19. Custom CSS​

Use this to add custom CSS to the theme.