Social media buttons without JavaScript

You don’t need JavaScript to add social media buttons to your website. But I see JavaScript-based social buttons on websites every day. And these buttons are not about privacy. Let’s see how to create such buttons using <a href="...">.

Twitter

<a href="https://twitter.com/intent/tweet?text=Awesome+article&url=https%3A%2F%2Fmefody.dev&hashtags=html,css&via=dev_tip" target="_blank">
Share on Twitter
</a>

Parameters:

The complete text of the tweet will be Awesome article https://mefody.dev #html #css via @dev_tip.

Documentation: Tweet button

Facebook

<a href="https://www.facebook.com/sharer.php?u=https://mefody.dev" target="_blank">
Share on Facebook
</a>

Parameters:

Unfortunately, the Facebook sharer no longer supports any customization. If you need custom text, try to use Dialog for that:

https://www.facebook.com/dialog/share?app_id=42&display=popup&href=https%3A%2F%2Fmefody.dev

But this way requires app_id, so you have to register your Facebook app. Not very friendly.

Documentation: Facebook Share

VK

<a href="http://vk.com/share.php?url=https://mefody.dev" target="_blank">
Share in VK
</a>

Parameters:

Documentation: VK Link Posting

LinkedIn

<a href="https://www.linkedin.com/sharing/share-offsite/?url=https%3A%2F%2Fmefody.dev" target="_blank">
Share in LinkedIn
</a>

Parameters:

Documentation: Share Plugin

Attributes

I also add these attributes to my share links:

Webmentions [?]

  1. Незачем тащить на сайт всякий JavaScript от социальных сетей, если вам просто нужно добавить кнопку «Поделиться». Соц. сети умеют в ссылки.

  2. MarryCherry

    Учусь пока работаю, учусь пока сижу в твиттере 😅. Отдельная любовь - внимание к мелочам

  3. Tibor Martini

    For Facebook you can use the parameter e to send custom text along. It is rendered in Facebook as a quote of the shared link.

  4. Amber Weinberg Jones

    Yep I never ever use JS or widgets to add share buttons.

  5. Guillaume Le Nistour

    Social media buttons without JavaScript | Dev Tips mefody.dev/chunks/social-…

  6. Colin 't Hart

    What about Instagram?

  7. Станислав

    фронтендеры придумали тег a-href

  8. Tatweer Development

    Tnx. İt's just what I've been looking for to my project right now!

  9. AFAIK, Instagram hasn’t any way to share anything via link. But you can add a link to the post related to your website as an option.

  10. pig

    Social media buttons without JavaScript by @dev_tip mefody.dev/chunks/social-…