Blog

How To Add Bullet Points in Shopify Product Page

Steps to Add the Code in Shopify:
1. Log in to your Shopify admin and go to Online Store > Themes.
2. Click on Actions > Edit code for your theme.
3. In the left sidebar, find the file called product-template.liquid under Snippet (Debutify theme) and click on it.

Find the following code inside the product-template.liquid file:

                {%- when 'quick_compare' -%}
                  <div class="dbtfy-quick-compare-container" hidden>
                    {%- render 'dbtfy-quick-compare', product: product -%}
                  </div>
<div class="info-container">
  <div class="info-item">
    <img src="https://cdn.shopify.com/s/files/1/0803/4041/8884/files/Delivery_Truck_www.middo.nl.webp?v=1728057944" alt="Delivery Truck">
    <p class="info-text">Voor 23:00 besteld = vandaag verzonden</p>
  </div>

  <div class="info-item">
    <img src="https://cdn.shopify.com/s/files/1/0803/4041/8884/files/PostNL_Logo.webp?v=1728057944" alt="PostNL Logo">
    <p class="info-text">Gratis verzending inclusief Track & Trace</p>
  </div>

  <div class="info-item">
    <img src="https://cdn.shopify.com/s/files/1/0803/4041/8884/files/Shop_nu._Betaal_later_met_Klarna_logo_klein_www.middo.nl.webp?v=1728057943" alt="Klarna Logo">
    <p class="info-text">Shop nu. Betaal later met Klarna</p>
  </div>
   
  <div class="info-item">
    <img src="https://cdn.shopify.com/s/files/1/0803/4041/8884/files/14-dagen-ruil-en-retour-beleid-www.middo.nl.webp?v=1728058583" alt="Return Policy">
    <p class="info-text"> 14 dagen geld-terug-garantie</p>
  </div>
</div>


<style>
.info-container {
  margin-top: 10px;
}

.info-item {
  display: flex;
  align-items: flex-start;
  margin-top: 10px;
}

.info-item img {
  height: 27px;
  width: 27px;
  margin-right: 15px;
}

.info-text {
  font-size: 16px;
}

  
</style>

6. Save the changes.

✅ Video Guide for 👉  Block copy text