Add FREE order tracking page in Shopify store

  • administrator
  • February 24, 2024
  • 5 min read

Order Tracking Page to BOOST your store authentication Certainly! Implementing an order tracking page in Shopify store can provide several benefits for both you and your customers. Order status page keeps customers informed about the status of their orders, improving transparency and satisfaction. It reduces customer inquiries and support requests, because they can easily track their […]

Read More

Add Shopify product page calendar Without App

  • ramzan
  • January 14, 2024
  • 1 min read

Add below code snippet inside product page <style> .calender-field { margin-top: 10px; } .calender__input { box-shadow: inherit; font-size: 1.5rem; border: 1px solid #929496; background-color: transparent; cursor: pointer; border-radius: 1px; color: #31373d; padding: 10px; } </style> <div> <label for=”calenderinput”> {{ ‘Wear Date *Required’ }} </label> <input form=”{{ product_form_id }}” required id=”calenderinput” type=”date” name=”properties[Wear Date]”> </div>

Read More

1. Update Alt text of images in the gallery for each product. 2. Go to Snippets -> product-gallery.liquid Find ‘media in product.media’ loop.Paste below code inside the open tag. {% if product.selected_or_first_available_variant.featured_media.alt != media.alt and product.selected_or_first_available_variant.featured_media.alt != blank %} style=”display: none;” {% endif %} thumbnail-alt='{{ media.alt }}’ 3. Go to Assets -> theme.js Find onVariantChange_fn […]

Read More

1. Update Alt text of images in the gallery for each product. 2. Go to Snippets -> product-media-gallery.liquid Find ‘product__media-item’ class in li tag which is inside product.media loop.Paste below code inside the li open tag. {% if product.selected_or_first_available_variant.featured_media.alt != media.alt and product.selected_or_first_available_variant.featured_media.alt != blank %} style=”display: none;” {% endif %} thumbnail-alt='{{ media.alt }}’ 3. […]

Read More

1. Create new snippet ‘language-country-flag’ and paste below code: <style> .header-lang-switcher summary { display: flex; align-items: center; } </style> <localization-form> {%- form ‘localization’, id: ‘FooterCountryForm’, class: ‘localization-form header-lang-switcher’ -%} <div> <details aria-haspopup=”true” role=”buton”> <summary tabindex=”0″> {% if localization.country.iso_code == ‘IL’ %} <img src=”{{ ‘il.svg’ | asset_url }}” alt=”country flag” width=”20″ height=””/> {% else %} <img […]

Read More

1. Create new section ‘collection-slider’ and paste below code: {{ ‘section-collection-list.css’ | asset_url | stylesheet_tag }} {{ ‘component-card.css’ | asset_url | stylesheet_tag }} <link rel=”stylesheet” href=”{{ ‘component-slider.css’ | asset_url }}” media=”print” onload=”this.media=’all'”> <noscript>{{ ‘component-slider.css’ | asset_url | stylesheet_tag }}</noscript> {%- style -%} .section-{{ section.id }}-padding { padding-top: {{ section.settings.padding_top | times: 0.75 | round: 0 […]

Read More

1. Create new snippet ‘onsale-filter’ and paste below code: <style> .custom-sales-toggle { margin-bottom: 20px; } .custom-sales-toggle a { font-size: 12px; } .custom-sales-toggle a.turn-on { background: aqua; padding: 5px; border-radius: 5px; } .custom-sales-toggle a.turn-off { background: black; color: white; padding: 5px; border-radius: 5px; } </style> {% assign filtertag = ‘onsale’ %} <div> <a href=”{{ saleurl }}/{{ […]

Read More

Copy And Paste Below Code <div style=” position: fixed; bottom: 10px; right: 0; width: 50px; height: 50px; margin: 15px;”> <a href=”https://wa.me/+441234567823″> <img height=”100″ width=”100″ src=”https://yourwebsite.net/wp-content/uploads/2023/10/whatsapp.png”> </a> </div> https://youtu.be/mgpoaIEjTEw

Read More

How to Add Shopify DAWN Theme Testimonials Slider

  • ramzan
  • August 24, 2023
  • 7 min read

Copy And Paste Below Code Follow Below Video For Step-by-step Implementations 1. Create a new section and name it "testimonials" and copy content of Section/multicolumn.liquid 2. Create a new css file in Assets and name it "section-testimonials" and copy css code from Assets/section-multicolumn.css 3. – Include section-testimonials.css into testimonial.liquid – Add below CSS code in […]

Read More

How to Add Featured Product Slider In Shopify Store

  • ramzan
  • August 24, 2023
  • 6 min read

Copy And Paste The Below Code <style> .custom-product-slider .title-wrapper-with-link { display: block; } .custom-product-slider .title { text-align: center; font-weight: var(–font-heading-weight); font-size: calc(var(–font-heading-scale) * 2.4rem); } .dawn-product-slider { max-width: 1600px; margin: auto; padding: 0 20px; padding-bottom: 32px; margin-top: 55px; } .dawn-product-slider img { width: 100%; } .dawn-product-slider .carousel-cell { background: #fff; border-radius: 16px; margin: auto; padding: […]

Read More