BloggingHindi - Blogging Aur Internet Ki Sabhi Jankari

  • About Us
  • Contact Us
  • Blogging
  • WordPress
  • SEO

Blogspot Blog Me Social Media Share Button Kaise Lagaye?

Last Updated on January 5, 2021 by Md Arshad Noor 1 Comment

दोस्तों आपने तो Facebook, Twitter,Google Plus etc का नाम जरूर सुना होगा।क्योकि इंटरनेट पर कोई भी व्यक्ति Social Media से दूर नहीं है।बल्कि कोई कोई तो Social Networks के लिए ही इंटरनेट का प्रयोग करता है।इसीलिए इस पोस्ट में आपको अपने ब्लॉग के पोस्ट के निचे Social Media Share बटन कैसे लगाये।

image

बहुत से new bloggers तो इसमें भी गलती कर देता है की वो Social Share Button नहीं लगाता है।जिसकी वजह से उनको बहुत कम Traffic मिलता है।

Social Media Share Buttons क्यों लगाये।

दोस्तों इसको लगाने से हम जो Post लिखेंगे उसके निचे या ऊपर Social Share बटन होगा और visitors चाहेगा तो उसे अपने Friends तक आसानी से Share कर सकेगा।

Blog Me Social Media Share Buttons Kaise Lagaye?

दोस्तों इसके लिए आपको कुछ Steps Follow करने पड़ेंगे ।

Step 1:-सबसे पहले आप ब्लॉग के Dashboard>>Template>>Edit HTML में जाइये

Step 2: अब CTRL+F दबा कर <post.body></post.body> को find कीजिये.

Step 3:-उसके बईअद आप निचे दिए हुआ Code को कॉपी करके Past कर दीजिए।

<b:if cond='data:blog.pageType == "item"'>
<style>
@import url(http://fonts.googleapis.com/css?
family=Open Sans);
@import "//netdna.bootstrapcdn.com/font-
awesome/3.0/css/font-awesome.css";
#buttons {
width: 475px;
overflow: hidden;
margin: 70px auto 0;
}
.button {
float: left;
margin-right: 10px;
width: 110px;
background: #eaeaea;
border: 1px solid #cbcbcb;
border-radius: 3px;
-o-border-radius: 3px;
-ms-border-radius: 3px;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
box-shadow: inset 0 1px 0px #fdfdfd;
padding: 15px 5px 5px;
box-sizing: border-box;
}
.button i {
background: #c5c5c5;
color: #eaeaea;
text-align: center;
line-height: 40px;
font-size: 18px;
width: 40px;
height: 40px;
display: block;
margin: 0 auto 10px;
border-radius: 50%;
-o-border-radius: 50%;
-ms-border-radius: 50%;
-moz-border-radius: 50%;
-webkit-border-radius: 50%;
}
.social-container {
text-align: center;
text-transform: uppercase;
font-size: 12px;
color: #656565;
line-height: 54px;
font-family: Open Sans;
background: #d8d8d8;
width: 100%;
height: 45px;
box-shadow: inset 0 -2px 4px #c7c7c7;
border-radius: 3px;
-o-border-radius: 3px;
-ms-border-radius: 3px;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
position: relative;
overflow: hidden;
}
.slide, .button i {
-webkit-transition: all 0.2s ease-in-out;
-moz-transition: all 0.2s ease-in-out;
-ms-transition: all 0.2s ease-in-out;
-o-transition: all 0.2s ease-in-out;
}
.slide {
box-shadow: inset 0 2px 4px rgba(0, 0, 0,
0.15);
border-radius: 0 0 22px 22px;
-o-border-radius: 0 0 22px 22px;
-ms-border-radius: 0 0 22px 22px;
-moz-border-radius: 0 0 22px 22px;
-webkit-border-radius: 0 0 22px 22px;
/* top fix */
transition: all 0.2s ease-in-out;
position: absolute;
height: 45px;
width: 100%;
top: -35px;
}
.slide::after {
content: "";
display: block;
position: absolute;
width: 100%;
height: 10px;
box-shadow: inset 0 1px 0px #fdfdfd, 0
3px 0px #cdcdcd;
border-radius: 3px;
-o-border-radius: 3px;
-ms-border-radius: 3px;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
background: #eaeaea;
border: 1px solid #cbcbcb;
box-sizing: border-box;
bottom: 0;
}
.button:hover .slide {
top: 0;
border-radius: 3px;
}
.linkedin .IN-widget, .button iframe, .google #_
__plusone_0 {
top: -2px;
position: relative;
}
.twitter iframe {
width: 79px !important;
}
.google #___plusone_0 {
width: 60px !important;
}
.button.facebook:hover i, .facebook .slide {
background: #305c99;
color: white;
}
.button.twitter:hover i, .twitter .slide {
background: #00cdff;
color: white;
}
.button.google:hover i, .google .slide {
background: #d24228;
color: white;
}
.button.linkedin:hover i, .linkedin .slide {
background: #007bb6;
color: white;
}
.button.linkedin {
margin-right: 0;
}
.credit {
padding-left: 10px;
font-size: 14px;
color: #172b36;
position: absolute;
bottom: 0;
text-align: center;
font-family: Open Sans;
}
.credit a {
border-bottom: 2px solid #dc4106;
text-decoration: none;
padding: 0 0 2px;
color: #172b36;
}
</style>
<div id="buttons">
<div class="facebook button">
<i class="icon-facebook"></i>
<div class="social-container fb">
<div class="slide">
<iframe src="//www.facebook.com/plugins/
like.php?href=http%3A%2F%
2F developers.facebook.com %2Fdocs%
2Freference%2Fplugins%
2Flike&send=false&layout=button_
count&width=90&show_
faces=false&font&colorscheme=light&action=like&height=21&appId=56858
1339861351" scrolling="no" frameborder="0"
style="border:none; overflow:hidden;
width:81px; height:21px;" allowtran
sparency="true">
</iframe>
</div>
Facebook
</div>
</div>
<div class="twitter button">
<i class="icon-twitter"></i>
<div class="social-container tw">
<div class="slide">
<a href="https://twitter.com/share"
class="twitter-share-button" data-
via="mariuCSS">
Tweet </a>
<script>
!function(d,s,id){
var js,fjs=d.getElementsByTagName(s)[0]
,p=/^http:/.test(d.location)?'http':'https';
if(!d.getElementById(id)){
js=d.createElement(s);
js.id=id;
js.src=p '://platform.twitter.com/
widgets.js';fjs.parentNode.insertBefore(js,fjs);}
}(document, 'script', 'twitter-wjs');
</script>
</div>
Twitter
</div>
</div>
<div class="google button">
<i class="icon-google-plus"></i>
<div class="social-container tw">
<div class="slide">
<!-- Place this tag where you want the 1
button to render. -->
<div class="g-plusone" data-size="medium">
</div>
<!-- Place this tag after the last 1 button
tag. -->
<script type="text/javascript">
(function() {
var po = document.createElement('script');
po.type = 'text/javascript';
po.async = true;
po.src = 'https://apis.google.com/js/
plusone.js';
var s = document.getElementsByTagName
('script')[0];
s.parentNode.insertBefore(po, s);
}
)();
</script>
</div>
Google
</div>
</div>
<div class="linkedin button">
<i class="icon-linkedin"></i>
<div class="social-container tw">
<div class="slide">
<script src="//platform.linkedin.com/in.js"
type="text/javascript">
lang: en_US
</script>
<script type="IN/Share"></script>
</div>
LinkedIN
</div>
</div>
</div>
</b:if>

Note:-developers.facebook.com की जागह आप अपना Facebook page url डाल दीजिए।

You May Also Like

  • Blog Ke Owner Hone Ke Nate 5 Kaam Jarur Kare [Important Tips]

    Blog Ke Owner Hone Ke Nate 5 Kaam Jarur Kare [Important Tips]

  • ZohoMail Par Custom Domain Se Free Professional Email Address Kaise Banaye

    ZohoMail Par Custom Domain Se Free Professional Email Address Kaise Banaye

  • WordPress Blog Ke Theme Ko Export (Download) Kaise Kare – 2 Method

    WordPress Blog Ke Theme Ko Export (Download) Kaise Kare – 2 Method

  • Apni Online Presence Build Karne Ke Liye 5 Bacis Tips

    Apni Online Presence Build Karne Ke Liye 5 Bacis Tips

About Md Arshad Noor

हेलो दोस्तों, मेरा नाम मोहम्मद अरशद नूर है. में इस ब्लॉग में रेगुलर नई नई आर्टिकल्स लिखता हूँ. यहाँ पर हम ज्यादातर Blogging, Make Money, SEO, WordPress आदि से सम्बंधित Article मिलेगी. आपको हमारी लेख पसंद आती है तो इसे सोशल मीडिया में शेयर करें। अगर आपको कोई सहायता चाहिए तो कमेंट कीजिए।

COMMENTs ( 1 )

  1. Md Arshad Noor says

    Welcome

    Reply

Leave a Reply Cancel reply

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

Please do not spam! otherwise your comment will be removed.

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

Get it on Google Play

Useful Articles

Khush Nahi Rahne Wale Logo Ki 5 Buri Aadte

Revenue Hits kya hai aur isme Account kaise banaye

Blogspot Blog me Country Specific Redirect Disable kaise Kare

Spam Mail Sender Se Unsubscribe Karke Spam Mail Se Kaise Bache

Google Me Search Karne Ke Top 10 Tips & Trick – [Get Right Results Fast]

Google Search Results Me Blog Ke Sabhi Posts Me Star Rating Kaise Dikhaye

Blog Homepage Me Only Post Title Kaise Dikhaye

Blogging me fail hone ka 10 sabse Bada Karan

Social Media se More Traffic Pane ke Liye 10 Important Tips

Quora Se Blog Ki Traffic Kaise Badhaye? 5 Tips

Blog Post me Keyboard key kaise lagaye

YouTube Se PR9 Dofollow Backlink Kaise Receive Kare

Blog Post Copy Hone Par Copyright Post Me Automatic Apne Blog Ki Link Add Kare

About Us

mdarshadnoorहेल्लो दोस्तों, मेरा नाम मोहम्मद अरशद नूर है. में अररिया, बिहार का रहने वाला हूँ. मुझे नयी चीजें सीखना-सिखाना बहुत पसंद है. में पिछले 5 सालों से ब्लॉगिंग के फील्ड में हूँ. इस ब्लॉग में आपको ब्लॉगिंग और इन्टरनेट से सम्बन्धित जानकारी मिलेगी.

SUBSCRIBE OUR NEWSLATTER

हमारे ब्लॉग के रेगुलर विजिटर हो तो अभी Subscribe कर लीजिए ताकि आप हमारे नए पोस्ट को सबसे पहले पढ़ पाएँ!

Posts for WP Users:

WordPress Me Facebook Comment Box Ko Kaise Add Kare [Full Guide]

WordPress Me HTTP Request Ki Number Kam Karke Fast Banaye

Google Me Blog Ke Niche Search Box Sitelink Kaise Show Kare

WordPress Se jQuaru Strings Ko Remove/Fix Kaise Kare

Blog/Website Me Meta Tags Generator Tool Kaise Add Kare.

More Posts from this Category

Recommended For You

Disabled Gmail Account Ko Fir Se Re-Enable Kaise Kare [Full Process]

QR Code Kya Hai? QR Code Kaise Banaye aur Scan Kaise Kare

[Launched] BloggingHindi Forum: Sawal Puchhiye Aur Jawab Janiye

Blog Ki Traffic Kaise Badhaye? Top 10 Tips

Blog me Text Selection Disable Karke Content Copy Hone Se Bachaye

Post publish karne se pahle yaad rakhe 12 important points

100 Tips Search Engine Optimization Ke Liye – Search Engine Ka King Banne Ke Liye

Blogspot Blog Me Favicon Kaise Change Kare. 2 Methods

Blog Se Paise Kamana Hai To 5+1 Kaam Karna Chhodiye

Copyright © 2020 - All rights reserved.AboutContactSitemapDisclaimer