Support and documentation

Welcome to the Yuva user documentation.

Browse the support documentation to set up the Yuva theme and built-in modules quickly.

Theme support includes:

• Our support includes bug fixes and answering questions related to theme settings and existing features.

Theme support does not include:

• Our support does not cover assistance for integrating third-party apps, development of new features, any changes in the theme design structures, adding new theme settings, or fixing issues caused by third-party developers or apps.

Support hours

• Monday – Friday (excluding Indian public holidays)
• 09:30 – 18:30 IST (Indian Standard Time)

Announcement bar

The announcement bar is an optional section, when enabled, it permanently sits at the top of every page on your website. This feature can keep your customers informed of upcoming sales, newly launched products, and promotional discounts. You can also configure a sales countdown timer to display the duration of the sale. You can set the timer to display specific hours, days, or months for which the sale will be on. A maximum of 3 blocks can be added in this section.

Note: You can edit and make changes to the announcement bar on all page templates, excluding the Checkout, Password, and Gift card page templates.

Configure the announcement bar section

• Go to Customize theme. At the top of the page, click on the dropdown to select the Home page template.

• From the left side menu, select the Announcement bar.

• Customize this section using the settings shown in the following table.

Block settings

Header

Three primary navigation types are provided with the Yuva theme:

• Logo left, menu center

  

• Logo center, hamburger menu

  

• Full width menu

  

• Full width header with searchbar

  

Configure the header section

• Go to Customize theme. Click on the top dropdown menu to select the Home page template.

• From the side menu, select Header.

• Configure the "Header" in the setting on the right side with the following settings.

Configure the header menu

To select a menu to be displayed inside the Header section, apply the following settings in Header > Menu.

1. To edit the current menu, click on the Edit menu link. This link will open the Navigation menu editor in the Shopify admin. panel. This editor is used to modify the menu. You can refer to Shopify help: Add, remove, or edit Menu items in your online store.
2. To create the new menu, click on Change > Change menu, and follow the Create menu link. The link opens the Navigation > Add menu page in the Shopify admin. You can use the Menu editor for creating a new Menu, and then click on the New menu. For detailed understanding, click here Shopify help: Add, remove, or edit Menu items in your online store.

Configure mega menus in the header

Adding a Mega menu to the main navigation is simple. Configure the following settings to add a Mega menu to your main navigation:

1. Select the Header option from the theme editor.
2. Click on “Add block.” With the Yuva theme, merchants can create three types of blocks: “Mega menu with submenu & products,” “Mega menu with products & gallery,” and “Mega menu with product list.”

Note: The mega menus do not work with the navigation types, i.e.,“Logo center, hamburger menu” & the “mobile hamburger.”.

Mega menu with submenu & products block settings

This Mega menu allows you to add submenus and products. Please refer to the snapshot added below.

Configure mega menu with submenu & products

• Add the “Mega Menu with submenu & products” block.

  
  

• Add a menu label similar to the first-level navigation you added from Shopify navigation. For example - Catalog.

  
  

Typing the same menu name in the Menu label will connect this menu to the Mega menu created through the theme editor, as shown in the above snapshots. Also, select the relevant products to display in this Mega menu.

Mega menu with products & gallery block settings

Configure mega menu with products & gallery

• Add the “Mega menu with products & gallery” block.

  

• Add the menu label similar to the first-level navigation added to the Shopify navigation. Adding this same name links the menu with the mega menu. Select the relevant collections and images as per your brand.

  
  

Mega menu with the product list block settings

Configure mega menu with a product list

• Add a “Mega menu with product list” block.

  

• Add menu labels the same way you added any first-level navigation from the Shopify navigation. Adding this name connects the menu to the mega menu. Choose the relevant collection according to the store's brand, and the top 7 product titles will appear in this mega menu.

  
  

Slideshow

This section is used to add a slideshow to your home page. Users can add up to 5 slides. Each slide has its own settings for better visualization and engagement.

Configure the slideshow

1. Go to Customize theme. At the top of the page, click on the dropdown menu to select the Home page template.
2. From the left side menu, select “Slideshow.”
3. Click on the dropdown arrow beside the slideshow section.
4. Click “Add Slide.”
5. Customize this section by using the setting on the right side of the theme editor, as described in the following table.

Block settings

Split slideshow

This section is used to add a split slideshow. Users can add up to 5 slides. Each slide has its own settings for better visualization.

Configure the slideshow

• Go to the Customize theme. At the top of the page, click on the dropdown menu to select the Home page template.
• From the side menu, select Split slideshow.”
• Click on the dropdown arrow beside the slideshow section.
• Click “Add Slide.”
• Customize this section by using the setting on the right side of the theme editor, as described in the following table.

Block settings

News ticker

This section will show important announcements or promotional text in rotating form. With the Yuva theme, text in two rows can be added here.

Configure a news ticker

• Go to the Customize theme. At the top of the page, click on the dropdown menu to select the Home page template.
• From the side menu, select “News ticker.”
• Customize this section by using the setting on the right side of the theme editor, as described in the following table.

Image gallery

This section represents the image gallery. Users can add up to 6 images to the gallery.

Configure the section

1. Go to Customize theme. At the top of the page, click on the dropdown menu to select the Home page template.
2. From the left side menu, select “Image gallery.”
3. Select the arrow beside the Image gallery section.
4. Click “Add Image.”
5. Customize this section by using the setting from the right side of the theme editor as described in the following table.

Block settings

The block settings below are common to all images.

Collection carousel

The Yuva theme offers a collection carousel, where different collections are displayed in slider layouts. Here you can add a maximum of five collections.

The collection list has two styles:

1. Content left, grid right
   
2. Content top, grid bottom
   
   

Configure the collection carousel

1. Go to Customize theme, and at the top of the page, click on the dropdown menu to select the Home page template.
2. From the left side menu, select "Collection carousel."
3. Select the arrow beside it.
4. Click “Add Collection” to add the blocks.
5. Customize this section by using the setting on the right side of the theme editor, as described in the following table.

Block settings

Collection list

The Yuva theme offers a collection list, where different collections are displayed.

Configure the collection list

1. Go to Customize theme, and at the top of the page, click on the dropdown menu to select the Home page template.
2. From the left side menu, select "Collection list."
3. Select the arrow beside it.
4. Click “Add Collection” to add the blocks.
5. Customize this section by using the setting on the right side of the theme editor, as described in the following table.

Block settings

Collection tabs

Yuva theme provides collection tabs that help users to display their three product collections under these tabs. In addition, the Collection tab can be configured using the settings below.

Configure the collection tabs

1. Go to Customize theme. At the top of the page, click on the dropdown menu to select the Home page template.
2. From the left side menu, select "Collection tabs."
3. Select the arrow beside it.
4. Click “Add Collection” to add the tabs.
5. Customize this section by using the setting on the right side of the theme editor, as described in the following table.

Block settings

Featured collection

This section displays products from the selected collection. Customize this section by adjusting the content & number of products to show at once in this slider.

Configure the featured collection

1. Go to Customize theme. At the top of the page, click on the dropdown menu to select the Home page template.
2. From the left side menu, select "Featured collection."
3. Customize this section by using the setting on the right side of the theme editor, as described in the following table.

Featured product

This section shows the best products in the store as a mini page on the front of the store.

Please note that all other blocks except “Text” & “Custom liquid” can be added only once.

Configure featured product

1. Go to Customize theme. At the top of the page, click on the dropdown menu to select the Home page template.
2. From the left side menu, select "Featured product."
3. Customize this section by using the setting on the right side of the theme editor, as described in the following table.

Featured product blocks

It has the following types of blocks:

Add products in the featured product section

To add a product to the featured product section, follow these guidelines:

1. Go to Featured product > Product, choose Select product, and then select one of the following options.
2. To find a product, type the product's name in the Search text box, select product and then click on Select.
3. To create a product, select Create product to open the Add product menu on the Shopify store's admin page.

Modify products in the featured product section

To modify a product in the featured product section, follow these guidelines:

Edit a product’s details

Click on the link shown next to the selected product in the editor. This link opens the product editor on the Shopify store's admin page. Use the editor to modify the product details.

For more understanding, refer to Product details

Change product

Click on Change dropdown, select Change product, and then select one of the following options.

1. To find a product, type the product's name in the Search text box.
2. To create a product, select Create product link to open Add product menu on the Shopify store's admin page and enter products’ details.

For more understanding, refer to Shopify help: Adding and updating products.

1. Select the required product from the list of products, and click on the Select button.

Remove a product from the section

Select the Change dropdown, and then choose Remove product.

Testimonials

This section is used in the form of a slider to add reviews and feedback from happy customers. You can add up to 5 quotes under this section. There are two styles of testimonials:

1. One column
   
2. Two columns
   

Configure the testimonials

1. Go to Customize theme. At the top of the page, click on the dropdown menu to select the Home page template.
2. From the left side menu, select "Testimonials."
3. Click on “Add Quote” to add the blocks.
4. Customize this section by using the setting on the right side of the theme editor, as described in the following table.

Quote settings

The common settings to set up quotes are as follows:

Featured posts

This section shows the list of recent blogs on the home page. Up to 3 posts can be added here. Users can use these blog posts to write about new products, collections, promotions, or other news.

Configure the featured posts section

1. Go to Customize theme. At the top of the page, click on the dropdown menu to select the Home page template.
2. From the left side menu, select "Featured posts."
3. Click on “Add Post to add the blocks.
4. Customize this section by using the setting on the right side of the theme editor, as described in the following table.

Block settings

There is a similar setting for all three blocks -

Countdown with images

This section displays customized images of products or collections on sale at the sales counter.

Configure the countdown with images

• Go to Customize theme. At the top of the page, click the dropdown to select a Home page template.

• From the left side menu, select "Countdown with images."

• Customize this section by using the setting on the right side of the theme editor, as described in the following table.

Text with icons

