Sometimes you want a “share” link in your website or email newsletter but you don’t want the extra JavaScript and iframes that come with the standard social media buttons. Here’s how to do it, giving your users faster page loading times and a bit more privacy.
Firstly Twitter, who like to make it easy for us. It’s possible to use twitter.com/home or twitter.com/share but the most useful sharing URL is this:
https://twitter.com/intent/tweet?
- Parameters:
url,text - Encode parameters? Yes
The difference is that the user will see a friendly “Share a link with your followers” heading rather than the usual “What’s happening?”. Not only that, but the text within the Tweet is highlighted to make it immediately editable. Nice touch.
Example
<a href="https://twitter.com/intent/tweet?text=Static%20social%20media%20%22share%22%20buttons&url=http%3a%2f%2fdaniemon.com%2fblog%2fstatic-social-media-share-buttons%2f">
Share on Twitter
</a>
Try it out here: Share on Twitter
Documentation
Despite having an official “Share” button in the past, Facebook have now deprecated it in favour of the ubiquitous “Like” button. For backwards compatibility, however, the “Share” URL still works:
https://www.facebook.com/sharer/sharer.php?
- Parameters:
u(URL) - Encode parameters? Yes
Example
<a href="https://www.facebook.com/sharer/sharer.php?u=http%3a%2f%2fdaniemon.com%2fblog%2fstatic-social-media-share-buttons%2f">
Share on Facebook
</a>
Try it out here: Share on Facebook
Documentation
Apparently sharing links on LinkedIn is very good for SEO so this could be an important one to include. The base URL is:
http://www.linkedin.com/shareArticle?
- Parameters:
url,title,summary - Encode parameters? Yes
Example
<a href="http://www.linkedin.com/shareArticle?url=http%3a%2f%2fdaniemon.com%2fblog%2fstatic-social-media-share-buttons%2f&title=Static%20social%20media%20%22share%22%20buttons&summary=How%20to%20build%20social%20media%20sharing%20links%20without%20JavaScript%20and%20iframes.">
Share on LinkedIn
</a>
Try it out here: Share on LinkedIn
Documentation
The relatively new kid on the block is Pinterest. Note that for it to work properly, you should include the media parameter and point it to an image at least 750 pixels wide. The base URL is:
http://pinterest.com/pin/create/button/?
- Parameters:
url,description,media - Encode parameters? Yes
Example
<a href="http://pinterest.com/pin/create/button/?url=http%3a%2f%2fdaniemon.com%2fblog%2fstatic-social-media-share-buttons%2f&description=Static%20social%20media%20%22share%22%20buttons&media=http%3a%2f%2fdaniemon.com%2fblog%2fwp-content%2fuploads%2f2012%2f09%2fstatic-social-media-buttons.png">
Share on Pinterest
</a>
Try it out here: Share on Pinterest
Documentation
Google+
Let’s not forget Google who have a bookmarking service, however this has now largely been usurped by Google+ which uses this URL:
https://plus.google.com/share?
- Parameters:
url,hl(human language, e.g. “en”, “ja”, etc. – optional) - Encode parameters? Yes
Example
<a href="https://plus.google.com/share?url=http%3a%2f%2fdaniemon.com%2fblog%2fstatic-social-media-share-buttons%2f">
Share on Google+
</a>
Try it out here: Share on Google+
Documentation
Hatena Bookmarks
Hatena Bookmarks is a popular bookmarking site in Japan, particularly among the tech crowd. It uses this URL:
http://b.hatena.ne.jp/entry/
- Parameters: None – just append your target URL
- Encode parameters? No
Example
<a href="http://b.hatena.ne.jp/entry/http://daniemon.com/blog/static-social-media-share-buttons/">
Share on Hatena Bookmarks
</a>
Try it out here: Share on Hatena Bookmarks
Documentation
- Sharing link & buttons (Japanese)
Daniemon's Blog 
