Custom Instagram Widget

The Auto Instagram widget is already included in the theme. Just add your Instagram username, and it will show your feed automatically. However, it also shows extra details and a button to visit Instagram, which might not fit with your design. There aren't many options to change it, but you can still use it if you like.

If you choose a third-party Instagram widget, you might face similar problems. The designs are usually not great, and many ask you to pay for extra features. Also, there’s a chance your login information could be sold without your consent.

This is a manual Instagram widget. I designed it to match the theme accent, and you can use it forever. The only thing to note is that it doesn’t automatically update your feed.

The code provided here is the same used in the Instagram Widget Content. You may use it again in case the original was corrupted during configuration.

<!--[Insta Post 1]-->
<div class="sbcwi iwiel sfszf srfsz srzoo srzou">
<figure class="prohi">
<a aria-label="Check my Instagram post 1" class="ciihl athlw" href="Paste_Instagram_Post_Link_Here" rel="nofollow noopener noreferrer" target="_blank">
<div class="imwim staic siwiv ioclc sicst ibdbi ltrgr ooari rcpim athlb">
  <img alt="Paste_Image_Link_Here" height="1600" src="data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg'/%3E" width="1600"/><span class="vhtel">Instagram Post 1</span>
</div>
</a>	
</figure>
</div>

<!--[Insta Post 2]-->
<div class="sbcwi iwiel sfszf srfsz srzoo srzou">
<figure class="prohi">
<a aria-label="Check my Instagram post 2" class="ciihl athlw" href="Paste_Instagram_Post_Link_Here" rel="nofollow noopener noreferrer" target="_blank">
<div class="imwim staic siwiv ioclc sicst ibdbi ltrgr ooari rcpim athlb">
  <img alt="Paste_Image_Link_Here" height="1600" src="data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg'/%3E" width="1600"/><span class="vhtel">Instagram Post 2</span>
</div>
</a>	
</figure>
</div>
	
<!--[Insta Post 3]-->
<div class="sbcwi iwiel sfszf srfsz srzoo srzou">
<figure class="prohi">
<a aria-label="Check my Instagram post 3" class="ciihl athlw" href="Paste_Instagram_Post_Link_Here" rel="nofollow noopener noreferrer" target="_blank">
<div class="imwim staic siwiv ioclc sicst ibdbi ltrgr ooari rcpim athlb">
  <img alt="Instagram post image" data-src="Paste_Image_Link_Here" height="1600" src="data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg'/%3E" width="1600"/><span class="vhtel">Instagram Post 3</span>
</div>
</a>	
</figure>
</div>

<!--[Insta Post 4]-->
<div class="sbcwi iwiel sfszf srfsz srzoo srzou">
<figure class="prohi">
<a aria-label="Check my Instagram post 4" class="ciihl athlw" href="Paste_Instagram_Post_Link_Here" rel="nofollow noopener noreferrer" target="_blank">
<div class="imwim staic siwiv ioclc sicst ibdbi ltrgr ooari rcpim athlb">
  <img alt="Instagram post image" data-src="Paste_Image_Link_Here" height="1600" src="data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg'/%3E" width="1600"/><span class="vhtel">Instagram Post 4</span>
</div>
</a>	
</figure>
</div>

<!--[Insta Post 5]-->
<div class="sbcwi iwiel sfszf srfsz srzoo srzou">
<figure class="prohi">
<a aria-label="Check my Instagram post 5" class="ciihl athlw" href="Paste_Instagram_Post_Link_Here" rel="nofollow noopener noreferrer" target="_blank">
<div class="imwim staic siwiv ioclc sicst ibdbi ltrgr ooari rcpim athlb">
  <img alt="Instagram post image" data-src="Paste_Image_Link_Here" height="1600" src="data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg'/%3E" width="1600"/><span class="vhtel">Instagram Post 5</span>
</div>
</a>	
</figure>
</div>

<!--[Insta Post 6]-->
<div class="sbcwi iwiel sfszf srfsz srzoo srzou">
<figure class="prohi">
<a aria-label="Check my Instagram post 6" class="ciihl athlw" href="Paste_Instagram_Post_Link_Here" rel="nofollow noopener noreferrer" target="_blank">
<div class="imwim staic siwiv ioclc sicst ibdbi ltrgr ooari rcpim athlb">
  <img alt="Instagram post image" data-src="Paste_Image_Link_Here" height="1600" src="data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg'/%3E" width="1600"/><span class="vhtel">Instagram Post 6</span>
</div>
</a>	
</figure>
</div>

The setup is easy. Watch the video below!