Menu:

To add menu items to your menus, perform the following steps:

• In your Shopify admin panel, go to "Online Store" and then "Navigation."
• Click on the menu to which you want to add items.
• Click on the "Add menu item" button.
• Enter a name for the menu item in the "Name" field.
• Specify the destination URL for the menu item in the "Link" field.
• Optionally, you can set the item as a dropdown by selecting a parent menu item from the "Parent item" dropdown list. 
• Click on "Save menu" to add the menu item.

Organizing Menu Items

To organize and rearrange menu items within a menu, follow these steps:

• In your Shopify admin panel, navigate to "Online Store" and then "Navigation."
• Click on the menu you want to organize.
• Drag and drop the menu items to rearrange their order.
• If you want to create a nested menu (submenu), drag a menu item slightly to the right and drop it below another menu item. It will become a child item or submenu.
• Click on "Save menu" to save the changes.

Linking Menus to Your Store

After creating and customizing your menus, you need to link them to your store's theme locations. To link a menu to a specific location, follow these steps:

• In your Shopify admin panel, go to "Online Store" and then "Navigation."
• Click on the menu you want to link.
• Click on the edit button .

In your Shopify admin panel, navigate to "Online Store" and then "Navigation."

Adding Menu Items

To add menu items to your menus, perform the following steps:

• In your Shopify admin panel, go to "Online Store" and then "Navigation."
• Click on the menu to which you want to add items.
• Click on the "Add menu item" button.
• Enter a name for the menu item in the "Name" field.
• Specify the destination URL for the menu item in the "Link" field.
• Optionally, you can set the item as a dropdown by selecting a parent menu item from the "Parent item" dropdown list. 
• Click on "Save menu" to add the menu item.

Organizing Menu Items

To organize and rearrange menu items within a menu, follow these steps:

• In your Shopify admin panel, navigate to "Online Store" and then "Navigation."
• Click on the menu you want to organize.
• Drag and drop the menu items to rearrange their order.
• If you want to create a nested menu (submenu), drag a menu item slightly to the right and drop it below another menu item. It will become a child item or submenu.
• Click on "Save menu" to save the changes.

Linking Menus to Your Store

After creating and customizing your menus, you need to link them to your store's theme locations. To link a menu to a specific location, follow these steps:

• In your Shopify admin panel, go to "Online Store" and then "Navigation."
• Click on the menu you want to link.
• Click on the edit button .

How to Customize Menu

To customize the menu in Shopify themes, follow the steps below:

• Step 1: Access the Theme Editor Log in to your Shopify admin panel and navigate to "Online Store" and then "Themes." Find the theme you want to customize and click on the "Customize" button. This will launch the Theme Editor.
• Step 2: Navigate to the Menu Settings In the Theme Editor, look for the section related to the menu. It may be labeled as "Header," "Navigation," or "Menu." Click on it to access the menu settings.
• Step 3: Add a New Menu If you want to create a new menu, click on the "Add a menu" button. Give your menu a name and save it.
• Step 4: Configure the Menu Structure Once you have created a menu, you can start adding menu items. You can add links to pages, collections, products, or external URLs. In the menu settings, you'll find an option to add a menu item. Click on it and provide the necessary information such as the name, URL, and link type. Repeat this step for each menu item you want to add.
• Step 5: Organize the Menu To organize the menu items, you can use drag and drop functionality. You can move the menu items up or down to change their order or nest them under other menu items to create sub menus.
• Step 6: Customize Menu Appearance Depending on your theme, you may have options to customize the menu's appearance. Look for settings related to colors, fonts, spacing, and layout. Use these options to match the menu with your desired design.
• Step 7: Save and Publish After customizing the menu, make sure to save your changes. If you are satisfied with the modifications, click on the "Publish" button to apply the customized menu to your live store.
• Step 8: Preview and Test Before finalizing the changes, it's a good idea to preview your store to see how the customized menu looks on different devices and screen sizes. Additionally, test the menu by clicking on each link to ensure they navigate to the intended pages.

Filters:

- Shopify search & Discovery (app installation)

Installation :

Log in to your Shopify admin panel

From the Shopify admin dashboard, click on the "Apps" tab located in the left-hand sidebar.

In the Apps section, click on the "Visit Shopify App Store" button to access the Shopify App Store.

In the search bar at the top, type "Shopify Search and Discovery" and press Enter or click the search icon.

Look for the "Shopify Search and Discovery" app in the search results and click on it to view the app details.

Review the app's features, pricing, and ratings to ensure it meets your requirements. If you're satisfied, click the "Add app" button.

Follow the on-screen instructions to install the app and grant necessary permissions.

Once the app is installed, return to your Shopify admin panel.

Implementation :

Log in to your Shopify admin panel.

From the Shopify admin dashboard, click on the "Online Store" tab located in the left-hand sidebar.

In the Online Store section, click on the "Navigation" tab.

On the Navigation page, scroll down to the "Collection and search filters" section.

Look for the Shopify Search and Discovery option and click on the "Open" or "Configure" button next to it.

This will open the settings or configuration panel for the Shopify Search and Discovery app.

Within the app settings, you should find options to manage and configure the filter options.

Depending on the capabilities of the app, you may be able to customize various filter attributes such as tags, product properties, collections, price ranges, etc.

Configure the desired filter options according to your store's needs. You can enable/disable specific filter attributes, rearrange their order, or set other preferences provided by the app.

Save your changes within the Shopify Search and Discovery app.

Once you have configured the filter options, they should be automatically integrated into your store's search and discovery functionality, and customers will be able to use them to refine their product searches.

Store Page > Sales Channel(left hand side) > Navigation

For “Collection” pages, collections can be filtered using various options, these options can be added from the above section. The “Shopify Search & Discovery” app needs to be downloaded to enable this feature. 

Once at this page, click the “Open” button next to “Shopify Search & Discovery”

you will then arrive at the “Search & Discovery” dashboard, scroll down to the “Customize collection and search filters” and click the “View Filters” button. then click “Edit Filters”

add the required filters by selecting the check boxes and click “Save” button.

Color Swatches: (metafield)

Adding color variant :

• Log in to your Shopify admin panel.
• From the Shopify admin dashboard, click on the "Settings" tab located at the bottom left.
• In the Settings section, click on the "Custom Data" tab.
• Under the Custom Data tab, click on the "Variants" section.
• Click on the "Add definition" button to create a new custom variant definition.
• Now, to add a color variant for products, follow these steps:

1. In the "Definition Name" field, enter a name for the variant (e.g., "Color").
2. Set the "Type" as "Color" by selecting it from the drop down menu.
3. Namespace & key must be written as “color.value”
4. Select “One value” option. 
5. Save the changes by clicking the "Save" button.

Store page > Products(left hand side) > click on a product > scroll down to “Options” section > (if options not enabled, click “This product has options, like size or color” to enable options) > Give “Option Name” as “Color”(spelt correctly) and add color options. 

Using drag toggle on left hand side, place “Color” option at the bottom below all other options.

Colors need to be added for each variant, to add color swatches click “Edit” button on a variant

Once at the variant page, scroll down to the “Meta-fields” tab to add the color code. This needs to be done for each and every variant to render color swatches on the “Single Product” page/section.

Newsletter Modal

The Newsletter Modal can be enabled in the ‘Pop Up Modal’ Section available in the Sections Customizer.

Variant Images

To enable Variant Images in  ‘Single Product Section’ slider, navigate to Store Dashboard > Products > (Your Product) > Variants Tab > Edit Variant > Options Tab to add Variant Featured Image

Accelerated Checkout

To enable accelerated checkout navigate to Store Dashboard > Settings > Payments Tab(left panel) > Enable a third party payment option(requires financial details) & add ‘Additional payment methods’

Adding pickup and delivery details :  (store settings)

Log in to your Shopify admin panel.

From the Shopify admin dashboard, click on the "Settings" tab located at the bottom left.

In the Settings section, click on the "Shipping and Delivery" tab.

On the "Shipping and Delivery" page, you will find options to manage your shipping and delivery settings. Follow these steps to set up local delivery and local pickup:

Setting up Local Delivery:

• Under the "Local Delivery" section, click on the "Manage" button.
• In the Local Delivery settings, you can configure the following details:
• Delivery pricing: Set the delivery fee or choose to offer free delivery.
• Delivery area: Define the specific regions or postal codes where local delivery is available.
• Delivery schedule: Specify the days and time slots when local delivery is available.
• Delivery instructions: Add any additional instructions or policies related to local delivery.
• Customize the settings based on your business requirements.
• Save the changes by clicking the "Save" button.
• Setting up Local Pickup:
• Under the "Local Pickup" section, click on the "Manage" button.
• In the Local Pickup settings, you can configure the following details:
• Pickup instructions: Add any instructions or policies related to local pickup.
• Pickup locations: Specify the locations where customers can pick up their orders.
• Customize the settings based on your business requirements.
• Save the changes by clicking the "Save" button.
• After completing these steps, your local delivery and local pickup settings will be configured in your Shopify store. 

How To Access the Customizer ?

Access the Customizer: Start by logging into your website's admin panel. From the dashboard, navigate to "Themes" and then select "Customize". This will open up the theme customizer.

Header and Footer

Uploading a Logo for Header from Theme Settings:
(Logo must be .svg or .png file)

Navigate to Theme Settings: Inside the customizer, you'll find a list of customization options on the left-hand side. Look for or click on the "Logo" section. Select Logo option.

Upload Logo for Header: Under the logo settings, you'll likely find an option for the header logo. Click on the "Logo Header" to upload the logo for header. 

Save Changes and Preview: Once you're satisfied with the header logo setup, click the "Save" button to save your changes and preview. 

Header Customization:

• Choose Header Styles:Select between "Center aligned logo" or "Left aligned logo" for the placement of your store's logo in the header.
• Top Bar Active (checkbox):Enable this option if you want to include a top bar section for social icons and a language translator.
• Currency Wrapper Background Color:Set the background color for the currency wrapper in the header.
• Select Menu for Navigation:Choose the specific menu that you want to use for navigation in your store.
• Menu Link Colors:Define the colors for the links in the menu.
• Mega Menu Blocks:Within the header, you can add blocks to the mega menu. These blocks may contain various types of content like images, collections, or articles.
• Mega Menu Customization:Assign Mega Menu to a Menu Item For each menu item, you can choose to enable the mega menu. Options include "First," "Second," "Third," etc.
• Menu Label:Specify the label for the menu item that will trigger the mega menu when hovered over.
• Mega Settings:Configure settings related to the mega menu.
• Featured Collection:Select a collection to feature in the mega menu.
• Menu Image:Upload images that you want to include in the mega menu.
• Menu Image Link:Define the link or destination for the images in the mega menu.
• Block Type:Choose between "Collection" or "Article" for the content you want to display in a particular block of the mega menu.
• Mega Menu Collection:If you select "Collection" as the block type, choose the specific collection you want to feature.
• Mega Menu Article:If you select "Article" as the block type, choose the specific article you want to feature.

Uploading a Logo for Footer from Theme Settings:
(Logo must be .svg or .png file)

Navigate to Theme Settings: Inside the customizer, you'll find a list of customization options on the left-hand side. Look for or click on the "Logo" section. Select Logo option.

Upload Logo for Header: Under the logo settings, you'll likely find an option for the footer logo. Click on the "Logo Footer" to upload the logo for header. 

Save Changes and Preview: Once you're satisfied with the header logo setup, click the "Save" button to save your changes and preview.

Footer Menu :

Footer Customization:

Footer Style:

Toggle between "Footer Style One" and "Footer Style Two" to select the desired footer layout.

Footer Style One Options:

If you choose "Footer Style One," you'll have the following customization options:

• a. Menu 1 Title:Specify a title for the first menu in the footer.
• b. Assign Footer Menu 1:Choose the specific menu you want to assign to Menu 1 in the footer.
• c. Menu 2 Title:Specify a title for the second menu in the footer.
• d. Assign Footer Menu 2:Choose the specific menu you want to assign to Menu 2 in the footer.
• e. Footer Menu List:Within the footer, you can add blocks to the footer menu list. These blocks may contain various types of content like product types, page links, collections, social links, product tags, currency & region.

Footer Menu List Customization:

Menu List Title:

Give a title to the menu list block.

Footer Menu Type:

Choose the type of content you want to include in the menu list block. Options include product types, page links, collections, social links, product tags, product type, currency & region.

Menu Links:

Define the links that belong to the selected menu type.

Collection List:

If you choose "Collections" as the menu type, select the specific collection list you want to include.

Collection:

Specify the collection you want to feature.

Number of Links:

Define the number of links you want to display for the selected menu type.

Theme Settings

Navigate to Theme Settings: Inside the customizer, you'll find a list of customization options on the left-hand side. Look for or click on the "Layout" section. Select Layout option.

Choose Container Layout: In the Layout section, you will find an option that specifies the current layout. It might be set to one of the layouts “Boxed Layout” or “Fluid Layout”. Select the desired layout you want to switch to.

Save Changes and Preview: Once you're satisfied with the theme layout setup, click the "Save" button to save your changes and preview. 

 - Typography :
Navigate to Theme Settings: Inside the customizer, you'll find a list of customization options on the left-hand side. Look for or click on the "Typography" section. Select Typography option.

Headings Font Family: Within the "Typography" section, find the ‘Heading’ section for customizing the font family used for headings. Choose Font Family according to your preferences by selecting a font family from a list of available fonts.
Below the font family selection, you'll likely find separate options for adjusting the font sizes of page title, section title etc. . This allows you to control the relative font sizes for different levels of headings. Adjust the font size using the provided input field to set the desired font sizes for your headings.

Body Font Family: Within the "Typography" section, find the ‘Body’ section for customizing the font family used for body text. Choose Font Family according to your preferences by selecting a font family from a list of available fonts.

Below the font family selection, you'll likely find separate options for adjusting the font sizes of body text and caption text etc. This allows you to control the font size for body text. Adjust the font size using the provided input field to set the desired font size.
Save Changes and Preview: Once you're satisfied with the font settings applied to the theme, click the "Save" button to save your changes and preview. 

- Colors :
Navigate to Theme Settings: Inside the customizer, you'll find a list of customization options on the left-hand side. Look for or click on the "Colors" section. Select Colors option.

Choose a Color Scheme: In the "Colors" section, you'll see a list of predefined color schemes. The theme allows customization of individual color elements.
Browse through the available color schemes to see how they change the appearance of different elements on the website.The theme allows for more granular customization, to change specific color elements. These could include background colors, text colors, link colors, button colors, and more. Click on the relevant option to make adjustments. The theme offers a color picker, click on it to open the color selection tool. Use the color wheel, sliders, or input fields to choose your preferred colors. You can also enter specific color codes (hex, RGB, etc.) if you have a particular color in mind.

Save Changes and Preview: Once you're satisfied with the color scheme applied to the theme, click the "Save" button to save your changes and preview.

- Buttons :
Navigate to Theme Settings: Inside the customizer, you'll find a list of customization options on the left-hand side. Look for or click on the "Buttons" section. Select Buttons option.

Locate Secondary Button Style:  Inside the customization interface, look for the section labeled "Secondary Button Style". Open the Drop-down: In the "Secondary Button Style" section, you'll find a drop-down menu labeled "Style 1" and "Style 2". Choose a style, select either "Style 1" or "Style 2" based on your preference. The chosen button style will be applied throughout your theme.
Also, there are other CSS customization available for border thickness, corner radius, button opacity and button shadow properties.
Save Changes and Preview: Once you're satisfied with the button styles, click the "Save" button to save your changes and preview. 

- Search :
Navigate to Theme Settings: Inside the customizer, you'll find a list of customization options on the left-hand side. Look for or click on the "Search" section. Select Search option.

Search Results Customization: Inside the customization interface, look for the section labeled "Search only". This section is where you'll be able to configure how search results are displayed.

Within the "Search only” section, you'll come across a dropdown menu. This dropdown menu offers various options for refining search results. The options are as follows:

• "Product"
• "Product and Pages"
• "Product and Articles"
• "Product, Articles and Pages"

Click on the drop-down to reveal the available options. Select the option that best matches what you're searching for. The options provided in the drop-down determine the scope of search results you'll see.

Understanding Drop-down Options:

Product: Selecting this option will narrow down search results to show only product-related content.

Product and Pages: This option will display search results that include product-related content as well as pages on your website.

Product and Articles: Choosing this option will show search results containing product-related content and articles.

Product, Articles and Pages: This option provides the broadest search scope, including product-related content, articles, and regular pages.
Save Changes and Preview: Once you're satisfied with the results, click the "Save" button to save your changes and preview.

Perform a search to see how the chosen scope of results affects what is displayed in the search results page.

Navigation :

Menu Type:

Choose between "Normal Menu" and "Mega Menu" for the type of menu you want to use in your store.

Breadcrumb:

Enable or disable breadcrumbs by checking or un-checking the "Enable Breadcrumbs" checkbox.

Product Slider Customization:

• Show Slider Arrows:Enable or disable slider arrows by checking or un-checking the "Show Slider Arrows" checkbox.
• Enable Color Swatches:Enable or disable color swatches by checking or un-checking the "Enable Color Swatches" checkbox.
• Add to Cart Button:Choose between two options for displaying the "Add to Cart" button on product sliders:"Show on Hover" and "Always Show"
• Loader Style:Choose between "Style 1" and "Style 2" for the loader style used when loading products in the slider

Checkout Page Customization:

• Banner:Upload a background image for the banner section. Recommended dimensions are 1000 x 400 pixels.
• Logo:Upload a custom image for the logo.
• Position:Choose between "Left," "Center," or "Right" for the position of the logo.
• Logo Size:Select between "Small," "Medium," or "Large" for the size of the logo.
• Main Content Area:Customize the main content area of the checkout page.
• Background Image:Upload a background image.
• Background Color:Set a background color.
• Form Fields:Toggle between "White" or "Transparent" for the form field background.
• Order Summary:Customize the order summary section of the checkout page.
• Background Image:Upload a background image.
• Background Color:Set a background color.
• Colors:Define three different color options:
• Accents: Set the color for accents like highlights, links, and check-marks.
• Buttons: Define the color for buttons like gift card/discount and next step buttons.
• Errors: Specify the color for error messages and invalid fields.

Cart Settings:

On Add to Cart Button Click:

Choose between two options for what happens when a customer clicks the "Add to Cart" button:

Show Cart Drawer:

this option displays a cart drawer or popup on the same page, showing the items added to the cart.

Redirect to Cart Page:

This option redirects the customer to the dedicated cart page after adding an item to the cart.

Choose the option that best suits your preferences for the cart behavior on your Shopify store.

Collection Page Customization:

