BloggerBlogger WidgetsSocial Media IconsTips and tricks

Blog Me Social Media Follow Buttons Kaise Add Kare (Complete Guide 2019)

Blog Me Social Follow Buttons Kaise Add kare
Blog Me Social Follow Buttons Kaise Add kare

Blog Me Social Media Follow Buttons Kaise Add kare

हेलो दोस्तों, आज हम बात करने जा रहे है की Blog Me Social Media Follow Buttons Kaise Add kareजैसा की दोस्तों हमने अपनी पहली Posts में सीखा की Contact Us Page Add कैसे करे। और Blogger पर Website कैसे बनाये।
आज हम एक ऐसे Topic पर बात करेंगे जो की एक Website बहुत ही Important है इस की Help से आप अपनी Website पर Traffic भी ला सकते है और अपने Followers भी बढ़ा सकते है। 
Blog Me Social Media Follow Buttons लगाना बहुत ही आसान है। बहुत से Blogger ये Mistake करते है जिसकी बजह से उनकी Website या Blog पर Traffic नहीं आ पता। वे अपनी Website या Blog के Sidebar में Social Follow Buttons नहीं लगते। इसी Problem को Solve करने के लिए आज में आपको बताने जा रहा हूँ की Blog Me Social Media Follow Buttons Kaise Add kare.
How To Add Social Media Follow Buttons in Blogger Website.
Must Read – 

Blogger Website में Social Follow Buttons कैसे Add करे – 

Blog या Website में Social Media Follow buttons होने से Visitors सीधे आपके Social Media Accounts पर आप से Contact कर सकते है और आप अपने Visitors की Problems Solve कर सकते है। और इससे आपकी Website पर Traffic भी बढ़ेगा। चलिए तो अब जानते है की Blog Me Social Media Follow Buttons Kaise Add kare.
 
Step-1: सबसे पहले आपको अपने Blog के Homepage पर जाना है और Left-Side पर दिए गए Toolbar में से Layout Option पर Click करना है। फिर Right Sidebar पर Add a Gadget Option पर Click करना है। 
 
Blog Me Social Media Follow Buttons Kaise Add kare
Blog Me Social Media Follow Buttons Kaise Add kare
 
Step-2: फिर आपको HTML/Javascript वाले Option को Choose करना है और नीचे दिए गए Design में से अपनी मन पसंद वाली Design के Code को Copy करके आपको Paste करना है और उसमे आपको कुछ Changes करने है।  जहाँ पर भी # का Sign है बहा आपको अपने Social Media Account की Link Paste करनी है और Save Button पर Click करना है। 
 
Blog Me Social Media Follow Buttons Kaise Add kare
Blog Me Social Media Follow Buttons Kaise Add kare

<style>
.to-social-follow{width:300px;padding:10px;margin:0}.to-social-follow .fa{font-size:18px;padding:16px;text-align:center;margin:5px 2px;width:20%;text-decoration:none;color:#fff}.to-social-follow .fa:hover{opacity:.7}.to-social-follow .fa-facebook{background:#3B5998}.to-social-follow .fa-twitter{background:#55ACEE}.to-social-follow .fa-google{background:#dd4b39}.to-social-follow .fa-linkedin{background:#007bb5}.to-social-follow .fa-youtube{background:#b00}.to-social-follow .fa-instagram{background:#125688}.to-social-follow .fa-pinterest{background:#cb2027}
</style>
<div class=”to-social-follow”>
<a href=”#” class=”fa fa-facebook” target=”_blank”></a>
<a href=”#” class=”fa fa-twitter” target=”_blank”></a>
<a href=”#” class=”fa fa-google” target=”_blank”></a>
<a href=”#” class=”fa fa-linkedin” target=”_blank”></a>
<a href=”#” class=”fa fa-youtube” target=”_blank”></a>
<a href=”#” class=”fa fa-pinterest” target=”_blank”></a>
</div>

 

Remove # With Your Social Media Links

Design-2: 

<style>
ul.techornate-follow-buttons a:hover{color:#03c9a9}.techornate-follow-buttons.b-title li{text-align:center;background-color:#fff;width:31.5%;border:1px solid #eee}.techornate-follow-buttons.b-title a{text-transform:uppercase;text-decoration:none;margin:20px auto 0;font-size:10px}.techornate-follow-buttons li{display:inline-block;padding:0 0 7px;margin-bottom:3px!important}.techornate-follow-buttons li:last-child{border-bottom:1px solid #eee!important;padding-bottom:7px!important}.techornate-follow-buttons.b-title i{margin:0 auto 10px;display:block}.techornate-follow-buttons.style-1 i{height:32px;width:32px;line-height:32px;font-size:20px;margin:10px auto 0;text-align:center;color:#333}
</style>
<ul class=’techornate-follow-buttons style-1 b-title’>
<li><a href=’#‘><i class=”fa fa-facebook”></i>facebook</a></li>
<li><a href=’#‘><i class=”fa fa-twitter”></i>twitter</a></li>
<li><a href=’#‘><i class=”fa fa-google”></i>google +</a></li>
<li><a href=’#‘><i class=”fa fa-pinterest”></i>pinterest</a></li>
<li><a href=’#‘><i class=”fa fa-linkedin”></i>linkedin</a></li>
<li><a href=’#‘><i class=”fa fa-instagram”></i>instagram</a></li>
</ul>


Remove # With Your Social Media Links

Design-3

<style>
.techornate-social-buttons ul{padding-left:0;list-style:none}.techornate-social-buttons li a{text-transform:uppercase;text-decoration:none;padding:10px 1px 10px 10px;letter-spacing:2px;font-size:10px;color:#fff;display:block;border-radius:3px}.techornate-social-buttons ul li{margin-bottom:10px;width:100%}.techornate-social-buttons li a i{width:35px;height:14px;float:right;padding:0 0 0 10px;margin:0;font-size:14px;line-height:14px;border-left:1px solid #B1B1B1}.techornate-social-buttons li a.social-btn-facebook{background:#3b5998}.techornate-social-buttons li a.social-btn-twitter{background:#1da1f2}.techornate-social-buttons li a.social-btn-youtube{background:#cd201f}.techornate-social-buttons li a.social-btn-instagram{background:#405de6}.techornate-social-buttons li a.social-btn-google{background:#dd4b39}
</style>
<div class=”techornate-social-buttons”>
<ul class=”sidebar-social clearfix”>
<li><a href=”#” class=”social-btn-facebook”>Like on Facebook <i class=”fa fa-facebook”></i> </a></li>
<li><a href=”#” class=”social-btn-twitter”>Follow on Twitter <i class=”fa fa-twitter”></i> </a></li>
<li><a href=”#” class=”social-btn-google”>Follow on Google+ <i class=”fa fa-google”></i> </a></li>
<li><a href=”#” class=”social-btn-instagram”>Follow on Instagram <i class=”fa fa-instagram”></i> </a></li>
<li><a href=”#” class=”social-btn-youtube”>Subscribe on Youtube <i class=”fa fa-youtube”></i> </a></li>
</ul>
</div>


Remove # With Your Social Media Links


Design-4 

 

<style>
.s-text strong,.social-counter{font-weight:900}.techornate-socials a{display:block;color:#fff;padding:12px 15px;position:relative;margin-bottom:5px;text-decoration:none}.techornate-socials a span,.techornate-socials a:before{z-index:2;position:relative}.social-counter{position:absolute;font-size:14px;line-height:1;padding-top:4px}.s-text{float:right}.techornate-socials a:after{content:” “;height:100%;width:0;top:0;left:0;position:absolute;background:#252b42;z-index:1}.fa-facebook:before,.fa-subscribe:before,.fa-twitter:before{display:inline-block;width:16px;font-family:FontAwesome;margin-right:10px;padding-right:10px;font-size:18px;border-right:1px solid rgba(255,255,255,.3)}.fa-facebook{background:#1c3e67}.fa-facebook:before{content:”f09a”}.fa-twitter{background:#28a6c5}.fa-twitter:before{content:”f099″}.fa-subscribe{background:#d2002c}.fa-subscribe:before{content:”f167″}
</style>
<div class=”techornate-socials”>
<a target=”_blank” href=”#” class=”fa-facebook”><span class=”social-counter”>146,200</span><span class=”s-text”>Follow us on <strong>Facebook</strong></span></a>
<a target=”_blank” href=”#” class=”fa-twitter”><span class=”social-counter”>50,748</span><span class=”s-text”>Follow us on <strong>Twitter</strong></span></a>
<a target=”_blank” href=”#” class=”fa-subscribe”><span class=”social-counter”>33,175</span><span class=”s-text”>Subscribe us on <strong>YouTube</strong></span></a>
<div class=”clear”></div>
</div>

Remove # With Your Social Media Links

Change this Numbers with your actual Followers on Social Media

Design-5

<style>
ul.techornate-social-share{padding:0;margin:0;overflow:hidden}ul.techornate-social-share li{list-style:none;float:left;margin-right:4%;width:48%;margin-bottom:10px;background:#fafafa;overflow:hidden}ul.techornate-social-share li a{text-decoration:none;display:inline-block;float:left;color:#fff;height:40px;width:40px;text-align:center;font-size:14px;line-height:40px;margin-right:16px;position:relative;transition:all .2s ease-in-out;-webkit-transition:all .2s ease-in-out;-moz-transition:all .2s ease-in-out;-o-transition:all .2s ease-in-out}ul.techornate-social-share li a:after{height:0;width:0;top:50%;left:100%;content:”;margin-top:-4px;position:absolute}ul.techornate-social-share li a.facebook{background:#436feb}ul.techornate-social-share li a.facebook:after{border:4px solid #436feb;border-top-color:transparent;border-bottom-color:transparent;border-right-color:transparent}ul.techornate-social-share li a.twitter{background:#43c9eb}ul.techornate-social-share li a.twitter:after{border:4px solid #43c9eb;border-top-color:transparent;border-bottom-color:transparent;border-right-color:transparent}ul.techornate-social-share li a.google{background:#f14133}ul.techornate-social-share li a.google:after{border:4px solid #f14133;border-top-color:transparent;border-bottom-color:transparent;border-right-color:transparent}ul.techornate-social-share li a.youtube{background:#b00}ul.techornate-social-share li a.youtube:after{border:4px solid #b00;border-top-color:transparent;border-bottom-color:transparent;border-right-color:transparent}ul.techornate-social-share li a:hover{opacity:.7}ul.techornate-social-share li span{font-size:12px;margin:0;line-height:15px;color:#999;font-weight:700;display:block}ul.techornate-social-share li span.scount-number{margin-top:5px;color:#333}ul.techornate-social-share li:nth-child(2n){margin-right:0}
</style>
<ul class=”techornate-social-share”>
<li> <a href=”#” class=”facebook”><i class=”fa fa-facebook”></i></a> <span class=”scount-number”>44,143</span> <span>Fans</span></li>
<li> <a href=”#” class=”twitter”><i class=”fa fa-twitter”></i></a> <span class=”scount-number”>39,505</span> <span>Followers</span></li>
<li> <a href=”#” class=”google”><i class=”fa fa-google-plus”></i></a> <span class=”scount-number”>25,203</span> <span>Followers</span></li>
<li> <a href=”#” class=”youtube”><i class=”fa fa-youtube”></i></a><span class=”scount-number”>7,456</span> <span>Subscribers</span></li>
</ul>


Remove # With Your Social Media Links

Change this Numbers with your actual Followers on Social Media

तो दोस्तों ये है Designs इन में से किसी एक को आपको Select करना है और उसके Code को बताये गए Steps की अनुसार लगाना है और लीजिये आपके Social Media Follow Buttons Ready है। आपको ये Post किसी लगी जरूर बताएगा नीचे Comment Section में और इस Post को Share करना न भूले। 

 

Blogger Tips Tricks(Must Read) –

Conclusion – 
 

तो दोस्तों आज हमने सीखा की Blog Me Social Media Follow Buttons Kaise Add kare. आशा करता हूँ की आपको सब कुछ अच्छे से समझ में आ गया होगा और अगर आपको कोई भी Problem आती है तो आप मुझे Comment करके बता सकते है या फिर आप मुझे Contact भी कर सकते है। 

[kkstarratings]
Summary
Review Date
Reviewed Item
Article
Author Rating
51star1star1star1star1star
Tags

Shakti Tamrakar

My name is Shakti Tamrakar, the Creator of this Blog. Love to Blog about Latest Technology Tips and Tricks, blogger tips and tricks, tech news, mobile reviews and many more.

Related Articles

Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.

Back to top button
Close
Close

Adblock Detected

Please consider supporting us by disabling your ad blocker