Theme Settings - General

TABLE OF CONTENTS

• 1 - Typography
• 2 - Colors & Style
  • Color settings
  • Text, link and main colors
  • Button 1-2-3
• 3 - Multi-Currency
• 4 - General Settings
  • Website page layout mode
  • Body page background
  • Breadcrumb
  • Quick view

1 - Typography

• Typography settings allow users to change font family, font size and font weight for header, body and section's header individually.
• Font type: Shopify or Google. Only the fields related to the one you choose will take effect.
• Section's heading & subheading's (custom content, recent viewed) elements can be chosen based on the settings of H1 → H6 (drag the bar to value 3 → apply H3 settings).

2 - Colors & Style

Color settings

• Color hex codes define the color will appear with the name added. For example: Color swatches of product variants etc.

Text, link and main colors

Use the color picker to adjust color for each field.

• Light color: e.g. arrow button's background, highlight...
• Dark color: e.g. sale percent, newsletter section heading...

• Primary color: theme main color
• Secondary color
• Miscellaneous color: newsletter text form...
• Heading text color: for h1, h2...
• Primary text color: for all normal text
• Secondary text color: article's excerpt, date...
• Divider color: divider, border of some fields...
• Background pre-load image
• Link color: product title and author...
• Hamburger background color
• Shop color

• Includes item's prices and rating color settings

Button 1-2-3

You can see the color picker to change their background, text, border as well as hover effect color.

• Button 1: add to cart, newsletter submit,...
• Button 2: special product block's button, buy it now...

3 - Multi-Currency

Please refer to this instruction.

4 - General Settings

Website page layout mode

• Wide: Full screen width
• Boxed: An auto padding will be added around the page.
• Container (covers the main content)

• Padding
• Width

• A website's layout direction is usually LTR (left to right) but for a specific usage, you can change it to RTL (right to left). This applies on all features.

• Feature:

• Search bar: Find your items in a faster way.
• Another familiar but very convenient feature is Back to top button. It helps users have a better experience when shopping.

• Loading settings

• Enable/disable Lazy load
• Loading style: 04 options (only works when lazy load is turned on)

• Border radius: Give the blocks, product cards... a nice border radius.

Body page background

• Choosing between Image and color.
• Only related content will affect.

Breadcrumb

• Choosing between Image and color.
• Only related content will affect.

Quick view

• There are two ways to show a quick view section: Using a pop-up or a drawer.

5 - Product page

Template & Typography

• The template options are designed for different industries such as Art, Music, Game,... but of course you can pick whatever you want.
• Since the site main font settings are set in Typography tab, you can only change styles for Product title and price.

Product info

• All related elements being able to show up are listed in this section. Tick off the box to enable/disable them.

Variation swatches settings

• To choose the display form for each variant, insert its name into the field you want to apply.

E.g. Type "Size" in the Button field to make all size options show up as buttons.

• Swatch shape and size can be set for each display form.