Add Social Sharing Links to your Blog without widget JavaScript
I'm always trying to tidy up my blog layout and remove 'noise' but every time I try to remove those social sharing buttons for Twitter and Facebook I get a barrage of email asking me to put them back. Personally, I use bookmarklets in my browser for tweeting links, rather than relying on AddThis or ShareThis or any of the other garish sharing JavaScripts.
This sharing button thing is out of control. Links work too, folks. It's the web. Let's not have our blogs turn into Vegas Billboards.*
Twitter, Facebook and Google+ all offer JavaScript that they'd LOVE for you to add to your site. Tracking is one of the reasons that they'd love you to add these. That may or may not be a strong reason not to add their JavaScript, but a concrete reason not to is speed.
When you add three services' JavaScript you're adding three DNS lookups, three (or 20) HTTP requests for their JavaScript and images, and on and on. That JavaScript has to execute as well, of course, but the value it provides isn't justified over the speed and hassle involved in my opinion.
I wanted to add social sharing links without adding JavaScript. Fortunately all these services support sharing via simply visiting a URL. Stated differently, you can share via an HTTP GET.
Below, I'm adding "YOURURLHERE" in the places you'll want the URL for your blog post. You should change these templates for your own blog engineer. WordPress, BlogSpot, DasBlog, etc all have different macro formats. Your mileage may vary.
NOTE: Make sure you check that you have the right number of quotes and ampersands when adding these to your blog template.
Note that twitter's sharing format includes the URL, the Title and the "via" which is your twitter name.
<a href="https://twitter.com/intent/tweet?url=YOURURLHERE&text=YOURPOSTTITLEHERE&via=YOURTWITTERNAMEHERE">Twitter</a>
<a href="https://facebook.com/sharer.php?u=YOURURLHERE">Facebook</a>
Google+
<a href="https://plus.google.com/share?url=YOURURLHERE">Google+</a>
You can share THIS post by clicking the links just below here on the same line as the Comments link.
Let me know about other social sites that support this kind of sharing in the comments, and I'll add your tips to this post.
* Yes, I know I have ads on this blog. It's taco money and it pays for the gadgets I review. It's hardly Vegas.
About Scott
Scott Hanselman is a former professor, former Chief Architect in finance, now speaker, consultant, father, diabetic, and Microsoft employee. He is a failed stand-up comic, a cornrower, and a book author.
About Newsletter
Great post, but it would have been even more effective if you showed how to fire a google analytics event when people clicked on those share links. One of the really nice things about using a social sharing widget from addthis or what not is that it manages much of the analytics gathering and reporting piece for you. Using your own links is great, but tying it into your tracking and reporting would make this advice really useful!
href="mailto:?subject=EMAIL_SUBJECT&body=EMAIL_BODY
http://feeds.hanselman.com/~/t/0/0/scotthanselman/~https://twitter.com/intent/tweet?url=YOURURLHERE&text=YOURPOSTTITLEHERE&via=YOURTWITTERNAMEHERE
http://feeds.hanselman.com/~/t/0/0/scotthanselman/~https://facebook.com/sharer.php?u=YOURURLHERE
http://feeds.hanselman.com/~/t/0/0/scotthanselman/~https://plus.google.com/share?url=YOURURLHERE
Thought I'd mention it since this might end up confusing some people into thinking they also have to add the Feedburner pieces ... :-)
Pinterest share URL
http://pinterest.com/pin/create/button/?url=url
Optional - description and/or image URL you can add to the end of the URL:
&description=This+page+is+really+cool
&media=URL of image to pin
Want the plugin? Get it here: http://joshbroton.com/clean-social-share-widget-a-wordpress-plugin/
Thanks again, Scott, and keep up the amazing work.
Linkedin: http://www.linkedin.com/shareArticle?mini=true&url=YOURURLHERE
Digg: http://digg.com/submit?url=YOURURLHERE
Reddit: http://reddit.com/submit?url=YOURURLHERE&title=YOURTITLE
Enjoy!
This was a couple of years ago though, it might not be a problem now.
Wouldn't it better to open up these share pages in a new tab? That way you still have the original page you were on still open.
"https://www.facebook.com/sharer.php?s=100&p[url]=YOUR-URL-HERE[images][0]=IMAGE-URL-HERE&p[title]=YOUR-TITLE-HERE&p[summary]=YOUR-SUMMARY-HERE "&URLEncode("#")&"YOUR-HASHTAG-HERE"
I'm using the same blog platform as yours and I'm having trouble finding one?
Thanks a lot!
Comments are closed.
Also, those URLs should be HTTPS.