This section is used to display informational banners. You can add a maximum of 4 blocks under this section.

Configure the text with icons

• Go to Customize theme. At the top of the page, click on the dropdown menu to select the Home page template.

• From the left side menu, select "Text with icons."

• Customize this section by using the setting on the right side of the theme editor, as described in the following table.

Block settings

The common settings for the block having text with icons are:

Image with text

Users can use this section to add one image with text to showcase stories or to show any kind of text content.

Configure the image with the text section

• Go to Customize theme. At the top of the page, click on the dropdown menu to select the Home page template.

• From the left side menu, select "Image with text."

• Customize this section by using the setting on the right side of the theme editor, as described in the following table.

Block settings

It has three types of blocks-

• Heading: Add a title or heading.

• Icon with text

  Icon	Select any icon from the list of icons.
  Heading	Add text to display as a title in the section.
  Description	Enter a suitable description text in the rich text editor.

• Text > Description: Enter a description in the rich text editor.

• Button

  Text	Enter any text to appear as the button text.
  Link	Add link to redirect the button.
  Size	Select from multiple given options to choose the button size.

Multi images with text

Users can use this section to add two images with text to showcase stories or to show any kind of text content.

Configure the image with the text section

• Go to Customize theme. At the top of the page, click on the dropdown menu to select the Home page template.

• From the left side menu, select "Multi image with text."

• Customize this section by using the setting on the right side of the theme editor, as described in the following table.

Block settings

It has three types of blocks-

• Heading: Add a title or heading.

• Text > Description: Enter a description in the rich text editor.

• Button

  Text	Enter any text to appear as the button text.
  Link	Add link to redirect the button.
  Size	Select from multiple given options to choose the button size.

• Images

Rich text

This section is used to add one full-width block of text. There are two types of blocks:

• Text
• Page

Configure the rich text section

• Go to Customize theme. At the top of the page, click on the dropdown menu to select the Home page template.

• From the left side menu, select "Rich text."

• Click on “Add block.”

• Customize this section by using the setting on the right side of the theme editor, as described in the following table.

Text alignment		Select the alignment of the text to the left, right, or center.
COLOR	Background	Select color from the options: Primary Secondary Tertiary Quaternary Gradient Note: These colors can be changed from Theme settings > Colors.
SECTION SPACING	Top spacing (desktop)	Adjust the slider to add spacing at the top of the section on the desktop.
	Bottom spacing (desktop)	Adjust the slider to add spacing at the bottom of the section on the desktop.
	Top spacing (mobile)	Adjust the slider to add spacing at the top of the section on the mobile.
	Bottom spacing (mobile)	Adjust the slider to add spacing at the bottom of the section on the mobile.

Text block settings

Page block settings

Custom liquid

Use the section to add Custom liquid code, like app snippets for creating advanced customizations for your store. We highly recommend hiring an expert in case you’re not comfortable editing Custom liquid code.

For more understanding, refer to Shopify developers: Liquid reference.

Configure the custom liquid section

• Go to Customize theme. At the top of the page, click on the dropdown menu to select the Home page template.

• From the left side menu, select "Custom liquid."

• Customize this section by using the setting on the right side of the theme editor, as described in the following table.

Collapsible content

This section shows the text content in collapsible form like FAQ. A maximum of 6 blocks can be added here.

Configure the collapsible content

1. Go to Customize theme. At the top of the page, click on the dropdown menu to select a template that contains a collapsible content section. For example, select the Home page template.
2. From the left side menu, select Collapsible content.
3. Click the Collapsible row to add a new block.
4. Customize this section by using the setting on the right side of the theme editor, as described in the following table.

Block settings

Map

This section represents the map that can be used to show the store location.

Configure the map section

• Go to Customize theme. At the top of the page, click on the dropdown menu to select a template that contains a map section. For example, select the Home page template.

• From the left side menu, select "Map."

• Configure the section using the following settings:

Map settings

Block settings

It has three types of blocks-

• Heading: Add a title or heading.

• Subheading: Add any text to show as subheading.

• Text > Description: Enter a description in the rich text editor.

• Button

  Text	Enter any text to appear as the button text.
  Link	Add link to redirect the button.
  Show as link	Select this checkbox to show button as a link.

• Text > Description: Enter a description in the rich text editor.

• Button

  Text	Enter any text to appear as the button text.
  Link	Add link to redirect the button.
  Size	Select from multiple given options to choose the button size.

Note: You must add the “Google maps API key” in the theme settings for the maps. To understand how to add the “Google maps API key,” refer to the below description.

Google Maps API key steps

Using API keys:

Google Maps platform products are protected from unauthorized use by limiting API calls to people with the proper authentication credentials. These are in the form of an API key - a unique alphanumeric string that associates a Google billing account with the project and the specific API/SDK.

This guide displays how to create, restrict, and use your API Key for the “Google Maps platform.”

Before you start:

Before you begin using the “Maps JavaScript API,” you need a project with a billing account and the “Maps JavaScript API” enabled. To understand more, see Set up in Cloud Console. 

