Instagram gallery
This is html for make news gallery or instagram gallery
Instagram 1
<!-- gallery style 1 -->
<div class="widget">
<!-- widget title -->
<div class="block-title-4">
<h4 class="h5 title-arrow">
<span>Instagram 1</span>
</h4>
</div>
<!--instagram-->
<div class="instagram-photos col-12 mb-4">
<div class="row">
<!--post start-->
<div class="col-6 col-sm-4 px-1">
<a href="https://www.instagram.com/" target="_blank" class="card card-full mb-2 rounded-0 overflow zoom hover-a">
<!--post images-->
<div class="position-relative" data-bs-toggle="tooltip" data-bs-placement="bottom" title="Street Style: Governors Ball Music Festival">
<div class="ratio_337-337 image-wrapper">
<img class="img-fluid lazy" src="../../assets/img/assets/lazy-empty.png" data-src="../../assets/img/337x337/img1.jpg" alt="Image description">
</div>
</div>
<!--end post images-->
</a>
</div>
<!--post start-->
<div class="col-6 col-sm-4 px-1">
<a href="https://www.instagram.com/" target="_blank" class="card card-full mb-2 rounded-0 overflow zoom hover-a">
<!--post images-->
<div class="position-relative" data-bs-toggle="tooltip" data-bs-placement="bottom" title="Street Style: Governors Ball Music Festival">
<div class="ratio_337-337 image-wrapper">
<img class="img-fluid lazy" src="../../assets/img/assets/lazy-empty.png" data-src="../../assets/img/337x337/img2.jpg" alt="Image description">
</div>
</div>
<!--end post images-->
</a>
</div>
<!--post start-->
<div class="col-6 col-sm-4 px-1">
<a href="https://www.instagram.com/" target="_blank" class="card card-full mb-2 rounded-0 overflow zoom hover-a">
<!--post images-->
<div class="position-relative" data-bs-toggle="tooltip" data-bs-placement="bottom" title="Street Style: Governors Ball Music Festival">
<div class="ratio_337-337 image-wrapper">
<img class="img-fluid lazy" src="../../assets/img/assets/lazy-empty.png" data-src="../../assets/img/337x337/img3.jpg" alt="Image description">
</div>
</div>
<!--end post images-->
</a>
</div>
<!--post start-->
<div class="col-6 col-sm-4 px-1">
<a href="https://www.instagram.com/" target="_blank" class="card card-full mb-2 rounded-0 overflow zoom hover-a">
<!--post images-->
<div class="position-relative" data-bs-toggle="tooltip" data-bs-placement="bottom" title="Street Style: Governors Ball Music Festival">
<div class="ratio_337-337 image-wrapper">
<img class="img-fluid lazy" src="../../assets/img/assets/lazy-empty.png" data-src="../../assets/img/337x337/img4.jpg" alt="Image description">
</div>
</div>
<!--end post images-->
</a>
</div>
<!--post start-->
<div class="col-6 col-sm-4 px-1">
<a href="https://www.instagram.com/" target="_blank" class="card card-full mb-2 rounded-0 overflow zoom hover-a">
<!--post images-->
<div class="position-relative" data-bs-toggle="tooltip" data-bs-placement="bottom" title="Street Style: Governors Ball Music Festival">
<div class="ratio_337-337 image-wrapper">
<img class="img-fluid lazy" src="../../assets/img/assets/lazy-empty.png" data-src="../../assets/img/337x337/img5.jpg" alt="Image description">
</div>
</div>
<!--end post images-->
</a>
</div>
<!--post start-->
<div class="col-6 col-sm-4 px-1">
<a href="https://www.instagram.com/" target="_blank" class="card card-full mb-2 rounded-0 overflow zoom hover-a">
<!--post images-->
<div class="position-relative" data-bs-toggle="tooltip" data-bs-placement="bottom" title="Street Style: Governors Ball Music Festival">
<div class="ratio_337-337 image-wrapper">
<img class="img-fluid lazy" src="../../assets/img/assets/lazy-empty.png" data-src="../../assets/img/337x337/img6.jpg" alt="Image description">
</div>
</div>
<!--end post images-->
</a>
</div>
<!--end post-->
</div>
</div>
<!--end instagram-->
<div class="gap-0"></div>
</div>
Instagram 2
<!-- gallery style 2 -->
<div class="widget">
<!-- widget title -->
<div class="block-title-4">
<h4 class="h5 title-arrow">
<span>Instagram 2</span>
</h4>
</div>
<!-- Instagram -->
<div class="col-12 insta-list mb-4">
<ul class="row list-unstyled mb-0 no-mb bg-light">
<li class="col-6 col-sm-4 px-0 hover-a">
<a href="https://www.instagram.com/" target="_blank" title="Why 2018 Was Blake Lively's Year Of Suits">
<div class="ratio_337-337 image-wrapper">
<img class="img-fluid lazy" src="../../assets/img/assets/lazy-empty.png" data-src="../../assets/img/337x337/img1.jpg" alt="Image description">
</div>
</a>
</li>
<li class="col-6 col-sm-4 px-0 hover-a">
<a href="https://www.instagram.com/" target="_blank" title="Adwoa Aboah On Breaking New Ground In The Fashion Industry">
<div class="ratio_337-337 image-wrapper">
<img class="img-fluid lazy" src="../../assets/img/assets/lazy-empty.png" data-src="../../assets/img/337x337/img2.jpg" alt="Image description">
</div>
</a>
</li>
<li class="col-6 col-sm-4 px-0 hover-a">
<a href="https://www.instagram.com/" target="_blank" title="The Power Of Designer Collaborations">
<div class="ratio_337-337 image-wrapper">
<img class="img-fluid lazy" src="../../assets/img/assets/lazy-empty.png" data-src="../../assets/img/337x337/img3.jpg" alt="Image description">
</div>
</a>
</li>
<li class="col-6 col-sm-4 px-0 hover-a">
<a href="https://www.instagram.com/" target="_blank" title="How To Care For Your Cashmere">
<div class="ratio_337-337 image-wrapper">
<img class="img-fluid lazy" src="../../assets/img/assets/lazy-empty.png" data-src="../../assets/img/337x337/img4.jpg" alt="Image description">
</div>
</a>
</li>
<li class="col-6 col-sm-4 px-0 hover-a">
<a href="https://www.instagram.com/" target="_blank" title="12 Of The Best Cashmere Jumpers To Cherish This Winter">
<div class="ratio_337-337 image-wrapper">
<img class="img-fluid lazy" src="../../assets/img/assets/lazy-empty.png" data-src="../../assets/img/337x337/img5.jpg" alt="Image description">
</div>
</a>
</li>
<li class="col-6 col-sm-4 px-0 hover-a">
<a href="https://www.instagram.com/" target="_blank" title="10 Trench Coats To Complete Your Winter Wardrobe️">
<div class="ratio_337-337 image-wrapper">
<img class="img-fluid lazy" src="../../assets/img/assets/lazy-empty.png" data-src="../../assets/img/337x337/img6.jpg" alt="Image description">
</div>
</a>
</li>
</ul>
</div>
<!-- end instagram -->
<div class="gap-0"></div>
</div>
Instagram 3
<!-- gallery style 3 -->
<div class="widget">
<!-- widget title -->
<div class="block-title-4">
<h4 class="h5 title-arrow">
<span>Instagram 3</span>
</h4>
</div>
<!-- Instagram -->
<div class="col-12 insta-list mb-4">
<ul class="row list-unstyled mb-0 no-mb bg-light">
<li class="col-6 col-sm-4 px-0 hover-a overflow zoom">
<a href="https://www.instagram.com/" target="_blank" title="Why 2018 Was Blake Lively's Year Of Suits">
<div class="ratio_337-337 image-wrapper">
<img class="img-fluid lazy" src="../../assets/img/assets/lazy-empty.png" data-src="../../assets/img/337x337/img1.jpg" alt="Image description">
</div>
</a>
</li>
<li class="col-6 col-sm-4 px-0 hover-a overflow zoom">
<a href="https://www.instagram.com/" target="_blank" title="Adwoa Aboah On Breaking New Ground In The Fashion Industry">
<div class="ratio_337-337 image-wrapper">
<img class="img-fluid lazy" src="../../assets/img/assets/lazy-empty.png" data-src="../../assets/img/337x337/img2.jpg" alt="Image description">
</div>
</a>
</li>
<li class="col-6 col-sm-4 px-0 hover-a overflow zoom">
<a href="https://www.instagram.com/" target="_blank" title="The Power Of Designer Collaborations">
<div class="ratio_337-337 image-wrapper">
<img class="img-fluid lazy" src="../../assets/img/assets/lazy-empty.png" data-src="../../assets/img/337x337/img3.jpg" alt="Image description">
</div>
</a>
</li>
<li class="col-6 col-sm-4 px-0 hover-a overflow zoom">
<a href="https://www.instagram.com/" target="_blank" title="How To Care For Your Cashmere">
<div class="ratio_337-337 image-wrapper">
<img class="img-fluid lazy" src="../../assets/img/assets/lazy-empty.png" data-src="../../assets/img/337x337/img4.jpg" alt="Image description">
</div>
</a>
</li>
<li class="col-6 col-sm-4 px-0 hover-a overflow zoom">
<a href="https://www.instagram.com/" target="_blank" title="12 Of The Best Cashmere Jumpers To Cherish This Winter">
<div class="ratio_337-337 image-wrapper">
<img class="img-fluid lazy" src="../../assets/img/assets/lazy-empty.png" data-src="../../assets/img/337x337/img5.jpg" alt="Image description">
</div>
</a>
</li>
<li class="col-6 col-sm-4 px-0 hover-a overflow zoom">
<a href="https://www.instagram.com/" target="_blank" title="10 Trench Coats To Complete Your Winter Wardrobe️">
<div class="ratio_337-337 image-wrapper">
<img class="img-fluid lazy" src="../../assets/img/assets/lazy-empty.png" data-src="../../assets/img/337x337/img6.jpg" alt="Image description">
</div>
</a>
</li>
</ul>
</div>
<!-- end instagram -->
<div class="gap-0"></div>
</div>
Horizontal Gallery
<!--instagram horizontal-->
<div id="instagram2" class="instagram-horizontal position-relative col-12 mt-4 bg-light-dark border-top">
<div class="row">
<div class="w-100 position-absolute z-index-10 top-4 text-center h-0">
<a class="btn btn-sm btn-primary text-white" href="https://instagram.com">Follow Instagram @Mynicname</a>
</div>
</div>
<ul class="row g-0 list-unstyled mb-0 bg-light">
<li class="col-4 col-md-2 px-0 hover-a">
<a href="https://www.instagram.com/" target="_blank" title="Why 2018 Was Blake Lively's Year Of Suits">
<div class="ratio_337-337 image-wrapper">
<img class="img-fluid lazy" src="../../assets/img/assets/lazy-empty.png" data-src="../../assets/img/337x337/img1.jpg" alt="Image description">
</div>
</a>
</li>
<li class="col-4 col-md-2 px-0 hover-a">
<a href="https://www.instagram.com/" target="_blank" title="Adwoa Aboah On Breaking New Ground In The Fashion Industry">
<div class="ratio_337-337 image-wrapper">
<img class="img-fluid lazy" src="../../assets/img/assets/lazy-empty.png" data-src="../../assets/img/337x337/img2.jpg" alt="Image description">
</div>
</a>
</li>
<li class="col-4 col-md-2 px-0 hover-a">
<a href="https://www.instagram.com/" target="_blank" title="The Power Of Designer Collaborations">
<div class="ratio_337-337 image-wrapper">
<img class="img-fluid lazy" src="../../assets/img/assets/lazy-empty.png" data-src="../../assets/img/337x337/img3.jpg" alt="Image description">
</div>
</a>
</li>
<li class="col-4 col-md-2 px-0 hover-a">
<a href="https://www.instagram.com/" target="_blank" title="How To Care For Your Cashmere">
<div class="ratio_337-337 image-wrapper">
<img class="img-fluid lazy" src="../../assets/img/assets/lazy-empty.png" data-src="../../assets/img/337x337/img4.jpg" alt="Image description">
</div>
</a>
</li>
<li class="col-4 col-md-2 px-0 hover-a">
<a href="https://www.instagram.com/" target="_blank" title="12 Of The Best Cashmere Jumpers To Cherish This Winter">
<div class="ratio_337-337 image-wrapper">
<img class="img-fluid lazy" src="../../assets/img/assets/lazy-empty.png" data-src="../../assets/img/337x337/img5.jpg" alt="Image description">
</div>
</a>
</li>
<li class="col-4 col-md-2 px-0 hover-a">
<a href="https://www.instagram.com/" target="_blank" title="10 Trench Coats To Complete Your Winter Wardrobe️">
<div class="ratio_337-337 image-wrapper">
<img class="img-fluid lazy" src="../../assets/img/assets/lazy-empty.png" data-src="../../assets/img/337x337/img6.jpg" alt="Image description">
</div>
</a>
</li>
</ul>
</div>
<!--end instagram-->