Social Sharing Buttons without Javascript in HTML Frontends
How to embed some social sharing buttons in a website without Javascript or any third party code
If you want to make a website easy to share, you actually don't need to require external javascript SDKs (including privacy violations) at all. All the major services do have a static HTTP endpoint you can link to. This example includes facebook, twitter and whatsapp:
<p class="sharing-buttons">
<a
target="_blank"
class="facebook"
href="//www.facebook.com/sharer/sharer.php?u={{url}}"
>Facebook</a
>
<a
target="_blank"
class="twitter"
href="//twitter.com/share?url={{url}}&text="
>Twitter</a
>
<a target="_blank" class="whatsapp" href="//wa.me/?text={{url}}">Whatsapp</a>
</p>
just replace {{url}}
with the current page url you want to get shared!
.sharing-buttons {
text-align: center;
a {
color: white;
text-decoration: none;
padding: 5px 10px;
display: inline-block;
}
a:hover {
color: white;
cursor: pointer;
}
.twitter {
background: #41b7d8;
}
.facebook {
background: #3b5997;
}
.whatsapp {
background: #25d366;
}
}
This SCSS snippet will make them look usable right away, but you can customize as you like.