how to create social media share buttons in wordpress plugin

how to create social media share buttons in wordpress plugin

In this Post we will show you how to create social media share buttons in wordpress plugin. with use of shortcode we will create a plugin to create social media share buttons on Buffer, diggit, Email, Facebook, Google+, LinkedIn, Pinterest, Print, Reddit, StumbleUpon, Tumblr, Twitter, vkontakte and Yummly social media.

In thos code we get post name and url of post and pass it as share url and title. we pass ad shortcode in post/page and it will reflect share button code with title and url of post/page.

hear we use [social_media_sharing] as shortcode in post/page. in code we get usl of post and pass it into and add this css in your css file.

Social Media Sharing Buttons for WordPress with shortcode.
Social Media Sharing Buttons for WordPress with shortcode.

CSS

#button_share img {
width: 36px;
box-shadow: 0;
padding: 6px;
display: inline;
border: 0;
}

wordpress plugin code
social_media_sharing.php

<?php
/*
* Plugin Name: Social Media Sharing Buttons
* Description: Social Media Sharing Buttons for WordPress with shortcode.
* Version: 1.0
* Author: Dhaval Dave
* Author URI: http://www.onlinecode/blog
*/

// social_media_sharing
function social_media_sharing_wp($atts, $content=null)
{
	// post url
	$post_url = get_permalink($post->ID);
	// post title
	$post_title = get_the_title($post->ID);
	
	
?>
<!-- <a> tab for http://www.onlinecode/blog share link for social media -->
<div id="button_share">
    
    <!-- Buffer Social Media -->
    <a href="https://bufferapp.com/add?url=<?=$post_url?>&amp;text=<?=$post_title?>" target="_blank">
        <img src="http://www.onlinecode/example/images/buffer.png" alt="Buffer share link" />
    </a>
    
    <!-- Digg Social Media -->
    <a href="http://www.digg.com/submit?url=<?=$post_url?>" target="_blank">
        <img src="http://www.onlinecode/example/images/diggit.png" alt="Digg  share link" />
    </a>
    
    <!-- Email Social Media -->
    <a href="mailto:?Subject=<?=$post_title?>&amp;Body=I%20saw%20this%20and%20thought%20of%20you!%20 <?=$post_url?>">
        <img src="http://www.onlinecode/example/images/email.png" alt="Email share link" />
    </a>
 
    <!-- Facebook Social Media -->
    <a href="http://www.facebook.com/sharer.php?u=<?=$post_url?>" target="_blank">
        <img src="http://www.onlinecode/example/images/facebook.png" alt="Facebook share link" />
    </a>
    
    <!-- Google+ Social Media -->
    <a href="https://plus.google.com/share?url=<?=$post_url?>" target="_blank">
        <img src="http://www.onlinecode/example/images/google.png" alt="Google share link" />
    </a>
    
    <!-- LinkedIn Social Media -->
    <a href="http://www.linkedin.com/shareArticle?mini=true&amp;url=<?=$post_url?>" target="_blank">
        <img src="http://www.onlinecode/example/images/linkedin.png" alt="LinkedIn share link" />
    </a>
    
    <!-- Pinterest Social Media -->
    <a href="javascript:void((function()%7Bvar%20e=document.createElement('script');e.setAttribute('type','text/javascript');e.setAttribute('charset','UTF-8');e.setAttribute('src','http://assets.pinterest.com/js/pinmarklet.js?r='+Math.random()*99999999);document.body.appendChild(e)%7D)());">
        <img src="http://www.onlinecode/example/images/pinterest.png" alt="Pinterest share link" />
    </a>
    
    <!-- Print Social Media -->
    <a href="javascript:;" onclick="window.print()">
        <img src="http://www.onlinecode/example/images/print.png" alt="Print share link" />
    </a>
    
    <!-- Reddit Social Media -->
    <a href="http://reddit.com/submit?url=<?=$post_url?>&amp;title=<?=$post_title?>" target="_blank">
        <img src="http://www.onlinecode/example/images/reddit.png" alt="Reddit share link" />
    </a>
    
    <!-- StumbleUpon Social Media -->
    <a href="http://www.stumbleupon.com/submit?url=<?=$post_url?>&amp;title=<?=$post_title?>" target="_blank">
        <img src="http://www.onlinecode/example/images/stumbleupon.png" alt="StumbleUpon share link" />
    </a>
    
    <!-- Tumblr Social Media -->
    <a href="http://www.tumblr.com/share/link?url=<?=$post_url?>&amp;title=<?=$post_title?>" target="_blank">
        <img src="http://www.onlinecode/example/images/tumblr.png" alt="Tumblr share link" />
    </a>
     
    <!-- Twitter Social Media -->
    <a href="https://twitter.com/share?url=<?=$post_url?>&amp;text=Simple%20Share%20Buttons&amp;hashtags=simplesharebuttons" target="_blank">
        <img src="http://www.onlinecode/example/images/twitter.png" alt="Twitter share link" />
    </a>
    
    <!-- vkontakte Social Media -->
    <a href="http://vkontakte.ru/share.php?url=<?=$post_url?>" target="_blank">
        <img src="http://www.onlinecode/example/images/vk.png" alt="VK share link" />
    </a>
    
    <!-- Yummly Social Media -->
    <a href="http://www.yummly.com/urb/verify?url=<?=$post_url?>&amp;title=<?=$post_title?>" target="_blank">
        <img src="http://www.onlinecode/example/images/yummly.png" alt="Yummly share link" />
    </a>

</div>
<?php

}
add_shortcode('social_media_sharing', 'social_media_sharing_wp');
?>

Demo Of Social Media Sharing

Shear hear for test social media sharing :

Leave a Comment

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

6  +  3  =  

We accept paid advance and paid guest Posting on our Site : Contact US