The URL to redirect to after sharing (default: the shared url).
โ
to
string
A user ID of a recipient. Once the dialog comes up, the sender can specify additional people as recipients.
โ
openInNewTab
boolean
false
Open share window in a new tab if set to true.
โ
imgConfig
object
A imgConfig contains width (number; e.g. 32/64), height (number; e.g. 32/64) & bgColor (string; e.g. '#FF0000') for the Image
โ
FBShare
๐จโ๐ป Code
import{FBShareBtn}from'dv-social-share'<FBShareBtnurl="https://dv-social-share.vercel.app"quote="dv-social-share is a social share buttons for your next React.js & Next.js apps."hashTag="#dvsocialshare"/>
๐ FBShareBtn Props
Props
Type
Default
Description
Required
url
string
The URL of the page to be shared.
โ
quote
string
A quote to be shared.
โ
hashTag
string
Hashtag to be shared.
โ
openInNewTab
boolean
false
Open share window in a new tab if set to true.
โ
imgConfig
object
A imgConfig contains width (number; e.g. 32/64), height (number; e.g. 32/64) & bgColor (string; e.g. '#FF0000') for the Image
A imgConfig contains width (number; e.g. 32/64), height (number; e.g. 32/64) & bgColor (string; e.g. '#FF0000') for the Image
โ
GABShare
๐จโ๐ป Code
import{GABShareBtn}from'dv-social-share'<GABShareBtnurl="https://dv-social-share.vercel.app"title="dv-social-share is a social share buttons for your next React.js & Next.js apps."/>
๐ GABShareBtn Props
Props
Type
Default
Description
Required
url
string
The URL of the page to be shared.
โ
title
string
Title of the shared page.
โ
openInNewTab
boolean
false
Open share window in a new tab if set to true.
โ
imgConfig
object
A imgConfig contains width (number; e.g. 32/64), height (number; e.g. 32/64) & bgColor (string; e.g. '#FF0000') for the Image
โ
HackerNewsShare
๐จโ๐ป Code
import{HackerNewsShareBtn}from'dv-social-share'<HackerNewsShareBtnurl="https://dv-social-share.vercel.app"title="dv-social-share is a social share buttons for your next React.js & Next.js apps."/>
๐ HackerNewsShareBtn Props
Props
Type
Default
Description
Required
url
string
The URL of the page to be shared.
โ
title
string
Title of the shared page.
โ
openInNewTab
boolean
false
Open share window in a new tab if set to true.
โ
imgConfig
object
A imgConfig contains width (number; e.g. 32/64), height (number; e.g. 32/64) & bgColor (string; e.g. '#FF0000') for the Image
โ
InstapaperShare
๐จโ๐ป Code
import{InstapaperShareBtn}from'dv-social-share'<InstapaperShareBtnurl="https://dv-social-share.vercel.app"title="dv-social-share is a social share buttons for your next React.js & Next.js apps."/>
๐ InstapaperShareBtn Props
Props
Type
Default
Description
Required
url
string
The URL of the page to be shared.
โ
title
string
Title of the shared page.
โ
description
string
Description to be shared.
โ
openInNewTab
boolean
false
Open share window in a new tab if set to true.
โ
imgConfig
object
A imgConfig contains width (number; e.g. 32/64), height (number; e.g. 32/64) & bgColor (string; e.g. '#FF0000') for the Image
โ
LineShare
๐จโ๐ป Code
import{LineShareBtn}from'dv-social-share'<LineShareBtnurl="https://dv-social-share.vercel.app"title="dv-social-share is a social share buttons for your next React.js & Next.js apps."/>
๐ LineShareBtn Props
Props
Type
Default
Description
Required
url
string
The URL of the page to be shared.
โ
title
string
Title of the shared page.
โ
openInNewTab
boolean
false
Open share window in a new tab if set to true.
โ
imgConfig
object
A imgConfig contains width (number; e.g. 32/64), height (number; e.g. 32/64) & bgColor (string; e.g. '#FF0000') for the Image
โ
LinkedInShare
๐จโ๐ป Code
import{LinkedInShareBtn}from'dv-social-share'<LinkedInShareBtnurl="https://dv-social-share.vercel.app"title="dv-social-share is a social share buttons for your next React.js & Next.js apps."/>
๐ LinkedInShareBtn Props
Props
Type
Default
Description
Required
url
string
The URL of the page to be shared.
โ
title
string
Title of the shared page.
โ
summary
string
Summary of the shared page.
โ
source
string
Source of the shared page.
โ
openInNewTab
boolean
false
Open share window in a new tab if set to true.
โ
imgConfig
object
A imgConfig contains width (number; e.g. 32/64), height (number; e.g. 32/64) & bgColor (string; e.g. '#FF0000') for the Image
A imgConfig contains width (number; e.g. 32/64), height (number; e.g. 32/64) & bgColor (string; e.g. '#FF0000') for the Image
โ
PinboardShare
๐จโ๐ป Code
import{PinboardShareBtn}from'dv-social-share'<PinboardShareBtnurl="https://dv-social-share.vercel.app"title="Dhaval Vira"descriptin="descriptino to be shared"/>
๐ PinboardShareBtn Props
Props
Type
Default
Description
Required
url
string
The URL of the to be page.
โ
title
string
The Title of the Page to be shared.
โ
description
string
The description to be shared.
โ
openInNewTab
boolean
false
Open share window in a new tab if set to true.
โ
imgConfig
object
A imgConfig contains width (number; e.g. 32/64), height (number; e.g. 32/64) & bgColor (string; e.g. '#FF0000') for the Image
A imgConfig contains width (number; e.g. 32/64), height (number; e.g. 32/64) & bgColor (string; e.g. '#FF0000') for the Image
โ
PocketShare
๐จโ๐ป Code
import{PocketShareBtn}from'dv-social-share'<PocketShareBtnurl="https://dv-social-share.vercel.app"title="dv-social-share is a social share buttons for your next React.js & Next.js apps."/>
๐ PocketShareBtn Props
Props
Type
Default
Description
Required
url
string
The URL of the to be page.
โ
title
string
Title of the shared page.
โ
openInNewTab
boolean
false
Open share window in a new tab if set to true.
โ
imgConfig
object
A imgConfig contains width (number; e.g. 32/64), height (number; e.g. 32/64) & bgColor (string; e.g. '#FF0000') for the Image
โ
RedditShare
๐จโ๐ป Code
import{RedditShareBtn}from'dv-social-share'<RedditShareBtnurl="https://dv-social-share.vercel.app"title="dv-social-share is a social share buttons for your next React.js & Next.js apps."/>
๐ RedditShareBtn Props
Props
Type
Default
Description
Required
url
string
The URL of the to be page.
โ
title
string
Title of the shared page.
โ
openInNewTab
boolean
false
Open share window in a new tab if set to true.
โ
imgConfig
object
A imgConfig contains width (number; e.g. 32/64), height (number; e.g. 32/64) & bgColor (string; e.g. '#FF0000') for the Image
A imgConfig contains width (number; e.g. 32/64), height (number; e.g. 32/64) & bgColor (string; e.g. '#FF0000') for the Image
โ
TelegramShare
๐จโ๐ป Code
import{TelegramShareBtn}from'dv-social-share'<TelegramShareBtnurl="https://dv-social-share.vercel.app"title="dv-social-share is a social share buttons for your next React.js & Next.js apps."/>
๐ TelegramShareBtn Props
Props
Type
Default
Description
Required
url
string
The URL of the to be page.
โ
title
string
Title of the shared page.
โ
openInNewTab
boolean
false
Open share window in a new tab if set to true.
โ
imgConfig
object
A imgConfig contains width (number; e.g. 32/64), height (number; e.g. 32/64) & bgColor (string; e.g. '#FF0000') for the Image
โ
TrelloShare
๐จโ๐ป Code
import{TrelloShareBtn}from'dv-social-share'<TrelloShareBtnurl="https://dv-social-share.vercel.app"desc="dv-social-share is a social share buttons for your next React.js & Next.js apps."/>
๐ TrelloShareBtn Props
Props
Type
Default
Description
Required
url
string
The URL of the to be page.
โ
desc
string
Description of the shared page.
โ
openInNewTab
boolean
false
Open share window in a new tab if set to true.
โ
imgConfig
object
A imgConfig contains width (number; e.g. 32/64), height (number; e.g. 32/64) & bgColor (string; e.g. '#FF0000') for the Image
โ
ThreadsShare
๐จโ๐ป Code
import{ThreadsShareBtn}from'dv-social-share'<ThreadsShareBtnurl="https://dv-social-share.vercel.app"title="dv-social-share is a social share buttons for your next React.js & Next.js apps."/>
๐ ThreadsShareBtn Props
Props
Type
Default
Description
Required
url
string
The URL of the to be page.
โ
title
string
Description of the shared page.
โ
openInNewTab
boolean
false
Open share window in a new tab if set to true.
โ
imgConfig
object
A imgConfig contains width (number; e.g. 32/64), height (number; e.g. 32/64) & bgColor (string; e.g. '#FF0000') for the Image
โ
TumblrShare
๐จโ๐ป Code
import{TumblrShareBtn}from'dv-social-share'<TumblrShareBtnurl="https://dv-social-share.vercel.app"title="dv-social-share is a social share buttons for your next React.js & Next.js apps."/>
๐ TumblrShareBtn Props
Props
Type
Default
Description
Required
url
string
The URL of the shared page to be shared.
โ
title
string
The title of the shared page.
โ
tags
Array
โ
caption
string
The description of the shared page.
โ
posttype
string
link
โ
openInNewTab
boolean
false
Open share window in a new tab if set to true.
โ
imgConfig
object
A imgConfig contains width (number; e.g. 32/64), height (number; e.g. 32/64) & bgColor (string; e.g. '#FF0000') for the Image
โ
TwitterShare
๐จโ๐ป Code
import{TwitterShareBtn}from'dv-social-share'<TwitterShareBtnurl="https://dv-social-share.vercel.app"title="dv-social-share is a social share buttons for your next React.js & Next.js apps."/>
๐ TwitterShareBtn Props
Props
Type
Default
Description
Required
url
string
The URL of the shared page to be shared.
โ
title
string
The title of the shared page.
โ
via
string
โ
hashtags
array
โ
related
array
โ
openInNewTab
boolean
false
Open share window in a new tab if set to true.
โ
imgConfig
object
A imgConfig contains width (number; e.g. 32/64), height (number; e.g. 32/64) & bgColor (string; e.g. '#FF0000') for the Image
โ
VKShare
๐จโ๐ป Code
import{VKShareBtn}from'dv-social-share'<VKShareBtnurl="https://dv-social-share.vercel.app"title="dv-social-share is a social share buttons for your next React.js & Next.js apps."/>
๐ VKShareBtn Props
Props
Type
Default
Description
Required
url
string
The URL of the shared pageto be shared.
โ
title
string
The title of the shared page.
โ
image
string
An absolute link to the image that will be shared.
โ
noParse
boolean
If true is passed, VK will not retrieve URL information.
โ
noVkLinks
boolean
If true is passed, there will be no links to the user's profile in the open window. Only for mobile devices.
โ
openInNewTab
boolean
false
Open share window in a new tab if set to true.
โ
imgConfig
object
A imgConfig contains width (number; e.g. 32/64), height (number; e.g. 32/64) & bgColor (string; e.g. '#FF0000') for the Image
โ
WhatsAppShare
๐จโ๐ป Code
import{WhatsAppShareBtn}from'dv-social-share'<WhatsAppShareBtnurl="https://dv-social-share.vercel.app"title="dv-social-share is a social share buttons for your next React.js & Next.js apps."/>
๐ WhatsAppShareBtn Props
Props
Type
Default
Description
Required
url
string
The URL of the shared page to be shared.
โ
title
string
The title of the shared page.
โ
separator
string
โ
openInNewTab
boolean
false
Open share window in a new tab if set to true.
โ
imgConfig
object
A imgConfig contains width (number; e.g. 32/64), height (number; e.g. 32/64) & bgColor (string; e.g. '#FF0000') for the Image
โ
YummlyShare
๐จโ๐ป Code
import{YummlyShareBtn}from'dv-social-share'<YummlyShareBtnurl="https://dv-social-share.vercel.app"title="dv-social-share is a social share buttons for your next React.js & Next.js apps."image='url-of-image'/>
๐ YummlyShareBtn Props
Props
Type
Default
Description
Required
url
string
The URL of the shared page to be shared.
โ
title
string
The title of the shared page.
โ
image
string
The Link of the Image to be shared along.
โ
openInNewTab
boolean
false
Open share window in a new tab if set to true.
โ
imgConfig
object
A imgConfig contains width (number; e.g. 32/64), height (number; e.g. 32/64) & bgColor (string; e.g. '#FF0000') for the Image
โ
๐ Wrap Up
If you think any of the dv-social-share can be improved, please do open a PR with any updates and submit any issues. Also, I will continue to improve this, so you might want to watch/star this
repository to revisit.
๐ Contribution
We'd love to have your helping hand on contributions to dv-social-share by forking and sending a pull request!
Your contributions are welcome.
How to contribute:
Fork the dv-social-share Repo
Create a New Branch from main
Push the Code in your branc and
Open pull request with improvements & more information on it