Easily Share to Social Media using Links

Almost all social networks bring widgets, known as buttons or social plugins, with which a user can Share a URL or “Like” a page. The code they provide is based mostly on javascript.

Here are some examples: Facebook Social Plugins, Twitter widgets, Google+ plugins, Pinterest buttons and widgets, Reddit buttons, Instagram badges and more.

There is an alternative way to share a page using just an html link, without javascript. Why is it useful? Just because they don’t use javascript, these links could be used in cases where javascript is not available, as inside mail or RSS. Moreover, there are simple to create and they never cause a page to slow down, something that may happen sometimes with classic buttons. But, they don’t have the rich functionality of classic widgets, they can just share a page.

Classic buttons and widgets remain our first choice. As they are very popular, visitors are familiar with them, so the possibility to click them is higher. Classic buttons and widgets can display how many times a link was shared, which encourage visitors to share already popular links (the so-called “social proof” effect).

Please, note that URL or other parameters of the link must be encoded in case they are contain spaces or special characters. There are many online tools to encode a url string. You can use your own favorite, else try URL Decoder/Encoder.

Lets create a custom share link for the major social networks.

Facebook

To create the link, use the following formula:

http://www.facebook.com/sharer.php?u=URL

This text link:      Share on Facebook

can be created with the following html code

<a
        href="http://www.facebook.com/sharer.php?u=http://www.pontikis.net"
        target="_blank"
        title="Click to share">Share on Facebook
</a>

This image link:     

can be created with the following html code

<a
        href="http://www.facebook.com/sharer.php?u=http://www.pontikis.net"
        target="_blank"
        title="Click to share"><img src="/path/to/image">
</a>

Twitter

To create the link, use the following formula:

http://twitter.com/share?text=TEXT&url=URL

This text link:      Tweet this

can be created with the following html code

<a
        href="http://twitter.com/share?text=An%20intersting%20blog&url=http://www.pontikis.net"
        target="_blank"
        title="Click to post to Twitter">Tweet this
</a>

Note that text: An intersting blog has been encoded to: An%20intersting%20blog

This image link:     

can be created with the following html code

<a
        href="http://twitter.com/share?text=An%20intersting%20blog&url=http://www.pontikis.net"
        target="_blank"
        title="Click to post to Twitter"><img src="/path/to/image">
</a>

Google plus

To create the link, use the following formula:

https://plus.google.com/share?url=URL

This text link:      Share on Google+

can be created with the following html code

<a
        href="https://plus.google.com/share?url=http://www.pontikis.net"
        target="_blank"
        title="Click to share">Share on Google+
</a>

This image link:     

can be created with the following html code

<a
        href="https://plus.google.com/share?url=http://www.pontikis.net"
        target="_blank"
        title="Click to share"><img src="/path/to/image">
</a>

Happy sharing!