1. Create a new: “Google cloud project” in the Cloud console: Create new project
2. On the New project display, fill in the required details:
   • Project name: Accept the default name or enter a customized name. You can change the project name at any time. For more information, see Identifying projects.
   • Project ID: Accept the default or click on “EDIT” to add a “Customized ID” that “Google APIs” use as a unique identifier for the project. After users create the project, they cannot change the “Project ID,” so, select an IDthat you'll be comfortable using for the project's lifetime. Do not include any sensitive information in “Project ID.”
   • Billing account: Choose a billing account for the project. You won't see this option if you haven't set up a billing account or only have one.
   • Users must be a “Billing account administrator” or “Project billing manager” to associate a project with the billing account. For more details, refer to the billing access control documentation.
   • Location: If users have an organization to link the project to, click Browse and select it; otherwise, choose "No organization." For more details, check here Creating and Managing Folders and Relationships between organizations, projects, and billing accounts.

3. Click on the Create button.

Creating API keys: 

The API key is a UID (unique identifier), which authenticates all requests associated with the project for usage and the billing purposes. Users must have at least one API key associated with the project.

To create an API key:

• Open “Google Maps platform > Credentials page. For more details, refer to Go to the Credentials page.
• On the Credentials page, click on Create credentials > API key. The API key-created dialog displays your newly created API key.
• Click on the Close button.

Video banner

Use this section to add relevant autoplay videos to your brand to attract customers. Users can add a heading, subheading, and a play button to make it charismatic.

Configure the video banner section

• Go to Customize theme. At the top of the page, click on the dropdown menu to select a template that contains a video banner section. For example, select the Home page template.

• From the left side menu, select “Video banner.”

• Customize this section by using the setting on the right side of the theme editor, as described in the following table.

Promotional banner

This section is used to highlight your promotional deals on the home page, allowing customers to experience exclusivity.

Configure the promotional banner section

• Go to Customize theme. At the top of the page, click on the dropdown menu to select the Home page template.
• From the left side menu, select “Promotional banner.”
• Customize this section by using the setting on the right side of the theme editor, as described in the following table.

Spacer

This section is used to add blank space in between the sections.

Configure the section

• Go to Customize theme. At the top of the page, click on the dropdown menu to select the Home page template.
• From the left side menu, select “Spacer.”
• Customize this section by using the setting on the right side of the theme editor, as described in the following table.

Gallery Carousel

This section shows images in the rotating form.

Configure the section

• Go to Customize theme. At the top of the page, click on the dropdown menu to select the Home page template.
• From the left side menu, select “Gallery carousel.”
• Customize this section by using the setting on the right side of the theme editor, as described in the following table.

Block settings

Collage

This section shows images in a collage.

Configure the section

• Go to Customize theme. At the top of the page, click on the dropdown menu to select the Home page template.
• From the left side menu, select “Collage.”
• Customize this section by using the setting on the right side of the theme editor, as described in the following table.

Block settings

Before/after image

This section is to show transitions using two images.

Newsletter

This section shows newsletter form with added text.

Configure the section

• Go to Customize theme. At the top of the page, click on the dropdown menu to select the Home page template.
• From the left side menu, select “Newsletter.”
• Customize this section by using the setting on the right side of the theme editor, as described in the following table.

Shop the look

This section creates hotspots of products on an image, and each hotspot represents the product.

Configure the section

• Go to Customize theme. At the top of the page, click on the dropdown menu to select the Home page template.
• From the left side menu, select “Shop the look.”
• Customize this section by using the setting on the right side of the theme editor, as described in the following table.

Block settings

Images grid

This section shows the grid of three images with text.

Configure the section

• Go to Customize theme. At the top of the page, click on the dropdown menu to select the Home page template.
• From the left side menu, select "Images grid."
• Customize this section by using the setting on the right side of the theme editor, as described in the following table.

Block settings

• Image: Select any image to show in the grid.

Tabbed collage

This section shows the product and media in the collapsible form.

Configure the section

• Go to Customize theme. At the top of the page, click on the dropdown menu to select the Home page template.
• From the left side menu, select "Tabbed collage."
• Customize this section by using the setting on the right side of the theme editor, as described in the following table.

Block settings

Media

Product

Lookbook

This section shows multiple looks and associated products.

Configure the section

• Go to Customize theme. At the top of the page, click on the dropdown menu to select the Home page template.
• From the left side menu, select "Lookbook."
• Customize this section by using the setting on the right side of the theme editor, as described in the following table.

Block settings

Look

Note: This products grid does not support quick view, similar products and custom product labels.

Footer

This is the bottom part of your web store. Use it to share brief information about your store and add navigation menus to help users navigate the web store quickly.

Configure the footer

• Go to Customize theme. At the top of the page, click on the dropdown menu to select the Home page template.
• From the left side menu, select Footer.
• Customize this section by using the setting on the right side of the theme editor, as described in the following table.

Three types of blocks are available to customize the footer.

Menu -

