Personalized checkout and custom promotions with Shopify Scripts
Hello, I'm new to Shopify and I need some advise. I could not figure how to avoid divs.
Here's my code:
<div class="carousel-container shimmer">
<ul class="carousel product-carousel">
{%- for productImage in product.images -%}
<li>
<img
class="lazy"
src="data:image/gif;base64,R0lGODlhAQABAAD/ACwAAAAAAQABAAACADs="
data-color="{{ productImage.variants[0][color_property] }}"
data-slide="{{ forloop.index0 }}"
data-src="{{
productImage
| img_url: '500x500'
| remove: 'https:'
| split: '?v'
| first
}}"
alt="Image {{ forloop.index }}"
draggable="false"
width="500"
height="500"
/>
</li>
{%- endfor -%}
</ul>
<div class="carousel-nav carousel-nav--vertical">
<span class="carousel-btn prev-img nav-btn"><i class="fa fa-1-5x fa-chevron-up" aria-hidden="true">
</i></span>
<ul class="carousel-nav-list">
{%- for productImage in product.images -%}
<li class="carousel-nav-item" data-slide="{{ forloop.index0 }}">
<img
class="lazy"
src="data:image/gif;base64,R0lGODlhAQABAAD/ACwAAAAAAQABAAACADs="
data-color="{{ productImage.variants[0][color_property] }}"
data-src="{{
productImage
| img_url: '70x70'
| remove: 'https:'
| split: '?v'
| first
}}"
alt="Image {{ forloop.index }}"
draggable="false"
width="70"
height="70"
/>
</li>
{%- endfor -%}
</ul>
<span class="carousel-btn next-img nav-btn"
><i class="fa fa-1-5x fa-chevron-down" aria-hidden="true"></i
></span>
</div>
<div style="clear: both"></div>
</div>
And this is my Goal:
Hey Community! As we jump into 2025, we want to give a big shout-out to all of you wh...
By JasonH Jan 7, 2025Hey Community! As the holiday season unfolds, we want to extend heartfelt thanks to a...
By JasonH Dec 6, 2024Dropshipping, a high-growth, $226 billion-dollar industry, remains a highly dynamic bus...
By JasonH Nov 27, 2024