TABLE OF CONTENTS
- 1 - Top bar
- 2 - Header
- 3 - Navigation
- 4 - Footer
- 5 - Product Card
- 6 - Fomo Popup
- 7 - EU policy popup
- 8 - Cart page
- 9 - Social sharing
- 10 - Checkout
1 - Top bar
- Inside this tab, we can adjust announcement bar settings such as colors, opacity, text font size and font weight.
- To modify its content, please go to static section - Top bar settings.
2 - Header
- In here, you will see the settings for the header's colors and all icons contained in it:
- Favicon
- Loading icon
- Account icon
- Search icon
- Wishlist icon
- Compare icon
- Cart icon
3 - Navigation
Main menu
The elements you can edit are:
- Link color
- Text size
- Font weight
Dropdown menu
Like the main menu, you can adjust mega menu appearance as well
- Background color
- Link item color
- Text size
- Font weight
Navigation label color
- Use the color picker to get the color you want.
- There are 03 available labels: Hot, New and Sale.
- To learn how to set the labels, please go to Static section - Header settings.
4 - Footer
Where you can find color selection of the site footer.
- Newsletter box background and footer background are separated.
- Other elements are
- Footer copyright background
- Text color
- Link color
- Font size & font weight
5 - Product Card
Used on Home page's sections and Collection product grid.
Text settings
- Title size & font weight
- Price size & font weight
Product style
- Style selection (Add to cart button's position)
- Check boxes for turning on/off the the padding and the shadow around the card (hover effect)
Product image
- For the best result, all images should be in the same ratio. You can choose available options in the drop-down box and use the tool to auto crop everything.
- The theme has 10 hover effects for you to choose from.
- Overlay color appears with some effect like Fade In one.
Swatch item
- Fill in the blank with variants' title which you want to display on the product card. Separate each value with a comma.
- Color variants can be shown as images instead of normal swatches
- Other settings
- Swatch shape
- Limit swatch items to show
- Swatch size
Product label
- New and Hot labels work based on product tags while Sale label will auto appear when a sale price is added.
6 - Fomo Popup
Fomo Popups display real-time customer activity notifications on your store. You can use it as a Social Proof Markteting Tool to Boost Conversions.
- Please refer to this post for more information.
7 - EU policy popup
- To modify the popup position, open the Position drop-down box for more selections.
- You can also link the popup to the policy page and change display colors.
- Popup's text can be found in Edit Languages > General > Cookie.
8 - Cart page
- At the top of the section you'll see the check box of
- Disable Ajax cart (a.k.a cart drawer)
- Enable catalog mode: By turning on this, all Add to cart button will be hide on your store (including product pages), make it become a preview site.
- Page display style: Divided into different industries.
- Cart effect on desktop: Cart drawer position.
- Other information can be added are
- Terms and conditions
- Free shipping: May require a minimum spend to apply
- Shipping calculator: Count the needed amount to have the free shipping.
9 - Social sharing
- The total icons can be added are 05. Default settings are Facebook, Twitter, Google Plus, Pinterest and Youtube.
- Users are able to select between using Font icon or Image. Only related fields will affect.
10 - Checkout
Shopify does not allow users to make special changes on the checkout page but you are still able to modify some basic settings such as
- Banner and logo insert
- Set display styles for Main content area as well as order summary section.
- Typography
- Links, buttons, messages'... colors