Home Brands

To show Home Brands 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-dots" id="popularBrands">
<div class="container popularBrands__container">
<div class="halo-block-header">
<h3 class="title">As Seen In</h3>
</div>
<div class="popularBrands__wrapper">
<div class="popularBrands__carousel">
<div class="popularBrands__item home-banner-image">
<div class="popularBrands__img">
<a href="#" aria-label="Channel">
<img class="lazyload" src="https://cdn11.bigcommerce.com/s-wo0bjzph9t/content/loading/loading.svg" data-src="https://cdn11.bigcommerce.com/s-coj85swkah/images/stencil/original/image-manager/home-brand-1.png" alt="Channel">
</a>
</div>
</div>
<div class="popularBrands__item home-banner-image">
<div class="popularBrands__img">
<a href="#" aria-label="Gucci">
<img class="lazyload" src="https://cdn11.bigcommerce.com/s-wo0bjzph9t/content/loading/loading.svg" data-src="https://cdn11.bigcommerce.com/s-coj85swkah/images/stencil/original/image-manager/home-brand-2.png" alt="Gucci">
</a>
</div>
</div>
<div class="popularBrands__item home-banner-image">
<div class="popularBrands__img">
<a href="#" aria-label="magcor">
<img class="lazyload" src="https://cdn11.bigcommerce.com/s-wo0bjzph9t/content/loading/loading.svg" data-src="https://cdn11.bigcommerce.com/s-coj85swkah/images/stencil/original/image-manager/home-brand-3.png" alt="magcor">
</a>
</div>
</div>
<div class="popularBrands__item home-banner-image">
<div class="popularBrands__img">
<a href="#" aria-label="Prada">
<img class="lazyload" src="https://cdn11.bigcommerce.com/s-wo0bjzph9t/content/loading/loading.svg" data-src="https://cdn11.bigcommerce.com/s-coj85swkah/images/stencil/original/image-manager/home-brand-4-1.png" alt="Prada">
</a>
</div>
</div>
<div class="popularBrands__item home-banner-image">
<div class="popularBrands__img">
<a href="#" aria-label="Dior">
<img class="lazyload" src="https://cdn11.bigcommerce.com/s-wo0bjzph9t/content/loading/loading.svg" data-src="https://cdn11.bigcommerce.com/s-coj85swkah/images/stencil/original/image-manager/home-brand-5.png" alt="Dior">
</a>
</div>
</div>
<div class="popularBrands__item home-banner-image">
<div class="popularBrands__img">
<a href="#" aria-label="Versace">
<img class="lazyload" src="https://cdn11.bigcommerce.com/s-wo0bjzph9t/content/loading/loading.svg" data-src="https://cdn11.bigcommerce.com/s-coj85swkah/images/stencil/original/image-manager/home-brand-6.png" alt="Versace">
</a>
</div>
</div>
</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