Official Social Share Button Script

Adding official social share buttons and icons to website using script no plugin needed use without any core file change. Recently when I made changes into website just learn little bit more about this so I’m posting these code which should work on any kind of website platform then may be it’s a WordPress, Magento,  blogger or simple HTML based means on approximately all on web based platform.

For Facebook Like Button With Count

<div id="fb-root"></div>
<script>(function(d, s, id) {
 var js, fjs = d.getElementsByTagName(s)[0];
 if (d.getElementById(id)) return;
 js = d.createElement(s); js.id = id;
 js.src = "//connect.facebook.net/en_US/all.js#xfbml=1";
 fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>

<div class="fb-share-button" data-type="button_count" data-height="26px"></div>

Google Plus Button With Count

<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>

Twitter Button With Count

<a href="https://twitter.com/share" class="twitter-share-button">Tweet</a>
<script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0];if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src="//platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");</script>

LinkedIn Button With Count

<script src="//platform.linkedin.com/in.js" type="text/javascript">
 lang: en_US
</script>
<script type="IN/Share" data-counter="right"></script>

Pinterest Button With Count

<a href="//www.pinterest.com/pin/create/button/" data-pin-do="buttonBookmark" ><img src="//assets.pinterest.com/images/pidgets/pin_it_button.png" /></a><script type="text/javascript" src="//assets.pinterest.com/js/pinit.js"></script>

These button share your current page URL to social media website you can change associated image to these social media as well. Currently I’m including current page link script for WordPress read our post how to generate current page URL in different website script. You just need to change <?php esc_url(the_permalink()); ?> with your own code in below code.

 <ul class="sideshare">
 <li class="fb"><a href="https://www.facebook.com/sharer/sharer.php?u=<?php esc_url(the_permalink()); ?>"><i class="fa fa-facebook"></i></a></li>
 <li class="tw"><a href="https://twitter.com/home?status=<?php esc_url(the_permalink()); ?>"><i class="fa fa-twitter"></i></a></li>
 <li class="gp"><a href="https://plus.google.com/share?url=<?php esc_url(the_permalink()); ?>"><i class="fa fa-google-plus"></i></a></li>
 <li class="li"><a href="https://www.linkedin.com/shareArticle?mini=true&url=&title=&summary=&source=<?php esc_url(the_permalink()); ?>"><i class="fa fa-linkedin"></i></a></li>

 </ul>

If you have more codes or need help please comment in below comment section and found this helpful then subscribe to our blog.