Style Social Subscription Widget to Blogger / Blogspot



Hello Friends Is Social button Widget  ko ap apny blogger or wordpres me lga skty ho is se App kY Tmam Social Follwer View  hoty rhy gy or sath hi sath koi b user ap ki site pr new ho to wo ap ko Tmam Social Accounts Pr  b Follow  kr ly ga is button ko lgany ke liye ap ko simpl nechy dia gya code downlaod ya coppy krna he or just apny blogger ke layout me ja kr add layout pr clik kr ke add html code pr clik krna he or is code ko wha paste kr dena he os ky bad os me se ap ne apna link add krna he or is link ko jo hmary Social pages ka he is ko hta dena he



Agr Download krna he is link pr clik kry 

Image result for download gif


HTML CODE COPPY HARE

<div class="social-counter-man">

      <a class="count facebook" href="">
        <div class="icon"><i class="fa fa-facebook"></i></div>
        <p><span>34.2k</span> likes</p>
        <p class="action-btn">Like</p>
      </a>
      
      
    
      <!-- TWITTER -->
      <a class="count twitter" href="https://twitter.com/zubairchinioti">
        <div class="icon"><i class="fa fa-twitter"></i></div>
        <p><span>28.6k</span> followers</p>
        <p class="action-btn">Follow</p>
      </a>
      
      <!-- YOUTUBE -->
      <a class="count youtube" href="https://www.youtube.com/channel/UCF4k-erkeIsPqi2ugSbqzpA/videos">
        <div class="icon"><i class="fa fa-youtube"></i></div>
        <p><span>206.6k</span> subscribers</p>
        <p class="action-btn">Subscribe</p>
      </a>

      <!-- GOOGLE PLUS -->
      <a class="count google-plus" href="https://plus.google.com/u/0/+zubairchinioti">
        <div class="icon"><i class="fa fa-google-plus"></i></div>
        <p><span>17.3k</span> followers</p>
        <p class="action-btn">+1</p>
      </a>

      <!-- INSTAGRAM -->
     

     
    </div>
<style>
.social-counter-man{
  padding: 0;
  display: block;
}

.count{
  display: block;
  padding: 7px 0;
  text-align: left;
  transition: all 0.5s ease;
}

.count:hover{
  background: rgba(0,0,0,0.033);
  transform: scale(1.065);
}

.count .icon{
  background: #aaa;
  display: inline-block;
  float: left;
  color: white;
  font-size: 22px;
  margin-left: 5px;
  text-align: center;
  width: 45px;
  height: 45px;
  border-radius: 50%;
  text-shadow: 0 0 3px rgba(0,0,0,0.2);
  display: table;
}
.count .icon i{
  display: table-cell;
  vertical-align: middle;
}

.count p{
  display: inline-block;
  font-size: 13px;
  color: #ececec;
  margin: 11px;
}
.count p span{
  color: #aaa;
  font-size: 18px;
  font-weight: bold;
  padding-right: 2px;
}

.count .action-btn{
  float: right;
  display: inline-block;
  background: #aaa;
  color: white;
  padding: 3px 6px;
  border-radius: 3px;
  font-size: 14px;
  margin: 11px;
}

/*== COLORS ==*/
.facebook .icon{background:#3b5999;}
.facebook .action-btn{background:#3b5999;}
.facebook .icon i{padding-top:2px;}

.twitter .icon{background:#55acee;}
.twitter .action-btn{background:#55acee;}
.twitter .icon i{padding-top:2px;}

.youtube .icon{background:#cd201f;}
.youtube .action-btn{background:#cd201f;}
.youtube .icon i{font-size:24px}

.google-plus .icon{background:#dd4b39;}
.google-plus .action-btn{background:#dd4b39;}
.google-plus .icon i{font-size: 18px; padding-top: 1px;}

.instagram .icon{background:#e4405f;}
.instagram .action-btn{background:#e4405f;}


.rss .icon{background:#f57d00;}
.rss .action-btn{background:#f57d00;}


.social-counter-2 .linkedin, .linkedin .icon,.linkedin .action-btn{background:#0077B5}


.social-counter-2 .vimeo, .vimeo .icon,.vimeo .action-btn{background:#1ab7ea}


.social-counter-2 .vk, .vk .icon,.vk .action-btn{background:#4c75a3}


.social-counter-2 .tumblr, .tumblr .icon,.tumblr .action-btn{background:#34465d}


.social-counter-2 .pinterest, .pinterest .icon,.pinterest .action-btn{background:#bd081c}

.social-counter-2 .stumbleupon, .stumbleupon .icon,.stumbleupon .action-btn{background:#eb4924}

.social-counter-2 .reddit, .reddit .icon,.reddit .action-btn{background:#ff5700}

.social-counter-2 .yelp, .yelp .icon,.yelp .action-btn{background:#af0606}

.social-counter-2 .weibo, .weibo .icon,.weibo .action-btn{background:#df2029}

.social-counter-2 .producthunt, .producthunt .icon,.producthunt .action-btn{background:#da552f}

.social-counter-2 .whatsapp, .whatsapp .icon,.whatsapp .action-btn{background:#25D366}


.social-counter-2 .vine, .vine .icon,.vine .action-btn{background:#00b489}


.social-counter-2 .slack, .slack .icon,.slack .action-btn{background:#3aaf85}


.social-counter-2 .dribbble, .dribbble .icon,.dribbble .action-btn{background:#ea4c89}


.social-counter-2 .flickr, .flickr .icon,.flickr .action-btn{background:#ff0084}


.social-counter-2 .behance, .behance .icon,.behance .action-btn{background:#131418}
.behance .icon i{font-size:18px;}


.social-counter-2 .foursquare, .foursquare .icon,.foursquare .action-btn{background:#f94877}


.social-counter-2 .snapchat, .snapchat .icon,.snapchat .action-btn{background:#FFFC00}
.snapchat .icon i{font-size:24px;text-shadow: -1px 0 black,0 -1px black, 1px 0 black, 0 1px black}

.snapchat .action-btn{text-shadow: 0 0 1px black}
</style>
Share To:

zubair chinioti

Post A Comment: