Free Shopify Sections

Free Shopify Liquid & Code Snippets

Looking to enhance your Shopify store without spending a dime? You’re in the right place. These free, ready-to-use sections will help you elevate your store’s design and functionality in minutes. Just copy, paste, and customize the code snippets to add powerful new features to your theme.

Whether you’re a seasoned developer or just starting out, these sections are designed to be easily implemented into your existing Shopify theme. Each snippet comes with clear instructions and can be modified to match your store’s unique style.

Free Countdown timer

Want to inform your customers of vital delivery information and create urgency? Check out this free countdown timer.

Free Scrolling Announcement Bar

Add a beautiful animated scrolling bar to your Shopify store’s theme with this code.

Free Product Promotion Banner

This handy little code snippet drops right into a simple “custom liquid” block in your theme. You can edit the colours and discount code (make sure you have this discount active in your Shopify store).

Instructions

Go to Shopify Admin > Online Store > Themes and click “Customize”
Copy the code from the accordion below (view code)
Add a new “Custom Liquid” block to your themes product page in the Customizer
Paste the code. Position the block. Make any changes to the code e.g discount code, colors etc. Click Save.

Important: Make sure the discount code is active in your store.

View Code

				
					
<div class="discount-promo">
  <div class="promo-content">
    <div class="promo-left">
      <span class="promo-label">Limited Time Offer</span>
      <p class="promo-text">Save 20% on your order</p>
    </div>
    <div class="code-container">
      <code class="discount-code">BCFM20</code>
      <span class="copy-hint">Click to copy</span>
    </div>
  </div>
</div>%MINIFYHTMLd34989ab37e1ed144089c5e76fc98eb06d7ea3dc4b1a4f578261fb9f70e0256287ff96b4a9a1fc9191e432fa4b9a1638287eb0cce9f50ccb8e65dd964d62006022%

Additional Images

Next Drop - Free Hype Countdown

The perfect code snippet to create hype for an incoming product or collection. Use it with a CTA to get signups.

Instructions

Go to Shopify Admin > Online Store > Themes and click “Customize”
Copy the code from the accordion below (view code)
Add a new “Custom Liquid” block to your themes product page in the Customizer
Paste the code. Position the block. Make any changes to the code e.g countdown time, colors etc. Click Save.
Important: Make sure to disable the block after reaching the end date.

View Code

				
					<div class="next-drop-countdown">
  <div class="countdown-content">
    <div class="countdown-header">
      <svg viewBox="0 0 24 24" width="16" height="16" class="countdown-icon">
        <path d="M12 2C6.486 2 2 6.486 2 12s4.486 10 10 10 10-4.486 10-10S17.514 2 12 2zm0 18c-4.411 0-8-3.589-8-8s3.589-8 8-8 8 3.589 8 8-3.589 8-8 8z"/>
        <path d="M13 7h-2v6l4.5 2.7.75-1.23-3.25-1.97z"/>
      </svg>
      <span>NEXT EXCLUSIVE DROP</span>
    </div>
    <div class="countdown-timer">
      <div class="time-block">
        <span class="days">00</span>
        <label>D</label>
      </div>
      <div class="time-separator">:</div>
      <div class="time-block">
        <span class="hours">00</span>
        <label>H</label>
      </div>
      <div class="time-separator">:</div>
      <div class="time-block">
        <span class="minutes">00</span>
        <label>M</label>
      </div>
      <div class="time-separator">:</div>
      <div class="time-block">
        <span class="seconds">00</span>
        <label>S</label>
      </div>
    </div>
  </div>
</div>%MINIFYHTMLd34989ab37e1ed144089c5e76fc98eb06d7ea3dc4b1a4f578261fb9f70e0256287ff96b4a9a1fc9191e432fa4b9a1638287eb0cce9f50ccb8e65dd964d62006023%

Additional Images