The first things is a create a button using an image (here you can download some amazing button) under an example of clickable button with using HTML code
<a href=”#”><img src=”social.png”></a>
A Visual Example of clickable button
Now the last thing to do a to use the API of every single social to create the share event, in the button create previously you have to add in href section the below URL for Every Single Social
where you will see <SITE> is your URL to share, <TITLE> is the title to insert into the share(where is allow), <TAG> Used to TAG your Page
| SOCIAL | URL |
|---|---|
| http://www.facebook.com/sharer.php?u=<SITE> | |
| http://twitter.com/share?url=<SITE>&text=<TITLE>@<TAG> | |
| Google+ | https://plus.google.com/share?url=<SITE> |
| Tumblr | http://www.tumblr.com/share/link?url=<SITE>&name=<TITLE> |
| javascript:void((function()%7Bvar%20e=document.createElement(‘script’);e.setAttribute(‘type’,’text/javascript’);e.setAttribute(‘charset’,’UTF-8′);e.setAttribute(‘src’,’http://assets.pinterest.com/js/pinmarklet.js?r=’+Math.random()*99999999);document.body.appendChild(e)%7D)()); | |
| Linekdin | http://www.linkedin.com/shareArticle?mini=true&url=<SITE> |
| Buffer | https://bufferapp.com/add?url=<SITE>&text=%20<TITLE> |
| Digg | http://www.digg.com/submit?url=<SITE> |
| http://reddit.com/submit?url=<SITE>&title=<TITLE> | |
| Flattr | https://flattr.com/submit/auto?\user_id=&url=<SITE> |
| StumbleUpon | http://www.stumbleupon.com/submit?url=<SITE>&title=<TITLE> |
Example of HTML code with Google+
<a href=”https://plus.google.com/share?url=http://www.manazag.com”><img src=”/images/google.png”></a>
Here a clickable button
now finally you have a new one cool share button for the most popular social in the world
AN ADVISE: if you use this button into an email(for example into a newsletter) some email provider can report it as spam or phishing mail, to get around this problem i ussually shorten the URL above with site like
http://bit.ly
http://tinyurl.com