Popular Categories 2

To show Popular Categories 2 on Home page, In the Page Builder -> Go to Widgets -> drag and drop HTML block into specified sections.

In field HTML block:

After that, input sample content below:
<div class="halo-block halo-home-section halo-bgGray" id="popularCates-2" data-halo-load="animation">
<div class="container ">
<div class="c-2">
<div class="item p-t">
<article class="popularCates--card halo-fadeInLeft" data-halo-animate="1">
<figure class="popularCates--figure">
<img class="popularCates--image"
src="https://cdn11.bigcommerce.com/s-4pwi31bh7d/images/stencil/original/image-manager/halo-popular-category-6.jpg"
alt="Full Gears Ninja H2">
</figure>
<div class="popularCates--body">
<div class="content-wrapper">
<h4 class="title">
<a href="#">Full Gears Ninja H2</a>
</h4>
<p class="description">
Gears for 2022 Best Hypersport Bike
</p>
</div>
<a class="button button--primary" href="#" aria-label="Shop Now"><span>Shop Now</span></a>
</div>
</article>
</div>
<div class="item p-t">
<article class="popularCates--card halo-fadeInRight" data-halo-animate="2">
<figure class="popularCates--figure">
<img class="popularCates--image"
src="https://cdn11.bigcommerce.com/s-4pwi31bh7d/images/stencil/original/image-manager/halo-popular-category-7.jpg"
alt="Recreation">
</figure>
<div class="popularCates--body">
<div class="content-wrapper">
<h4 class="title">
<a href="#">Recreation</a>
</h4>
<p class="description">
Update Lastest Version
</p>
</div>
<a class="button button--primary" href="#" aria-label="Shop Now"><span>Shop Now</span></a>
</div>
</article>
</div>
</div>
</div>
</div>
Or use button below to generate the code with your own banners. Please click the Copy code on the popup after you changed all the blocks.
Last updated