• Page Banner:
• Show on Collection Page:Enable or disable the display of the page banner on the collection page by checking or un-checking the checkbox.
• Image Alignment:Choose from different alignment options available for the page banner image.
• Image Height:Select from various height size options available for the page banner image.
• Page Banner Overlay:Customize the overlay settings for the page banner.
• Overlay Color:Set the color of the overlay.
• Overlay Opacity:Adjust the opacity level of the overlay.
• Product Display Settings:
• Enable Sorting:Enable or disable the option to sort products on the collection page.
• Products per Row:Toggle between displaying 2 or 3 products per row.
• Products per Page:Define the number of products to display on a single page.
• Pagination:Choose between "Simple Pagination" or "Infinite Load" for how products are displayed on the collection page.
• Product Overlay Color:Set the color of the overlay for individual product images.
• Product Overlay Opacity:Adjust the opacity level of the overlay for individual product images.
• Sidebar:
• Enable Sidebar:Enable or disable the sidebar on the collection page.
• Filter Block Height:Set the height of the filter block within the sidebar.
• Sidebar Content Color:Customize the color of the content within the sidebar.

App Installation & Implementation

Shopify search & Discovery

Installation :

Log in to your Shopify admin panel.

From the Shopify admin dashboard, click on the "Apps" tab located in the left-hand sidebar.

In the Apps section, click on the "Visit Shopify App Store" button to access the Shopify App Store.

In the search bar at the top, type "Shopify Search and Discovery" and press Enter or click the search icon.

Look for the "Shopify Search and Discovery" app in the search results and click on it to view the app details.

Review the app's features, pricing, and ratings to ensure it meets your requirements. If you're satisfied, click the "Add app" button.

Follow the on-screen instructions to install the app and grant necessary permissions.

Once the app is installed, return to your Shopify admin panel.

Implementation :

Log in to your Shopify admin panel.

From the Shopify admin dashboard, click on the "Online Store" tab located in the left-hand sidebar.

In the Online Store section, click on the "Navigation" tab.

On the Navigation page, scroll down to the "Collection and search filters" section.

Look for the Shopify Search and Discovery option and click on the "Open" or "Configure" button next to it.

This will open the settings or configuration panel for the Shopify Search and Discovery app.

Within the app settings, you should find options to manage and configure the filter options.

Depending on the capabilities of the app, you may be able to customize various filter attributes such as tags, product properties, collections, price ranges, etc.

Configure the desired filter options according to your store's needs. You can enable/disable specific filter attributes, rearrange their order, or set other preferences provided by the app.

Save your changes within the Shopify Search and Discovery app.

Once you have configured the filter options, they should be automatically integrated into your store's search and discovery functionality, and customers will be able to use them to refine their product search

Product Reviews

Installation :

Log in to your Shopify admin panel.

From the Shopify admin dashboard, click on the "Apps" tab located in the left-hand sidebar.

In the Apps section, click on the "Visit Shopify App Store" button to access the Shopify App Store.

In the search bar at the top, type "Product Reviews" and press Enter or click the search icon.

Implementation :

Configure the app settings according to your preferences. This may include options like review display settings, customization options, email notifications, and more. Consult the app's documentation or support resources for specific instructions on configuring the product reviews app.
Customize the appearance of the review section to match your store's branding, if applicable. This can include adjusting colors, fonts, and styling elements.

Save your settings and make sure the product reviews feature is enabled.

Visit your store's front-end to ensure that the product reviews are being displayed correctly and that customers can submit reviews.

About Us Page :

Log in to your Shopify admin panel.

Navigate to "Online Store" and select "Themes" from the drop-down menu.

In the "Themes" section, click on the "Customize" button for the theme you want to edit.

The theme customization panel will open, displaying various options and sections.

Locate the section you want to customize and click on it. The available sections are usually listed in the left-hand sidebar.

Or,
Select the page from here : 

Select Pages > about-us
The theme customization panel for the about us page will open, displaying various options and sections.

Look for this section in the left-handed sidebar :

Go to Text block and then add content on the right hand side. Modify the settings as desired to customize the appearance and behavior of the section.
Once you're done customizing the sections, click on the "Save" button to apply the changes.
Preview the changes in real-time using the preview window on the right side of the customization panel.