Better Social and Share ButtonsRTFM, but know that it sometimes hides options
Social and share buttons seem to be a must-have nowadays, but following the official docs for these may not be the best option for an efficient solution.
What’s Wrong with the Documented Solutions #
First and foremost, what’s often reproached to those scripts is that they include/are trackers. Some of these companies are known to use these scripts to build your visitors’ profile even if they don’t have an account on their service.
So, by including those in your page, you help big tech companies collecting data about users that are too often non-informed and non-willing. OK, that’s less true now that GDPR requires consent before loading this kind of script, but that’s assuming that websites are well made and don’t load external “partner” resources before this consent is given.1
There are alternative ways to make share buttons (we’ll see them below), but I suspect this is the main reason why the documentation does not speak about them.
Data is the new
gold oil blood, so why propose a clean way if there’s one that’ll help collect it?
User Experience #
That’s why I’m trying to keep this website minimalist, why there’s not a big, nice picture of share buttons at the top of this page.
So, if you could avoid including a script that’ll in turn fetch CSS, images and other scripts, you’d spare the planet a bit.
What You Can Do Instead #
A Simple Link Suffices #
I wrote earlier that there are alternative ways to build share buttons. If you inspect the bottom of this page, you’ll see that the buttons I use are simply… web links. Nothing more.
Actually, you could even see the template responsible for these on the website’s repo.
Some Generators Examples #
This solution is so simple that several link generator exists.
- The Share Link Generator is quite pretty and has a clean, non-cluttered UI.
- The Share Link Creator’s UI is a bit heavier, but enter your page’s address once to get all share links at once.
- The Social Share Link Generator is impressive because of the array of share possibilities (including apps such as WhatsApp, Telegram and so on).
Templates for Your Website #
In all cases, the link will open the corresponding social network, preparing an empty message with a link to your page. The visitor will be able to edit it before submitting, or cancel it altogether.
For Facebook, Twitter and LinkedIn, you can just try with the buttons at the bottom on the page. Nothing will appear on your profile before you confirm.
https://twitter.com/intent/tweet?url=https://yoursite.com/your-page&title=Your Title&text=You can add a message&via=aLittleBirdie
As you can see, you can add some parameters to this URL. You can include:
title: your page’s title;
via: your Twitter profile;
text: some predefined message.
All of these parameters are optional.
This link will open Twitter and prepare a tweet. In the case of this example, the tweet would read: Your Title You can add a message https://yoursite.com/your-page via @aLittleBirdie It can, of course, be edited before sending.
Here, you can specify a media and a description. I won’t be able to give you a link to test this one, though. You’ll have to try it out with your own pages. :)
Spoiler: in many cases, websites still store cookies and load scripts before consent is given, which is contrary to the GDPR. ↩︎
For the sake of simplicity, all examples use clear URLs, but I’d recommend URL-encoding all query parameters. ↩︎