These are social media sharing buttons with NO JavaScript for WordPress single posts. This example includes a Google+ share link, a Twitter Tweet link, a Facebook share link, and a Pinterest “Pin it” link, all without JavaScript. Place the following HTML in your single.php where you want the buttons to appear. This also works in the sidebar for single posts.
<a target="_blank" href="https://plus.google.com/share?url=<?php echo urlencode(get_permalink()); ?>" class="simple-share ss-gplus" title="Share on G+" rel="nofollow">G+ Share</a> <a target="_blank" href="https://twitter.com/share?text=<?php echo urlencode( get_the_title() ); ?>" class="simple-share ss-twitter" title="Tweet" rel="nofollow">Tweet</a> <a target="_blank" href="http://www.facebook.com/sharer.php?u=<?php echo urlencode(get_permalink()); ?>" class="simple-share ss-facebook" title="Share on Facebook" rel="nofollow">Share</a> <a href="http://www.pinterest.com/pin/create/button/?url=<?php echo urlencode(get_permalink()); ?>&media=<?php if(has_post_thumbnail()) echo wp_get_attachment_url(get_post_thumbnail_id()); ?>&description=<?php echo urlencode( get_the_title() . ' - ' . get_permalink() ); ?>" class="simple-share ss-pinterest" target="_blank" rel="nofollow">Pin It</a>
You also need to add the following CSS to your stylesheet to make the button links take the color of their brands:
.simple-share {
margin:10px 5px;
line-height: 1;
color:#fff;
padding:3px 6px;
text-decoration:none;
}
.simple-share:hover{
color:#fff;
text-decoration:none;
}
.simple-share.ss-facebook {
background-color: #3B5998;
}
.simple-share.ss-twitter {
background-color:#00aced;
}
.simple-share.ss-gplus {
background-color:#dd4b39;
}
.simple-share.ss-pinterest {
background-color:#cb2027;
}
Variation
To add hashtags to the Tweet link, change the Tweet link from the HTML above, which looks like this:
<a target="_blank" href="https://twitter.com/share?text=<?php echo urlencode(get_the_title()); ?>" class="simple-share ss-twitter" title="Tweet" rel="nofollow">Tweet</a>
to this:
<a target="_blank" href="https://twitter.com/share?text=<?php echo urlencode(get_the_title()); ?>&hashtags=hashtag1,hashtag2" class="simple-share ss-twitter" title="Tweet" rel="nofollow">Tweet</a>
Change “hashtag1,hashtag2” to a comma-separated list of your own desired hashtags.
Dante J. Angels
December 16th, 2014 at 3:59 pm
Great! What if I want add an image to facebook share? Is it posible?
Isabel
December 17th, 2014 at 2:58 am
Yes, first Facebook checks if you added an Open Graph meta tag for an image, which looks like this:
If no “og:image” tag exists, then it will grab and share the featured image of the page.
Yolo Seo
September 29th, 2015 at 3:06 am
I implemented this on my own WordPress theme and works like a charm!!
Thx so much for a light weight solution to share buttons 🙂
nando
February 26th, 2016 at 12:35 pm
good.
i have added to my website.
in others themes not work in single.php but works fine in content-single.php.
my sites already are not so heavy.
all good for you and and many happy returns.
thank you.