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 April 11, 2022 by Md Arshad Noor 2 Comments

दोस्तों आपने तो 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

  • [Launched] BloggingHindi Forum: Sawal Puchhiye Aur Jawab Janiye

    [Launched] BloggingHindi Forum: Sawal Puchhiye Aur Jawab Janiye

  • Blog me Anti AdBlock ko Add Karke Adsense Earning 50% Increase kare

    Blog me Anti AdBlock ko Add Karke Adsense Earning 50% Increase kare

  • Blog me Page navigation kaise add kare

    Blog me Page navigation kaise add kare

  • Post publish karne se pahle yaad rakhe 12 important points

    Post publish karne se pahle yaad rakhe 12 important points

About Md Arshad Noor

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

COMMENTs ( 2 )

  1. Md Arshad Noor says

    Welcome

    Reply
  2. Social Graphic says

    You have an excellent topic for this trending social media times!!!!!!!!! I respect your posting because this very helps full for me!!!!!!!!!!

    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.

Useful Articles

Google Keyword Ranking Check karne ke liye 5 Best Website

Website Ko User Friendly Banane Ke Liye 5 Secrets

PHP Version Ko Upgrade Karke Site Speed Ko 20% Increase Kare

WordPress Toolbar/Adminbar Ko Hide Aur Customize Kaise Kare

Adsense Account Kaise Banaye [Step By Step]

Blogging Ke 10 Important Myths ke Bare Me Apko Pata Hona Chahiye

Hostlelo Review – A Great Solution for New Bloggers

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

Blog Me Live Cricket Score Widget Kaise Add Kare

7 Karn WordPress Me Jyada Plugin Use Nahi Karni Chahiye

Directory Browsing Kya Hota Hai-Isko Disable Karne Ke 2 Tarike

Twitter Account Ko Secure Kaise Rakhe

Blog ko Delete kaise kare aur Delete kiya hua blog wapas kaise laye

About Us

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

SUBSCRIBE OUR NEWSLATTER

हमारे नवीनतम पोस्ट की सूचना एवं उपयोगी सामग्री प्राप्त करने के लिए हमसे जुड़ें

Posts for WP Users:

JetPack Social Sharing Buttons Ko Stylish Aur Colorful Kaise Banaye

WordPress.com Ki 5 Kamiya – Apko Janna Chahiye

WordPress Header Se Unnecessary Tags Kaise Remove Kare [Better Speed & Security Ke Liye]

WordPress Me Login Username Kaise Change Kare [3 Methods]

WordPress Ke Text Widget Me PHP Kaise Use Kare

More Posts from this Category

DMCA.com Protection Status

Recommended For You

Godaddy Domain Ko Hoatgator Hosting Par Point Kaise Kare

FeedBurner Me Email Delivery Time Kaise Change Kare [Easily]

SEO Friendly Post Kaise Likhe Jayada Se Jyada Traffic Pane Ke Liye

Google AMP Kya Hai? Complete Information Iske Bare Me

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

Off Page SEO Optimization Karke Blog ki Traffic High Kare 10+ Tips

Copyright © 2021 - All rights reserved. AboutContactSitemapDisclaimer