Shopify Progress Bar on Cart Drawer and Cart Page | Without App [FREE]

1. Create new snippet 'progress-bar' and paste attached code. <style> .custom-progress-bar { text-align: center; transition: all 1000ms linear; height: 93px; } .custom-progress-bar.cart-shipping__wrapper { padding: 15px; max-width: 700px; width: 90%; margin:…

Continue ReadingShopify Progress Bar on Cart Drawer and Cart Page | Without App [FREE]

How to add Video Slider in Shopify (All Free Themes) without App

https://youtu.be/5x1e_yssW0U 1. Create new section 'video-slider' and paste attached code. {%- style -%} .section-{{ section.id }}-padding { padding-top: {{ section.settings.padding_top }}px; padding-bottom: {{ section.settings.padding_bottom }}px; } .video-slider .testimonial__image { height:…

Continue ReadingHow to add Video Slider in Shopify (All Free Themes) without App

How to Make a Header Transparent In Shopify (Free Themes)

{% if template.name == 'index' %} <style> .header-wrapper { position: absolute; width: 100%; background: transparent; color: white; } .header-wrapper .list-menu span, details[open]>.header__menu-item, .header-wrapper summary svg, .header-wrapper a svg, .header-wrapper h1.header__heading…

Continue ReadingHow to Make a Header Transparent In Shopify (Free Themes)

How To Add Color Swatches in Shopify [Dawn 15.1.0]

https://youtu.be/KGTFXTp7EpM 1. Open settings_schema.json { "name": "Color Swatches Custom", "settings": [ { "type": "paragraph", "content": "Support AmazingLearning [Subscribing our Channel](https:\/\/youtube.com\/@amazinglearnings?sub_confirmation=1)" }, { "type": "text", "id": "optionName", "label": "Swatch option name",…

Continue ReadingHow To Add Color Swatches in Shopify [Dawn 15.1.0]

How to Display All Collection Links Above Products in Shopify Store?

https://youtu.be/yIoMZz6zA4c 1. Go to Sections -> main-collection-banner.liquid 2. Add this code below collection description code: <ul class="collections-list-scroll"> {% for collection in collections %} <li> <a href="{{ collection.url }}">{{ collection.title }}</a>…

Continue ReadingHow to Display All Collection Links Above Products in Shopify Store?

How to add MARQUEE sliding with icons in Shopify? Multiple Sections FREE

1. Create a new section marquee and paste attached code <style> .section-{{ section.id }}.custom-marquee { display: flex; align-items: center; height: {{section.settings.marquee_height}}px; width: 100vw; max-width: 100%; overflow-x: hidden; background:{{section.settings.colorBackground}}; color:{{section.settings.colorText}}; }…

Continue ReadingHow to add MARQUEE sliding with icons in Shopify? Multiple Sections FREE