Three types of blocks are available to customize the footer.

Menu block settings

Text-

This text block can be used to show the brand story or any promotional text in the footer.

Text block settings

Newsletter-

This block adds a newsletter with the social icons in the footer section. Please note that the newsletter block in the footer can be added only once.

Newsletter block settings

Configure the footer menu

• Go to Customize theme. Click on the top dropdown menu to select the Home page template.
• From the left side menu, expand the Footer section and click on Add block > Menu.

To use an existing menu, click on the Select menu. Type the menu’s name in the Search text box, or pick a menu from the list, and then choose Select menu.

To create a new menu, click on the Select menu, and then click on the Create menu link. The link opens the Navigation > Add menu editor in the Shopify store’s admin page. Use the editor to create a new menu and save it.

For more understanding, refer to Shopify help: Add, remove or edit menu items in your online store.

Sidebar offer

This section represents the discounts offered by the merchants, which are displayed on the sides. You can create up to four offers.

Configure the offer

1. Go to Customize theme. At the top of the page, click on the dropdown menu to select the Home page template.
2. From the side menu, select Sidebar offer.
3. Customize this section by using the setting on the right side of the theme editor, as described in the following table.

Block settings

The block settings below are common to all offers.

Theme settings

This section is used to customize the Yuva theme for your Shopify store.

Configure the theme settings

• Go to Customize theme. At the top of the page, click on the dropdown to select the Home page template.
• Click on Theme Settings at the bottom to access theme-wide settings. Settings include:

1. Color:From here, you can select the colors you want to use throughout the theme. The following settings can be changed through this main setting:

   Primary color

   • Base - Select any color for the theme color.
   • Background- Select any color for the store background.
   • Text - Select any color for the text used in the theme.
   • Headings - Select any color for the headings.
   • Button background - Select any color for the background of the first buttons, like “Add to cart.”
   • Button text-Select any color for the text of buttons.
   • Button border- Select any color for the border of buttons.
   • Image background - Select any color for the background of images.
   • Image border- Select any color for the border of images.
   • Saved amount background - Select any color for the background of the “Saved amount” badge.
   • Saved amount text - Select any color for the text of the “Saved amount” badge.
   • Cart indicator - Select any color for the cart indicator that appears when you add a product to the cart.
   • Browser notification background-Select any color for the browser tab notification’s background that appears when users add a product to the cart.
   • Browser notification text-Select any color for the browser tab notification’s text that appears when users add a product to the cart.

   Sale badge

   • Background- Select any color for the background color of sale badges.
   • Text- Select any color for the text color of sale badges.

   Sold out badge

   • Background- Select any color for the background color of sold out badges.
   • Text- Select any color for the text color of sold out badges.

   Secondary Color

   • Background: Select any color as the background color in the Secondary color scheme.
   • Text - Select any color for the text used in the theme.
   • Headings - Select any color for the headings.
   • Button background: This setting is for the background color of the second button where two buttons appear side by side, such as "Add to Cart and Buy Now" and "Save and Cancel."
   • Button border- Select any color for the border of second buttons, like "“Buy Now.”
        

   Tertiary

   • Background-Select any color for the section’s background.
   • Text - Select any color for the text used in the theme.
   • Headings - Select any color for the headings.

   Quaternary

   • Background-Select any color for the section’s background.
   • Text - Select any color for the text used in the theme.
   • Headings - Select any color for the headings.

   Gradient

   • Background-Select any gradient color for the section’s background.
2. Typography: From here, you can make font-related customizations using different options.

Headings	Font Font size scale Letter spacing Line height Text transform	Select the font of the heading text. Adjust the base size for headings used in all sections. Select the spacing between letters in the heading. Adjust the line height for headings used in all sections. Select from Uppercase or Capitalize to display the headings.
Headings	Font Letter spacing Font size scale Line height	Select the font of the body content. Select the spacing between letters in the body. Adjust the base size for product titles, product descriptions, collection descriptions, blog posts, and footer. Choose line height for product description, collection description, blog post, and footer.
Others	Navigation Buttons Tab heading Filters heading	Select the required font set on Headings or Body Select the required font set on Headings or Body Select the required font set on Headings or Body Select the required font set on Headings or Body

3. Layout:
   1. Layout style-Select from Rounded or Sharp to show the edges of all boxes used in all sections.
   2. Layout width- Select from Boxed or Full width to change the sections container.
4. Animation: Enable animation-Select this checkbox to enable/disable the animation on all sections.
5. Buttons:
   1. Border radius- Adjust the slider to set the buttons radius.
   2. Animation direction- Select from the options to display the required animation on the buttons.
6. Images: Use the below settings for the images styling.

Enable lazyload		Select checkbox to enable/disable the images lazyload. Note: We recommend you to enable the lazy loading forever as unchecking this may impact your store speed.
Product		Select the relevant image ratio from options: Auto Landscape (4:3) Portrait(3:4) Square(1:1)
Product grid image size		Select from Natural or Cropped to choose the relevant image size.
Collection		Select the relevant image ratio from options: Auto Landscape (4:3) Portrait(3:4) Square(1:1)
Post		Select the relevant image ratio from options: Auto Landscape (4:3) Portrait(3:4) Square(1:1)
Grid image border	Product	Select this checkbox to show/hide borders around product images.
	Collection	Select this checkbox to show/hide borders around collection images.
	Post	Select this checkbox to show/hide borders around blogs images.

7. Social: Use this setting to link your Shopify store to your social media handles.

Facebook	Add the link to your “Facebook” handle.
Twitter	Add the link to your “Twitter” handle.
LinkedIn	Add the link to your “LinkedIn” handle.
Instagram	Add the link of your “Instagram” handle.
Pinterest	Add the link to your “Pinterest” handle.
Snapchat	Add the link to your “Snapchat” handle.
TikTok	Add the link to your “TikTok” handle.
Tumblr	Add the link to your “Tumblr” handle.
YouTube	Add the link to your “YouTube” handle.
Vimeo	Add the link of your “Vimeo” handle.

8. Search: Customize search results using the following settings:

Enable suggestions	Select the checkbox to show/hide the search suggestions in search results.
Enable articles in results	Select the checkbox to show/hide the articles tab in search results.
Enable pages in results	Select the checkbox to show/hide the pages tab in search results.

9. Cart drawer: Customize the look and feel of the cart drawer using the following settings:

Enable cart drawer	Select the checkbox to show/hide the cart drawer in your store.
Enable browser notification	Select this checkbox to show/hide the browser notification of added items in the cart. Note: This browser notification shows the cart items count only & it works with chrome and firefox browsers only. Also, users must enable the cart drawer to show this count.
Enable cart note	Select this checkbox to show/hide the cart note text field in the cart drawer.
Gift wrap> Product	Select ay product to add as a gift wrap product in the cart drawer & page.
Gift wrap>Text	Enter any text to appear as gift wrap text. This text displays on the cart drawer & page.
Enable shipping bar	Select this checkbox to enable/disable the shipping bar on the cart drawer. Note: This feature only works with a shipping method. If you're using multiple shipping methods, it might show false values to the customer.
Minimum shipping price	Type any price for providing free shipping to the customers. After reaching this price, the user will be shown a success message. Note: Users must write a number, no letters or special characters.
Message	Type any relevant message to notify users about the amount saved in this field. Note:Use ||amount|| to display the amount within the message.
Success message	This is to show the success message after the user has reached the minimum shipping price.

10. Breadcrumbs: Merchants can show or hide the breadcrumbs from the storefront using this setting.

Enable breadcrumbs

Select the checkbox to show/hide the breadcrumbs of the page on the store.

11. Product: Using these settings, you can customize your product listings on your Shopify store.

Enable preorder	Select the checkbox if you want to allow users to pre-book any product. For this option, you must ensure that the "Continue Selling Out of Stock" is checked for a product that is not in stock at that moment. This setting can be checked from the Shopify products page.
Option style	Select from the dropdown style in which you want your product listings to appear. Options include dropdown and swatch.
Color options name	Enter the option name that holds the colors. E.g.: Color, Colour, Material, etc.
Size options name	Enter the option name that holds the sizes. E.g.: Size, Measure, etc.
Color swatch style	Choose from the dropdown style in which you want to show your color swatch style. Circle swatches Square swatches Follow the below procedure to set up custom color swatches: Upon logging in, navigate to your Shopify dashboard and pick the Online Store > Themes tab. When you click the Action button, a tiny drop-down box will appear. Press Edit code. You are now on the page for the template editor. Go to the Assets folder → Add a new asset. Repeat the above steps to upload the images for your color swatch. Rules to follow for image upload for color swatch:- Size: You must upload an image with a size of roughly 50 × 50 pixels. Extension: There must be a “.png extension.” Naming conventions: The image's name must reflect the color option and be all lowercase with no spaces. Here is a collection of examples:- If your color is "Light Blue," upload the image with the filename light-blue.png. If your color is "Blue/Gray," upload the image with the filename blue-gray.png. If your color is "Blue," upload the image with the filename blue.png.
Show color option as variant image	Select this checkbox to display product variants as images, not colors. For this to work, users need to add variant images from the Shopify products page. Refer to Product details.
Show saved amount	Select this checkbox to display the saved amount badge.
Saved amount style	Choose from the dropdown how you want the saved amount to be displayed as a percentage or amount.
Options font family	Select the required font set on Headings or Body in Typography settings.
Price font family	Select the required font set on Headings or Body in Typography settings.
Option title text transform	Select from Uppercase or Capitalize to display the variant’s titles.

12. Product grid: Manage the look and feel of product grids using the following settings.

    Enable quick view	Select this checkbox to show/hide a quick view icon on the products.
    Enable badges	Select this checkbox to show/hide badges on the products.
    Enable similar products	Select this checkbox to show similar product icons on products. Note: This similar products work on the basis of Shopify filters. Users must enable filters to use this feature properly.
    Show similar button text on hover	Select this checkbox to “show similar button text on hover” instead of icons on products.
    Similar product based on	Select from the following options: Same vendor and product type-This shows similar products having the same vendor and product type saved in Shopify products. Product type-This shows similar products having the same product type saved in Shopify products. Vendor-This shows similar products having the same vendor saved in Shopify products. Note: This setting is based on Shopify filters, so users must enable the product type and vendor filters to use the similar products feature properly.
    Show vendor	Select this checkbox to show vendor/brand name in the product grids.
    Enable Add to cart	Select this checkbox to show the “Add to cart” icon on products. Note: The “Add to cart” icon will appear if the product has a single variant. However, if the product has multiple variants, the icon will not be visible.
    Show product price	Select this checkbox to show/hide the price of products.
    Show reviews	Select this checkbox to show/hide reviews of products.
    Action on product image hover	Select “None,” “Carousel,” or “Second image” to show on hover of the product image.
    Enable auto slide	Select this checkbox to enable/disable auto slide on products. Note: This works only if the Carousel is saved in “Action on product image hover.”
    Content alignment	Select from “Left, Center, or Right,” to show the product grid’s content.
    Product labels 1-4	Enter product labels like custom.product_label setup from the store settings and then product page metafields. For more information related to meta fields, check the below details.

    Firstly, the metafields needed to be setup in the Store settings> Custom data>Products>Product metafield definitions:

    

    Then add the metafield definitions inside Theme settings > Product Card > Product labels:

    

    Now add these custom label names in the theme settings>Product grid>Product labels as below:

    

    The product labels will show like this:

    
13. Newsletter popup: Manage the look and feel of your newsletter pop-ups using the following settings:

Enable newsletter popup	Select the checkbox to display a newsletter pop-up on the storefront.
Image	Select an image for your newsletter section.
Heading	Add text to display as a title on the “Newsletter pop-up” section.
Description	Add text to display as a brief about the newsletter section.
Show social icons	Select this checkbox to show/hide social icons on the newsletter.
Set cookie for newsletter popup (days)	Set the time (days) for which you want the cookies to expire. For example, if you set the time as two days, and the user closes the newsletter popup or submits their email for subscription, after two days, the popup will reappear on the storefront for that user.
Colors	Heading Description Popup background Button background Button text Button border	Select any color for the heading text of the newsletter pop-up Select any color for the description text of the newsletter pop-up. Set the background color of the newsletter pop-up. Select any color for the button background of the newsletter pop-up. Select any color for the button text of the newsletter pop-up. Select any color for the button border of the newsletter pop-up.

14. Age verification popup: This will display a popup blocking the store from visitors until they click approve button.

Enable age verification popup	Select the checkbox to display the age verifier pop-up on the storefront.
Age verification title	Enter any text to show as the title.
Heading	Add text to display as a heading on the popup.
Sub-heading	Add text to display as a brief about the age verifier.
Approve button text	Add text to display as approve button text on the age verifier.
Decline button text	Add text to display as decline button text on the age verifier.
Under 18 title	Add text to display on the under 18 popup as a title.
Under 18 description	Add text to display on the under 18 popup as a description.
Decline button text	Add text to display as decline button text on the under 18 popup.
Set cookie for age verification popup(days)	Set the time (days) for which you want the cookies to expire. For example, if you set the time as two days, and the user approves the age verifier popup, after two days, the popup will reappear on the storefront for that user.

15. Cookie privacy banner: For the privacy banner to work, users must first activate customer privacy from Shopify admin Online store > Preferences > Customer privacy.

Enable privacy banner	Select this checkbox to enable the privacy banner, which appears at the bottom of the displays.
Description	Enter text to display as the description on the privacy banner.
Accept button text	Add text to show as approve button text on the privacy banner.
Decline button text	Add text to display as descline button text on the age verifier.

16. Favicon: These are tiny icons that appear in browser tabs, address bars, and bookmarks menus near your site's url or title. Users can upload favicon icons by clicking on the Change button under the favicon setting.

    Please note that an image size of 16 x 16px (pixels) is recommended.

17. Scroll to top: This setting enables/disables and shows/hides the text. It is also used to add custom “SVG code” to add a custom "Scroll to top" button to your site.

Enable	Select this checkbox to enable the “Scroll to top” icon.
Show text	Select this checkbox to display "Scroll to top" on the icon.
Show background color	Select this checkbox to show/hide the background color of the icon.
SVG code	Enter “SVG code” to show a custom icon. Please note that ‘SVG’ should have width and height attributes.
Position	Select any required position from Left, Center & Right to display the scroll to top icon.

18. Google Maps API Key: This setting is for adding the Google maps API key for the Maps section to function correctly. To learn the way to get the “Google maps API key,” please check this tutorial.
19. Checkout With these settings, you can change the look and feel of the checkout page.

