Skip to content

Instantly share code, notes, and snippets.

@DougBeney
Created June 7, 2016 18:58
Show Gist options
  • Select an option

  • Save DougBeney/f760798a2bf4a5e8dde2c1023de8fda8 to your computer and use it in GitHub Desktop.

Select an option

Save DougBeney/f760798a2bf4a5e8dde2c1023de8fda8 to your computer and use it in GitHub Desktop.
Add social sharing buttons to the top of all your Wordpress posts. (Add this code inside of functions.php)
function crunchify_social_sharing_buttons($content) {
if(is_singular() || is_home()){
// Get current page URL
$crunchifyURL = get_permalink();
// Get current page title
$crunchifyTitle = str_replace( ' ', '%20', get_the_title());
// Get Post Thumbnail for pinterest
$crunchifyThumbnail = wp_get_attachment_image_src( get_post_thumbnail_id( $post->ID ), 'full' );
// Construct sharing URL without using any script
$twitterURL = 'https://twitter.com/intent/tweet?text='.$crunchifyTitle.'&url='.$crunchifyURL.'&via=1DesignLife';
$facebookURL = 'https://www.facebook.com/sharer/sharer.php?u='.$crunchifyURL;
$googleURL = 'https://plus.google.com/share?url='.$crunchifyURL;
$bufferURL = 'https://bufferapp.com/add?url='.$crunchifyURL.'&text='.$crunchifyTitle;
// Based on popular demand added Pinterest too
$pinterestURL = 'https://pinterest.com/pin/create/button/?url='.$crunchifyURL.'&media='.$crunchifyThumbnail[0].'&description='.$crunchifyTitle;
// Add sharing button at the end of page/page content
$variable .= '<!-- Crunchify.com social sharing. Get your copy here: http://crunfy.me/1EFBLtA -->';
$variable .= '<div class="crunchify-social">';
$variable .= '<a class="crunchify-link crunchify-twitter" href="'. $twitterURL .'" target="_blank">Twitter</a>';
$variable .= '<a class="crunchify-link crunchify-facebook" href="'.$facebookURL.'" target="_blank">Facebook</a>';
$variable .= '<a class="crunchify-link crunchify-googleplus" href="'.$googleURL.'" target="_blank">Google+</a>';
$variable .= '<a class="crunchify-link crunchify-buffer" href="'.$bufferURL.'" target="_blank">Buffer</a>';
$variable .= '<a class="crunchify-link crunchify-pinterest" href="'.$pinterestURL.'" target="_blank">Pin It</a>';
$variable .= '</div>';
return $variable.$content;
}else{
// if not a post/page then don't include sharing button
return $variable.$content;
}
};
add_filter( 'the_content', 'crunchify_social_sharing_buttons');
Style.css
.crunchify-link {
padding: 4px 8px 6px 8px;
color: white;
font-size: 12px;
border-radius: 2px;
margin-right: 2px;
cursor: pointer;
-moz-background-clip: padding;
-webkit-background-clip: padding-box;
box-shadow: inset 0 -3px 0 rgba(0,0,0,.2);
-moz-box-shadow: inset 0 -3px 0 rgba(0,0,0,.2);
-webkit-box-shadow: inset 0 -3px 0 rgba(0,0,0,.2);
}
.crunchify-link:hover,.crunchify-link:active {
color: white;
}
.crunchify-twitter {
background: #00aced;
}
.crunchify-twitter:hover,.crunchify-twitter:active {
background: #0084b4;
}
.crunchify-facebook {
background: #3B5997;
}
.crunchify-facebook:hover,.crunchify-facebook:active {
background: #2d4372;
}
.crunchify-googleplus {
background: #D64937;
}
.crunchify-googleplus:hover,.crunchify-googleplus:active {
background: #b53525;
}
.crunchify-buffer {
background: #444;
}
.crunchify-buffer:hover,.crunchify-buffer:active {
background: #222;
}
.crunchify-pinterest {
background: #bd081c;
}
.crunchify-pinterest:hover,.crunchify-pinterest:active {
background: #bd081c;
}
.crunchify-social {
margin: 0px 0px 25px 0px;
-webkit-font-smoothing: antialiased;
font-size: 12px;
}
a.crunchify-link {
color: white !Important;
}
a.crunchify-link:hover {
text-decoration: none;
}

ghost commented May 19, 2018

Copy link
Copy Markdown

Thanks for sharing Crunchify Code Doug. Can you please make below corrections?

  1. Change Short link in above code snippet from http://crunfy.me/1EFBLtA to http://crunchify.me/2aAAlvK
  2. Twitter via=1DesignLife to via=Crunchify
  3. Provide proper credit in the top of the code snippet with URL: https://crunchify.com/how-to-create-social-sharing-button-without-any-plugin-and-script-loading-wordpress-speed-optimization-goal/

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment