⚙ Install
? Usage
BufferShare
?? Code
import { BufferShareBtn } from "dv-social-share";
<BufferShareBtn url="https://dv-social-share.vercel.app" title="Dhaval Vira" />;
? BufferShareBtn Props
Props |
Type |
Default |
Description |
Required |
url |
string |
|
The URL of the page to be shared. |
✅ |
title |
string |
|
the Title to be shared. |
❌ |
openInNewTab |
boolean |
false |
Open share window in a new tab if set to true . |
❌ |
DiggShare
?? Code
import { DiggShareBtn } from "dv-social-share";
<DiggShareBtn url="https://dv-social-share.vercel.app" title="Dhaval Vira" />;
? DiggShareBtn Props
Props |
Type |
Default |
Description |
Required |
url |
string |
|
The URL of the page to be shared. |
✅ |
title |
string |
|
the Title to be shared. |
❌ |
openInNewTab |
boolean |
false |
Open share window in a new tab if set to true . |
❌ |
EmailShare
?? Code
import { EmailShareBtn } from "dv-social-share";
<EmailShareBtn url="https://dv-social-share.vercel.app" />;
? EmailShareBtn Props
Props |
Type |
Default |
Description |
Required |
url |
string |
|
The URL of the page to be shared. |
✅ |
subject |
string |
|
A subject to be shared. |
❌ |
body |
string |
|
Body to be shared. |
❌ |
separator |
string |
:: |
|
❌ |
openInNewTab |
boolean |
false |
Open share window in a new tab if set to true . |
❌ |
FBMessangerShare
?? Code
import { FBMessangerShareBtn } from "dv-social-share";
<FBMessangerShareBtn url="https://dv-social-share.vercel.app" appId="" />;
? FBMessangerShareBtn Props
Props |
Type |
Default |
Description |
Required |
url |
string |
|
The URL of the page to be shared. |
✅ |
appId |
string |
|
Facebook application id. |
✅ |
redirectUri |
string |
|
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 . |
❌ |
FBShare
?? Code
import { FBShareBtn } from "dv-social-share";
<FBShareBtn
url="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 . |
❌ |
FlipboardShare
?? Code
import { FlipboardShareBtn } from "dv-social-share";
<FlipboardShareBtn
url="https://dv-social-share.vercel.app"
title="Dhaval Vira"
/>;
? FlipboardShareBtn Props
Props |
Type |
Default |
Description |
Required |
url |
string |
|
The URL of the page to be shared. |
✅ |
title |
string |
|
the Title to be shared. |
❌ |
openInNewTab |
boolean |
false |
Open share window in a new tab if set to true . |
❌ |
GABShare
?? Code
import { GABShareBtn } from "dv-social-share";
<GABShareBtn
url="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 . |
❌ |
HackerNewsShare
?? Code
import { HackerNewsShareBtn } from "dv-social-share";
<HackerNewsShareBtn
url="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 . |
❌ |
InstapaperShare
?? Code
import { InstapaperShareBtn } from "dv-social-share";
<InstapaperShareBtn
url="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 . |
❌ |
LineShare
?? Code
import { LineShareBtn } from "dv-social-share";
<LineShareBtn
url="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 . |
❌ |
LinkedInShare
?? Code
import { LinkedInShareBtn } from "dv-social-share";
<LinkedInShareBtn
url="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 . |
❌ |
LiveJournalShare
?? Code
import { LiveJournalShareBtn } from "dv-social-share";
<LiveJournalShareBtn
url="https://dv-social-share.vercel.app"
title="Dhaval Vira"
/>;
? LiveJournalShareBtn Props
Props |
Type |
Default |
Description |
Required |
url |
string |
|
The URL of the page to be shared. |
✅ |
title |
string |
|
the Title to be shared. |
❌ |
openInNewTab |
boolean |
false |
Open share window in a new tab if set to true . |
❌ |
PinboardShare
?? Code
import { PinboardShareBtn } from "dv-social-share";
<PinboardShareBtn
url="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 . |
❌ |
PinterestShare
?? Code
import { PinterestShareBtn } from "dv-social-share";
<PinterestShareBtn
url="https://dv-social-share.vercel.app"
media="https://dv-social-share.vercel.app/image.svg"
/>;
? PinterestShareBtn Props
Props |
Type |
Default |
Description |
Required |
url |
string |
|
The URL of the to be page. |
✅ |
media |
string |
|
The image URL that will be pinned. |
✅ |
description |
string |
|
The description of the shared media. |
❌ |
openInNewTab |
boolean |
false |
Open share window in a new tab if set to true . |
❌ |
PocketShare
?? Code
import { PocketShareBtn } from "dv-social-share";
<PocketShareBtn
url="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 . |
❌ |
RedditShare
?? Code
import { RedditShareBtn } from "dv-social-share";
<RedditShareBtn
url="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 . |
❌ |
RefindShare
?? Code
import { RefindShareBtn } from "dv-social-share";
<RefindShareBtn url="https://dv-social-share.vercel.app" />;
? RefindShareBtn Props
Props |
Type |
Default |
Description |
Required |
url |
string |
|
The URL of the to be page. |
✅ |
openInNewTab |
boolean |
false |
Open share window in a new tab if set to true . |
❌ |
TelegramShare
?? Code
import { TelegramShareBtn } from "dv-social-share";
<TelegramShareBtn
url="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 . |
❌ |
TumblrShare
?? Code
import { TumblrShareBtn } from "dv-social-share";
<TumblrShareBtn
url="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 . |
❌ |
TwitterShare
?? Code
import { TwitterShareBtn } from "dv-social-share";
<TwitterShareBtn
url="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 . |
❌ |
VKShare
?? Code
import { VKShareBtn } from "dv-social-share";
<VKShareBtn
url="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 . |
❌ |
WhatsAppShare
?? Code
import { WhatsAppShareBtn } from "dv-social-share";
<WhatsAppShareBtn
url="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 . |
❌ |
? 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
- Discuss ideas in issues
- Spread the word
- Reach out with any feedback
⚖️ License
The MIT License 
GitHub
View Github