in

How to add social media share icon in blogger post WhatsApp

सोशल मीडिया शेयर आइकन व्हाट्सएप, फेसबुक, ट्विटर या प्रिंट कैसे वेबसाइट ब्लॉग में जोड़ें? How to add social media share icon in blogger post WhatsApp

सोशल मीडिया लिंक आइकन सरल है, आपका सोशल मीडिया पेज जैसे फेसबुक पेज, ट्विटर प्रोफाइल, गूगल प्लस या किसी अन्य वेबसाइट आइकन लिंक। लेकिन सोशल मीडिया शेयर आइकन इससे अलग है।

How to add social media share icon

सोशल मीडिया पोस्ट शेयर आइकन आगंतुकों को अपने फेसबुक, व्हाट्सएप, ट्विटर आदि पर पोस्ट साझा करने में मदद कर सकते हैं .. अब मुख्य बिंदु पर आते है कि अपने ब्लॉग पर ब्लॉगर पोस्ट शेयर आइकन का उपयोग कैसे करें। चरण दर चरण समझने के लिए पूरा लेख पढ़ें।

Share Button For Blogger
Add Post share Social media icon in blogger

यहाँ मैं आपको दो तरीके बता रहा हूँ जो आपके ब्लॉगर पर सोशल मीडिया पोस्ट शेयर आइकन स्थापित करने में मदद करते हैं। Also Read :- Signal Android Application का उपयोग क्यों करें?

How to add social media blogger post share icon whatsapp, facebook, twitter or print icon.

Method – 1 Use sharethis plugin

यह तरीका आपको डैशबोर्ड फंक्शन देगा जहाँ आप शेयर गणना और डेटा का विश्लेषण करते हैं।

  • Step-1 open sharethis.com website and register yourself
  • Step-2 when you finished register processes then select icons which you need.
  • Step-3 click on get code copy this code, message show like below.

Get the code: copy and install sharethis.js

  • Step-4 after copy this paste in your blogger <head>paste here</head>
  • Step-5 return back on sharethis website and click on verify.
  • Step-6 copy this (<div class=”sharethis-inline-share-buttons”></div>) and paste where you want  to display social media post share icons.

Method – 2 Social Media Post Share script

Copy below code and paste in your in your Blogger Template Sign in -> Click on Theme -> Click On Edit Html 
Paste code above where Related post start or according to your choice where you want to dAdd the copied code to your theme’s source code. Keep in mind that the share button is mostly at the beginning or end of the article. Or you can add any place according to you.

<!-- Share Button Start -->
<span class='sharethis'><b>If this information helpful/enjoyful for you then Plz share this or save as Print/PDF you can edit me </b><br/><whatsapp expr:href='data:post.url' expr:text='data:post.title'/><a class='wh social-popup' expr:href='&quot;whatsapp://send?text=&quot; + data:post.title + &quot; &gt;&gt; &quot; + data:post.url' rel='nofollow' target='_blank'><i class='fa fa-whatsapp'/> Whatsapp</a><a class='pt social-popup' onClick='window.print()' rel='nofollow' style='cursor:pointer'><i class='fa fa-print pttea'/>Print</a></span><script type='text/javascript'>//<![CDATA[var siteurl = window.location.href;  document.write('<span class="sharethis"> \<a class="fb social-popup" href="https://www.facebook.com/sharer/sharer.php?u=' + siteurl + '" target="_blank" title="Share to Facebook">\    <i class="fa fa-facebook fbtea"></i> Facebook</a> \<a class="tw social-popup" href="https://twitter.com/intent/tweet?text='+encodeURIComponent(document.title)+'&url='+siteurl+'" target="_blank" title="Share to Twitter">\    <i class="fa fa-twitter twtea"></i> Twitter</a> \</span>\');//]]></script><!-- Share Button End -->

/* Use CSS  You can customize */
.sharethis a.fb,.sharethis a.tw, .sharethis a.wh, .sharethis a.pt,.sharethis span.pl{text-decoration:none!important;display:inline-block;margin:0 5px 5px 0;font-weight:400;border-radius:2px;color:#fff;text-shadow:none;padding:6px 12px;opacity:1;transition:all .3s}
.sharethis a.fb {background:#3B5A9B;}
.sharethis a.pt {background:#332e2e;}
.sharethis a.tw {background:#3498db;}
.sharethis a.wh {background:#78da54;}
.sharethis a i{margin:0 5px 0 0}
.fbtea,.gotea, whtea, pttea,.plustea,.twtea{font-size:13px!important;vertical-align:middle}
.sharethis a.fb:hover,.sharethis a.tw:hover,.sharethis span.pl:hover{color:#fff;opacity:.9}
.sharethis a.fb:active,.sharethis a.tw:active, .sharethis a.wh, .sharethis a.pt,.sharethis span.pl:active{box-shadow:inset 0 1px 0 rgba(0,0,0,.16)}

Leave a Reply