Banner	Background image	Upload a background image for the checkout banner section. Image size of 1000 x 400px (pixels) is recommended.
Logo	Custom image Position Logo size	Add your brand’s logo to the banner section. Set the logo's position to center, left, or right. Choose any logo size, whether to keep it small, medium, or large.
Main content area	Background image Background color Form fields	Upload a background image for the main body section. Choose any background color for your main body section. Choose from the drop-down menu how you want your form field to appear.
Main content area	Background image Background color	Upload a background image for the “Order summary” section. Choose the background color of your “Order summary” section.
Typography	Headings Body Accents Buttons Errors	Choose the desired font for the headings. Choose the desired font for the body content. Choose the color for accents on the checkout page. Choose the color for buttons on the checkout page. Set the color to show errors (if any) on the checkout page.

Template-Collection list

This page will automatically list all the current collections in your store. By default, all collections will be listed alphabetically.

• Go to Customize theme. At the top of the page, click on the dropdown menu to select a collection list template.
• From the left side menu, select “Collections list page.”
• Click on “Add Collection” to add collection blocks.
• Customize this section by using the setting on the right side of the theme editor, as described in the following table.

For each collection added to this page, use the following settings:

Template-Main collection (Catalog)

This page will list all the products in your collection list. Users can choose to sort or filter the product listings on this page using various options.
Note: Please make sure the section- Main collection is not hidden, otherwise the collection products will stop showing.

• Go to Customize theme. Click on the top dropdown menu to select Collection > Default collection template.
• From the menu on the left, select "Main collection."
• Customize this section by using the setting on the right side of the theme editor, as described in the following table.

Template-Default product

The Default product page allows you to add shape and control the appearance of products.

• Go to Customize theme. Click on the top dropdown menu to select the Products > Default product template.
• From the left side menu, select “Product page.”
• Customize this section by using the setting on the right side of the theme editor, as described in the following table.

Gallery style		Select any different style from the drop-down menu to display product media on the product page. Options are Carousel Grid List
Show product description		Select this checkbox to show/hide the product description on the page.
Enable variant based media		Select this check box to show variant based images on the product page gallery. For this to work, users need to add text in the Alt text of product images as same as the color option name without any extra spaces. For example color option is In the alt text it should be Also, this image should be attached to the respective variant in the product details as below:
Dividers on mobile		Select from the options to show dividers on mobile. Options include None Small Medium Large
CAROUSEL	Desktop height	Select the most relevant height of the image for desktop view. Its options include: 600px 700px 800px Adapt to first slide
	Mobile height	Select the most relevant height of the image for mobile view. Its options include: 400px 500px 600px Adapt to first slide
Content	Position	Select from values to show product content in different positions like full width or sidebar. Please note that this is not applicable to the Carousel gallery style.
	Style	Select from values to show product content in different styles, such as tabs or accordions. Please note that this is not applicable to the Carousel gallery style.
	Alignment	Select from Left, Center, or right to display the content in that alignment. Note: This is applicable to Tabs style only.
Custom content	Heading	Enter text to display as a title in the new tab next to the product description.
	Description	Enter text to display as a description under the heading as added above.
	Tab2	Enter text to display as a title in the tab two next to the product description.
	Description	Enter text to display as a description under the tab two as added above.
	Tab3	Enter text to display as a title in the tab three next to the product description.
	Description	Enter text to display as a description under the tab three as added above.

It has the following types of blocks:

Recommended products

If a customer redirects to a product page from your store, related products will be shown in the product recommendation section.

Note - The “Product recommendation” section is only available on the default product and feature pages.

• Go to Customize theme. At the top of the page, click on the dropdown menu to select the Products > Default product template.
• From the left side menu, select “Product recommendations.”
• Customize this section by using the setting on the right side of the theme editor, as described in the following table.

Recently viewed products

This section shows the products visited recently by the visitors. This section remains hidden on storefront in case no products have been visited.

Template - Default blog

This page lists the blogs published on your website. The page will show your blogs in chronological order - based on the published date.

• Go to Customize theme. At the top of the page, click on the dropdown menu to select the Blog posts > Default blog posts template.
• From the left side menu, select “Blog posts.”
• Customize this section by using the setting on the right side of the theme editor, as described in the following table.

To understand more about blogs, please refer to Shopify blog posts.

Template - Default blog post

This is the page where published blogs can be viewed and read.

• Go to Customize theme. At the top of the page, click on the dropdown menu to select the Blog posts > Default blog posts template.
• From the left side menu, select “Blog post.”
• Customize this section by using the setting on the right side of the theme editor, as described in the following table.

To understand more about blog posts, please refer to Shopify blog posts.

Template-Cart

This page shows all the products that the customers choose to buy.

• Go to Customize theme. Click on the top dropdown menu to select the Cart template.
• Click on the “Main cart” from the left side menu.
• Customize this section by using the setting on the right side of the theme editor, as described in the following table.

Template-Password

These are the settings to customize the password page.

• Go to Customize theme. Click on the top dropdown menu to select the Others > Passwordtemplate.

• Click on the “Password page” from the left side menu.

• Customize this section by using the setting on the right side of the theme editor, as described in the following table.