This article was originally posted on my personal blog
Social media share links are important for every website, and you can add them very easily! In this tutorial, we'll go over how we can add a share link for each social media platform directly in our HTML.
To test them right away, check this post on my personal blog
To add a share link to Twitter:
<a href="https://twitter.com/intent/tweet?text=Awesome%20Blog!&url=blog.shahednasser.com">Share on Twiter</a>
You can add the text parameter for the text you want in the tweet and the url parameter in case you want to add a URL to the tweet.
Make sure to encode the text or the URL first. You can try it out online here.
To add a share link to Facebook:
<a href="https://www.facebook.com/sharer/sharer.php?u=blog.shahednasser.com"e=Awesome%20Blog!">Share on Facebook</a>
The u parameter is used to specify the link and the quote parameter is used for the text.
Make sure to encode the text or the URL first. You can try it out online here.
To add a share link to Whatsapp:
<a href="https://wa.me/?text=Awesome%20Blog!%5Cn%20blog.shahednasser.com">Share on Whatsapp</a>
For Whatsapp there's only a text parameter so you can include both the text and the URL you want to send in it. Make sure to encode them first.
Telegram
To add a share link to Telegram:
<a href="https://t.me/share/url?url=blog.shahednasser.com&text=Awesome%20blog!">Share on Telegram</a>
You can include the text in the text parameter and the URL in the url parameter.
Make sure to encode the text or the URL first. You can try it out online here.
Tumblr
To share a link on Tumblr:
<a href="https://www.tumblr.com/widgets/share/tool?canonicalUrl=blog.shahednasser.com&caption=Awesome%20blog!&tags=test%2Chello">Share on Tumblr</a>
For Tumblr, you need to add the canonicalUrl parameter with the URL you want to share. Optionally, you can add caption with the text you want to include in the post and tags with the tags you want to include all comma-separated.
Make sure to encode the text or the URL first. You can try it out online here.
To share a link on Reddit:
<a href="https://www.reddit.com/submit?url=blog.shahednasser.com&title=Awesome%20Blog!">Share on Reddit</a>
The url parameter is for the URL you want to share and the title parameter is for the title of the post.
Make sure to encode the text or the URL first. You can try it out online here.
To share on LinkedIn:
<a href="https://www.linkedin.com/sharing/share-offsite/?url=blog.shahednasser.com">Share on LinkedIn</a>
Just include the URL in the url parameter.
Make sure to encode the text or the URL first. You can try it out online here.
Gmail
To share by Gmail:
<a href="https://mail.google.com/mail/u/0/?view=cm&to&su=Awesome+Blog!&body=https%3A%2F%2Fblog.shahednasser.com%0A&bcc&cc&fs=1&tf=1">Share by Gmail</a>
The parameters you can use in Gmail:
to: the email you want the email to be sent to
su: The subject of the email
body: the content of the email
bcc and cc: to set the bcc and cc of the email
All these parameters are optional. The only parameter that is required is view=cm and you shouldn't change it.
Make sure to encode the text or the URL first. You can try it out online here.
Top comments (3)
Here is a larger list.
Facebook "quote" not working 01.12.22
facebook share url parameter "quote" doesn't work !