vue-socialmedia-share
Vue component for social sharing
vue-socialmedia-share is a vue component for sharing links to social networks
Demo
Features
- No external script loading
- Opens a new share tab
- Share Button for:
- Social Media icons includes in the library
- Change the size of icons
Installation
yarn add vue-socialmedia-share
or
npm install vue-socialmedia-share
API
Facebook
import { Facebook } from 'vue-socialmedia-share';
// usage in local component
export default {
components: {
Facebook
}
};
Props
Prop |
Data Type |
Required |
Description |
url |
String |
true |
URL to share. |
scale |
String |
|
Size of icon (1-9) |
Twitter
import { Twitter } from 'vue-socialmedia-share';
// usage in local component
export default {
components: {
Twitter
}
};
Prop |
Data Type |
Required |
Description |
url |
String |
true |
URL to share. |
scale |
String |
|
Size of icon(1-9) |
title |
String |
|
Title of the shared page |
LinkedIn
import { Linkedin } from 'vue-socialmedia-share';
// usage in local component
export default {
components: {
Linkedin
}
};
Prop |
Data Type |
Required |
Description |
url |
String |
true |
URL to share. |
scale |
String |
|
Size of icon(1-9) |
Reddit
import { Reddit } from 'vue-socialmedia-share';
// usage in local component
export default {
components: {
Reddit
}
};
Prop |
Data Type |
Required |
Description |
url |
String |
true |
URL to share. |
scale |
String |
|
Size of icon(1-9) |
title |
String |
|
Title of the shared page |
Telegram
import { Telegram } from 'vue-socialmedia-share';
// usage in local component
export default {
components: {
Telegram
}
};
Prop |
Data Type |
Required |
Description |
url |
String |
true |
URL to share. |
scale |
String |
|
Size of icon(1-9) |
title |
String |
|
Title of the shared page |
WhatsApp
import { WhatsApp } from 'vue-socialmedia-share';
// usage in local component
export default {
components: {
WhatsApp
}
};
Prop |
Data Type |
Required |
Description |
url |
String |
true |
URL to share. |
scale |
String |
|
Size of icon(1-9) |
title |
String |
|
Title of the shared page |
Pinterest
import { Pinterest } from 'vue-socialmedia-share';
// usage in local component
export default {
components: {
Pinterest
}
};
Prop |
Data Type |
Required |
Description |
url |
String |
true |
URL to share. |
scale |
String |
|
Size of icon(1-9) |
Google +
import { Google } from 'vue-socialmedia-share';
// usage in local component
export default {
components: {
Google
}
};
Prop |
Data Type |
Required |
Description |
url |
String |
true |
URL to share. |
scale |
String |
|
Size of icon(1-9) |
Email
import { Email } from 'vue-socialmedia-share';
// usage in local component
export default {
components: {
Email
}
};
Prop |
Data Type |
Required |
Description |
url |
String |
true |
URL to share. |
scale |
String |
|
Size of icon(1-9) |
subject |
String |
|
Subject of email |
body |
String |
|
Body of email |
Contributing Guide
- Fork it!
- Create your feature branch:
git checkout -b my-new-feature
- Commit your changes:
git commit -am 'Add some feature'
- Push to the branch:
git push origin my-new-feature
- Submit a pull request 😄
Author
© Mohit Bajoria
License
MIT
Like it ? it