ksarpotdar / vanilla-sharing

Small (1.5 KB) simple tool for sharing url, title, description and image to VK, Facebook (Feed, Dialog, Button, Messenger), Reddit, Pinterest, Tumblr, Twitter, VK, OK, Mail.ru, LinkedIn, Whatsapp, Viber, Telegram, Line

vanilla-sharing

Small (1.5 KB) simple tool for sharing url, title, description and image to VK, Facebook (Feed, Dialog, Button, Messenger), Twitter, Reddit, Pinterest, Tumblr, VK, OK, Mail.ru, LinkedIn, Whatsapp, Viber, Telegram, Line.

DEMO

Motivation

Adding sharings to a project is digging in the documentation of the corresponding social networks. With this set of small functions, we have already done everything for you. Just take them and use!

Installation

From NPM

npm install --save vanilla-sharing

From unpkg CDN (you can use other)

<script src="https://unpkg.com/vanilla-sharing"></script>

Usage

From NPM

import { fbButton } from 'vanilla-sharing';

fbButton({
  url: 'https://alexey-avdeev.com/vanilla-sharing/',
});

From CDN

VanillaSharing.fbButton({
  url: 'https://alexey-avdeev.com/vanilla-sharing/',
});

API

fbFeed(options)

Share on facebook.com via the Feed dialog

Documentation: https://developers.facebook.com/docs/sharing/reference/feed-dialog

fbFeed({
  url: string,
  redirectUri: string,
  fbAppId: string,
})

You can use getFbFeedUrl(options) for getting URL.

fbShare(options)

Share on facebook.com via the Share dialog

Documentation: https://developers.facebook.com/docs/sharing/reference/share-dialog

fbShare({
  url: string,
  redirectUri: string,
  hashtag: string,
  fbAppId: string,
  quote: string,
})

You can use getFbShareUrl(options) for getting URL.

fbButton(options)

Share on facebook.com using facebook share button

fbButton({
  url: string,
})

You can use getFbButtonUrl(options) for getting URL.

messenger(options)

Share via Facebook Messenger

Share method from Sharing for Messenger.

messenger({
  url: string,
  fbAppId: string,
})

tw(options)

Share on Twitter

tw({
  url: string,
  title: string,
  hashtags: array,
})

You can use getTwUrl(options) for getting URL.

reddit(options)

Share on Reddit

reddit({
  url: string,
  title: string,
})

pinterest(options)

Share on Pinterest

pinterest({
  url: string,
  description: string,
  media: image url string,
})

tumblr(options)

Share on Tumblr

tumblr({
  url: string,
  title: string,
  caption: string,
  tags: array,
})

vk(options)

Share on vk.com

vk({
  url: string,
  title: string,
  description: string,
  image: string,
  isVkParse: boolean,
})

You can use getVkUrl(options) for getting URL.

ok(options)

Share on ok.ru

Like/Share button

ok({
  url: string,
  title: string,
  image: string,
})

You can use getOkUrl(options) for getting URL.

mail(options)

Share on Mail.ru

mail({
  url: string,
  title: string,
  description: string,
  image: string,
})

email(options)

Share via user's email

email({
  to: string,
  url: string,
  title: string,
  description: string,
  subject: string,
})

You can use getEmailUrl(options) for getting URL.

linkedin(options)

Share on LinkedIn

Share method from Share on LinkedIn.

linkedin({
  url: string,
  title: string,
  description: string,
})

whatsapp(options)

Share via Whatsapp

WhatsApp FAQ - Using Click to Chat.

whatsapp({
  url: string,
  title: string,
  phone: string,
})

You can use getWhatsappUrl(options) for getting URL.

viber(options)

Share via Viber

Viber Share Button docs.

viber({
  url: string,
  title: string,
})

You can use getViberUrl(options) for getting URL.

telegram(options)

Share via Telegram

telegram({
  url: string,
  title: string,
})

You can use getTelegramUrl(options) for getting URL.

line(options)

Share via Line

line({
  url: string,
  title: string,
})