Interactive Membership Bar for Blogger: A Step-by-Step Guide

Peace be upon you and God’s mercy and blessings. Welcome to the Material Web blog. Let’s get straight to the point. This is due to the time constraints. In this post, I present to you a distinctive, new, and exclusive addition. It is also an addition to joining followers designed by NiaDZGN, meaning the owner of the blog, hahaha.

After many followers asked about how to program it, and there were those who wanted to add it directly to me, I decided to put this addition in your hands for free, and you have complete freedom to modify it.

How to add followers to a blogger

Of course, the method is very easy. All you have to do is:

Login to Blogger
It is planned.
New HTML/javascript widget added
Enter the following code

<style>
.niafollow-bo{ background:linear-gradient(to left, #e91e63, rgb(45, 33, 63));border: 4px solid #e91e63;border-radius: 8px;padding: 15px;

 border-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='100' height='100' viewBox='0 0 100 100' fill='none' xmlns='http ://www.w3.org/2000/svg'%3E %3Cstyle%3Epath%7Banimation:stroke 5s infinite linear%3B%7D%40keyframes stroke%7Bto%7Bstroke-dashoffset:776%3B%7D%7D%3C/style%3E%3ClinearGradient id='g' x1='0%25' y1='0%25 ' x2='0%25' y2='100%25'%3E%3Cstop offset='0%25' stop-color='%232d3561' /%3E%3Cstop offset='25%25' stop-color='%23c05c7e' /%3E%3Cstop offset='50%25' stop-color='%23f3826f' /% 3E%3Cstop offset='100%25' stop-color='%23ffb961' /%3E%3C/linearGradient%3E %3Cpath d='M1.5 1.5 l97 0l0 97l-97 0 l0 -97' stroke-linecap='square' stroke='url(%23g)' stroke-width='3 'stroke-dasharray='388'/%3E %3C/svg%3E") 1}

/* btn demo */ .niafollow-demo{ margin: 10px auto;
 text-align: center; text-decoration: none; cursor:pointer!important;
 overflow:hidden; text-decoration:none; display:inline-block;
 -webkit-appearance:none; font-size:1em; border-radius:4px;
 color:rgba(255,255,255,0.8); font-weight:300;padding:5px 20px 20px 20px;
 margin:0 15px; box-shadow:0 2px 2px 1px rgba(0,0,0,0.1);transition:all 0.3s; background:#ff4081; }
 .niafollow-demo:hover{ box-shadow:0 14px 28px rgba(0,0,0,0.25),0 10px 10px rgba(0,0,0,0.22);
 position:relative;overflow:hidden;-webkit-transform:translatez(0) }
</style>

<div class="niafollow-bo" style="">

Subscribe to receive the most important updates on NiaDzgn.blogspot.com
<br />

<br />


<p style="text-align:center;"><a class="niafollow-demo" target="_blank" rel="noopener nofollow" href="https://www.blogger.com/follow.g?view=FOLLOW&blogID=8109648382048234843">

<img class="niafollow-z" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEguDDlkw8W1W7ZLiuFiJ7lUXjLyDtlJh10nTJe9cIT4_WNlWSkz7FNjzmSnZjIDynFBuE_lBVuibrzfnIhC_5mmPL8TDxY7bARrXZB5OgO_Hd461YMBNvS7sLF_4QwkDvQdkgsVQ8pumxM6sVT3cXXnUZ8uxkyXqtVnSJryCT69o_IOXRjQkUdLVKjJGT8H/s320/niadzgn.gif" style="
    position: absolute;
    width: 80px;
    margin-left: auto;
    margin-right: auto;
    margin-top: -44px;
    z-index: 9998;
" />
<br />
Join the members
</a></p>



</div>