vue-share-buttons - Vue.js component for placing buttons in your project using which you can share anything

vue-share-buttons Vue component for placing buttons in your project using which you can share anything. If vue-share-buttons doesn't have a social net

Information

Category: Vue.js / Social Sharing
Watchers: 1
Star: 50
Fork: 15
Last update: May 29, 2023

Resource links

https://github.com/Alexandrshy/vue-share-buttons

README
Issues 12

vue-share-buttons

Vue component for placing buttons in your project using which you can share anything. If vue-share-buttons doesn't have a social network for you, just make a Pull request or create new issue for me

Installation

Install using npm

npm i vue-share-buttons

Link to NPM

Install using Yarn

yarn add vue-share-buttons

Link to Yarn

Icons

For icons, I use simpleicons

Usage

You need to import each social button separately. For example, you want to use the share button on Twitter. To do this you need:

Import component

import TwitterButton from "vue-share-buttons/src/components/TwitterButton";

const app = new Vue({
  el: "#app",
  components: {
    TwitterButton
  }
});

Add the button to your template

<div id="app">
  <twitter-button
    shareUrl="https://github.com/"
    shareDescription="GitHub is where people build software."
  />
</div>

And we get the button

Options

Below are the options you can pass to create your own button.

Buttons with a counter

Facebook, LinkedIn, Odnoklassniki

Option	Type's	Default	Description
url	String	`document.location.href`	URL-address you want to share
description	String	`document.title`	Messages you want to share
btnText	String	`Facebook`, `LinkedIn`, `Odnoklassniki`, etc.	Text to be written on your button
hasIcon	Boolean	`true`	Presence of social network icon in the button
isBlank	Boolean	`true`	Open the "share on social networks" frame in a new window
modalWidth	Number	500	If the property "isBlank" is set to `false`, you can set the `width` of the modal window the "share on social networks"
modalHeight	Number	500	If the property "isBlank" is set to `false`, you can set the `height` of the modal window the "share on social networks"
hasCounter	Boolean	`false`	Presence of a counter with the number of share
digitsCounter	Number	`0`	The number of decimal places in the counter
keyCounter	String	`''`	Counter ID (note, it must be unique if you use several buttons with a counter for the same social network on the same page)

Tumblr, Vkontakte

Option	Type's	Default	Description
url	String	`document.location.href`	URL-address you want to share
description	String	`document.title`	Messages you want to share
title	String	`''`	Title you want to share
btnText	String	`Tumblr`, `Vkontakte`	Text to be written on your button
hasIcon	Boolean	`true`	Presence of social network icon in the button
isBlank	Boolean	`true`	Open the "share on social networks" frame in a new window
modalWidth	Number	500	If the property "isBlank" is set to `false`, you can set the `width` of the modal window the "share on social networks"
modalHeight	Number	500	If the property "isBlank" is set to `false`, you can set the `height` of the modal window the "share on social networks"
hasCounter	Boolean	`false`	Presence of a counter with the number of share
digitsCounter	Number	`0`	The number of decimal places in the counter
keyCounter	String	`''`	Counter ID (note, it must be unique if you use several buttons with a counter for the same social network on the same page)

Pinterest

Option	Type's	Default	Description
url	String	`document.location.href`	URL-address you want to share
description	String	`document.title`	Messages you want to share
picture	String	`''`	Picture you want to share
btnText	String	`Pinterest`	Text to be written on your button
hasIcon	Boolean	`true`	Presence of social network icon in the button
isBlank	Boolean	`true`	Open the "share on social networks" frame in a new window
modalWidth	Number	500	If the property "isBlank" is set to `false`, you can set the `width` of the modal window the "share on social networks"
modalHeight	Number	500	If the property "isBlank" is set to `false`, you can set the `height` of the modal window the "share on social networks"
hasCounter	Boolean	`false`	Presence of a counter with the number of share
digitsCounter	Number	`0`	The number of decimal places in the counter
keyCounter	String	`''`	Counter ID (note, it must be unique if you use several buttons with a counter for the same social network on the same page)

Buttons without a counter

Twitter, Evernote, Hatena, Instapaper, LiveJournal

Option	Type's	Default	Description
url	String	`document.location.href`	URL-address you want to share
description	String	`document.title`	Messages you want to share
btnText	String	`Twitter`, `Evernote`, `Hatena`, `Instapaper`, `LiveJournal`	Text to be written on your button
hasIcon	Boolean	`true`	Presence of social network icon in the button
isBlank	Boolean	`true`	Open the "share on social networks" frame in a new window
modalWidth	Number	500	If the property "isBlank" is set to `false`, you can set the `width` of the modal window the "share on social networks"
modalHeight	Number	500	If the property "isBlank" is set to `false`, you can set the `height` of the modal window the "share on social networks"

Digg, Xing, Pocket

Option	Type's	Default	Description
url	String	`document.location.href`	URL-address you want to share
btnText	String	`Digg`, `Xing`, `Pocket`	Text to be written on your button
hasIcon	Boolean	`true`	Presence of social network icon in the button
isBlank	Boolean	`true`	Open the "share on social networks" frame in a new window
modalWidth	Number	500	If the property "isBlank" is set to `false`, you can set the `width` of the modal window the "share on social networks"
modalHeight	Number	500	If the property "isBlank" is set to `false`, you can set the `height` of the modal window the "share on social networks"

Blogger

Option	Type's	Default	Description
url	String	`document.location.href`	URL-address you want to share
description	String	`document.title`	Messages you want to share
title	String	`''`	Title you want to share
btnText	String	`Blogger`	Text to be written on your button
hasIcon	Boolean	`true`	Presence of social network icon in the button
isBlank	Boolean	`true`	Open the "share on social networks" frame in a new window
modalWidth	Number	500	If the property "isBlank" is set to `false`, you can set the `width` of the modal window the "share on social networks"
modalHeight	Number	500	If the property "isBlank" is set to `false`, you can set the `height` of the modal window the "share on social networks"

Reddit, Renren

Option	Type's	Default	Description
url	String	`document.location.href`	URL-address you want to share
title	String	`''`	Title you want to share
btnText	String	`Reddit`, `Renren`	Text to be written on your button
hasIcon	Boolean	`true`	Presence of social network icon in the button
isBlank	Boolean	`true`	Open the "share on social networks" frame in a new window
modalWidth	Number	500	If the property "isBlank" is set to `false`, you can set the `width` of the modal window the "share on social networks"
modalHeight	Number	500	If the property "isBlank" is set to `false`, you can set the `height` of the modal window the "share on social networks"

Weibo

Option	Type's	Default	Description
url	String	`document.location.href`	URL-address you want to share
description	String	`document.title`	Messages you want to share
picture	String	`''`	Picture you want to share
title	String	`''`	Title you want to share
btnText	String	`Weibo`	Text to be written on your button
hasIcon	Boolean	`true`	Presence of social network icon in the button
isBlank	Boolean	`true`	Open the "share on social networks" frame in a new window
modalWidth	Number	500	If the property "isBlank" is set to `false`, you can set the `width` of the modal window the "share on social networks"
modalHeight	Number	500	If the property "isBlank" is set to `false`, you can set the `height` of the modal window the "share on social networks"

Buttons for instant messengers

Facebook

Option	Type's	Default	Description
appID	String	`''`	A unique identifier for the application
url	String	`document.location.href`	URL-address you want to share
btnText	String	`Facebook`	Text to be written on your button
hasIcon	Boolean	`true`	Presence of social network icon in the button

Viber, WhatsApp

Option	Type's	Default	Description
url	String	`document.location.href`	URL-address you want to share
btnText	String	`Viber`, `WhatsApp`	Text to be written on your button
hasIcon	Boolean	`true`	Presence of social network icon in the button

Telegram

Option	Type's	Default	Description
url	String	`document.location.href`	URL-address you want to share
description	String	`document.title`	Messages you want to share
btnText	String	`Telegram`	Text to be written on your button
hasIcon	Boolean	`true`	Presence of social network icon in the button

Send a message via email

This isn't really a share button, this is a button that allows you to open the software to send an email message, but it may be useful for you 🙃

Option	Type's	Default	Description
url	String	`document.location.href`	URL-address you want to share
btnText	String	`Email`	Text to be written on your button
hasIcon	Boolean	`true`	Presence of social network icon in the button

Full list of social networks

Blogger
Digg
Evernote
Facebook
Hatena
Instapaper
LinkedIn
LiveJournal
Odnoklassniki
Pinterest
Pocket
Reddit
Renren
Tumblr
Twitter
Vkontakte
Weibo
Xing
Telegram
Viber
WhatsApp

Example

<twitter-button 
  v-bind:isBlank="false"
  btnText
/>

Live Demo

<twitter-button 
  class="share-button--circle"
  v-bind:hasIcon="false"
/>

Live Demo

<twitter-button 
  v-bind:hasIcon="false"
  class="share-button--outline">
/>

Live Demo

<twitter-button 
  class="share-button--circle share-button--outline"
  btnText
/>

Live Demo

<facebook-button 
  class="share-button--outline" 
  hasCounter
/>

Live Demo

<facebook-button 
  class="share-button--painted"
  url="https://github.com/"
  hasCounter
/>

Live Demo

Author

This component was developed by Alexander Shulaev for personal purposes and submitted to Open Source, if it will help someone I will be very happy about it 😊

Link

SVG-icon by Simple Icons

License

The MIT License (MIT)

6 Open More issues

Closed

MINOR (#15): fixing new window issue

What kind of change does this PR introduce? (check at least one)

[x] Bugfix
[ ] Feature
[ ] Refactor
[ ] Other, please describe:

Other information:

opened Feb 9, 2020 by spekulatius 2

Closed

Request For Medium Button

This is not acutually a problem but a feature request. I Want a Button for Medium, it will really go well. Thanks

opened Mar 27, 2022 by chaderenyore 1

Closed

Bump follow-redirects from 1.7.0 to 1.14.7

Bumps follow-redirects from 1.7.0 to 1.14.7.

Commits

2ede36d Release version 1.14.7 of the npm package.
8b347cb Drop Cookie header across domains.
6f5029a Release version 1.14.6 of the npm package.
af706be Ignore null headers.
d01ab7a Release version 1.14.5 of the npm package.
40052ea Make compatible with Node 17.
86f7572 Fix: clear internal timer on request abort to avoid leakage
2e1eaf0 Keep Authorization header on subdomain redirects.
2ad9e82 Carry over Host header on relative redirects (#172)
77e2a58 Release version 1.14.4 of the npm package.
Additional commits viewable in compare view

Dependabot will resolve any conflicts with this PR as long as you don't alter it yourself. You can also trigger a rebase manually by commenting @dependabot rebase.

Dependabot commands and options

You can trigger Dependabot actions by commenting on this PR:

@dependabot rebase will rebase this PR
@dependabot recreate will recreate this PR, overwriting any edits that have been made to it
@dependabot merge will merge this PR after your CI passes on it
@dependabot squash and merge will squash and merge this PR after your CI passes on it
@dependabot cancel merge will cancel a previously requested merge and block automerging
@dependabot reopen will reopen this PR if it is closed
@dependabot close will close this PR and stop Dependabot recreating it. You can achieve the same result by closing it manually
@dependabot ignore this major version will close this PR and stop Dependabot creating any more for this major version (unless you reopen the PR or upgrade to it yourself)
@dependabot ignore this minor version will close this PR and stop Dependabot creating any more for this minor version (unless you reopen the PR or upgrade to it yourself)
@dependabot ignore this dependency will close this PR and stop Dependabot creating any more for this dependency (unless you reopen the PR or upgrade to it yourself)
@dependabot use these labels will set the current labels as the default for future PRs for this repo and language
@dependabot use these reviewers will set the current reviewers as the default for future PRs for this repo and language
@dependabot use these assignees will set the current assignees as the default for future PRs for this repo and language
@dependabot use this milestone will set the current milestone as the default for future PRs for this repo and language

You can disable automated security fix PRs for this repo from the Security Alerts page.

dependencies

opened Jan 13, 2022 by dependabot[bot] 1

Closed

Bump url-parse from 1.4.4 to 1.5.3

Bumps url-parse from 1.4.4 to 1.5.3.

Commits

ad44493 [dist] 1.5.3
c798461 [fix] Fix host parsing for file URLs (#210)
201034b [dist] 1.5.2
2d9ac2c [fix] Sanitize only special URLs (#209)
fb128af [fix] Use 'null' as origin for non special URLs
fed6d9e [fix] Add a leading slash only if the URL is special
94872e7 [fix] Do not incorrectly set the slashes property to true
81ab967 [fix] Ignore slashes after the protocol for special URLs
ee22050 [ci] Use GitHub Actions
d2979b5 [fix] Special case the file: protocol (#204)
Additional commits viewable in compare view

Dependabot will resolve any conflicts with this PR as long as you don't alter it yourself. You can also trigger a rebase manually by commenting @dependabot rebase.

Dependabot commands and options

You can trigger Dependabot actions by commenting on this PR:

@dependabot rebase will rebase this PR
@dependabot recreate will recreate this PR, overwriting any edits that have been made to it
@dependabot merge will merge this PR after your CI passes on it
@dependabot squash and merge will squash and merge this PR after your CI passes on it
@dependabot cancel merge will cancel a previously requested merge and block automerging
@dependabot reopen will reopen this PR if it is closed
@dependabot close will close this PR and stop Dependabot recreating it. You can achieve the same result by closing it manually
@dependabot ignore this major version will close this PR and stop Dependabot creating any more for this major version (unless you reopen the PR or upgrade to it yourself)
@dependabot ignore this minor version will close this PR and stop Dependabot creating any more for this minor version (unless you reopen the PR or upgrade to it yourself)
@dependabot ignore this dependency will close this PR and stop Dependabot creating any more for this dependency (unless you reopen the PR or upgrade to it yourself)
@dependabot use these labels will set the current labels as the default for future PRs for this repo and language
@dependabot use these reviewers will set the current reviewers as the default for future PRs for this repo and language
@dependabot use these assignees will set the current assignees as the default for future PRs for this repo and language
@dependabot use this milestone will set the current milestone as the default for future PRs for this repo and language

You can disable automated security fix PRs for this repo from the Security Alerts page.

dependencies

opened Oct 5, 2021 by dependabot[bot] 1

Closed

Bump path-parse from 1.0.6 to 1.0.7

Bumps path-parse from 1.0.6 to 1.0.7.

Commits

See full diff in compare view

Dependabot will resolve any conflicts with this PR as long as you don't alter it yourself. You can also trigger a rebase manually by commenting @dependabot rebase.

Dependabot commands and options

You can trigger Dependabot actions by commenting on this PR:

@dependabot rebase will rebase this PR
@dependabot recreate will recreate this PR, overwriting any edits that have been made to it
@dependabot merge will merge this PR after your CI passes on it
@dependabot squash and merge will squash and merge this PR after your CI passes on it
@dependabot cancel merge will cancel a previously requested merge and block automerging
@dependabot reopen will reopen this PR if it is closed
@dependabot close will close this PR and stop Dependabot recreating it. You can achieve the same result by closing it manually
@dependabot ignore this major version will close this PR and stop Dependabot creating any more for this major version (unless you reopen the PR or upgrade to it yourself)
@dependabot ignore this minor version will close this PR and stop Dependabot creating any more for this minor version (unless you reopen the PR or upgrade to it yourself)
@dependabot ignore this dependency will close this PR and stop Dependabot creating any more for this dependency (unless you reopen the PR or upgrade to it yourself)
@dependabot use these labels will set the current labels as the default for future PRs for this repo and language
@dependabot use these reviewers will set the current reviewers as the default for future PRs for this repo and language
@dependabot use these assignees will set the current assignees as the default for future PRs for this repo and language
@dependabot use this milestone will set the current milestone as the default for future PRs for this repo and language

You can disable automated security fix PRs for this repo from the Security Alerts page.

dependencies

opened Aug 10, 2021 by dependabot[bot] 1

Closed

Bump color-string from 1.5.3 to 1.5.5

Bumps color-string from 1.5.3 to 1.5.5.

Release notes

Sourced from color-string's releases.

1.5.5 (Patch/Security Release) - hwb() ReDos patch (low-severity)

Release notes copied verbatim from the commit message, which can be found here: 0789e21284c33d89ebc4ab4ca6f759b9375ac9d3

Discovered by Yeting Li, c/o Colin Ife via Snyk.io. A ReDos (Regular Expression Denial of Service) vulnerability was responsibly disclosed to me via email by Colin on Mar 5 2021 regarding an exponential time complexity for linearly increasing input lengths for hwb() color strings. Strings reaching more than 5000 characters would see several milliseconds of processing time; strings reaching more than 50,000 characters began seeing 1500ms (1.5s) of processing time. The cause was due to a the regular expression that parses hwb() strings - specifically, the hue value - where the integer portion of the hue value used a 0-or-more quantifier shortly thereafter followed by a 1-or-more quantifier. This caused excessive backtracking and a cartesian scan, resulting in exponential time complexity given a linear increase in input length. Thank you Yeting Li and Colin Ife for bringing this to my attention in a secure, responsible and professional manner.

A CVE will not be assigned for this vulnerability.

1.5.4 (Patch Release)

Removes rounding of alpha values in RGBA hex (#rrggbbaa) and condensed-hex (#rgba) parsers, which caused certain unique inputs to result in identical outputs (see https://github.com/qix-/color/issues/174).

Commits

See full diff in compare view

Dependabot will resolve any conflicts with this PR as long as you don't alter it yourself. You can also trigger a rebase manually by commenting @dependabot rebase.

Dependabot commands and options

You can trigger Dependabot actions by commenting on this PR:

@dependabot rebase will rebase this PR
@dependabot recreate will recreate this PR, overwriting any edits that have been made to it
@dependabot merge will merge this PR after your CI passes on it
@dependabot squash and merge will squash and merge this PR after your CI passes on it
@dependabot cancel merge will cancel a previously requested merge and block automerging
@dependabot reopen will reopen this PR if it is closed
@dependabot close will close this PR and stop Dependabot recreating it. You can achieve the same result by closing it manually
@dependabot ignore this major version will close this PR and stop Dependabot creating any more for this major version (unless you reopen the PR or upgrade to it yourself)
@dependabot ignore this minor version will close this PR and stop Dependabot creating any more for this minor version (unless you reopen the PR or upgrade to it yourself)
@dependabot ignore this dependency will close this PR and stop Dependabot creating any more for this dependency (unless you reopen the PR or upgrade to it yourself)
@dependabot use these labels will set the current labels as the default for future PRs for this repo and language
@dependabot use these reviewers will set the current reviewers as the default for future PRs for this repo and language
@dependabot use these assignees will set the current assignees as the default for future PRs for this repo and language
@dependabot use this milestone will set the current milestone as the default for future PRs for this repo and language

You can disable automated security fix PRs for this repo from the Security Alerts page.

dependencies

opened Jul 3, 2021 by dependabot[bot] 1

Open

Fix Xing share url

What kind of change does this PR introduce? (check at least one)

[x] Bugfix
[ ] Feature
[ ] Refactor
[ ] Other, please describe:

Other information:

opened Aug 4, 2022 by rassembs 0

Open

SASS: Update Dependencies

Migrate from depreciated SASS package to Dart SASS for compatibility purposes.

opened Jul 20, 2022 by antom 1

Open

Non unique ID when using multiple buttons

Expected Behavior

Multiple of same button will have unique aria ids

Actual Behavior

Steps to Reproduce the Problem

Add 2 or more of the same button and run a lighthouse check

Additional info:

Fixed this myself with intention to create a PR but not authorized so see https://github.com/Eric-Brennan/vue-share-buttons for fix

opened Apr 8, 2022 by Eric-Brennan 0

Open

Cannot read property 'share_count' of undefined

Expected Behavior

All the examples should work without errors

Actual Behavior

Some of the examples does not work and return the error below:

TypeError
Cannot read property 'share_count' of undefined
window.<computed>
https://88yq86vzk2.csb.app/node_modules/vue-share-buttons/src/components/FacebookButton.vue?3fb6e918:77:36
(anonymous function)
https://graph.facebook.com/?id=https%3A%2F%2F88yq86vzk2.csb.app%2F&callback=Facebook_172:1:6

Steps to Reproduce the Problem

From one of the examples at https://www.npmjs.com/package/vue-share-buttons , the one with <facebook-button class="share-button--outline" hasCounter />:

https://codesandbox.io/s/88yq86vzk2?fontsize=14&file=/src/main.js

opened Jul 2, 2020 by Zomis 0

Open

This is not work in nuxt

Expected Behavior

Work in nuxtjs

Actual Behavior

Doesn't work in nuxtjs, display error Cannot find module

Steps to Reproduce the Problem

opened Mar 21, 2020 by memclutter 1

Open

Need to wrap each button in span?

Hello @Alexandrshy

I tried to implement your lib in a project of mine. I've noticed, I had to wrap each button in a span to work correctly. Without, only the first button was displayed. Any idea what is causing this?

My code:

    <facebook-button
        isBlank="false"
        btnText="Post"
    />
    <twitter-button
        isBlank="false"
        btnText="Tweet"
    />
    <reddit-button
        isBlank="false"
        btnText="Post"
    />

Expected Behavior

Actual Behavior

Work around:

        <span>
          <facebook-button
            isBlank="false"
            btnText="Post"
        />
        </span>
        <span>
          <twitter-button
            isBlank="false"
            btnText="Tweet"
        />
        </span>
        <span>
          <reddit-button
            isBlank="false"
            btnText="Post"
        />
        </span>

Maybe I'm doing something wrong? While it looks pretty straight forward I'm not sure...

Cheers, Peter

opened Feb 9, 2020 by spekulatius 1

Placing objects. This example can be downloaded from apple.com.

vue-socialmedia-share - A Vue.js component for sharing links to social networks, with Vue 2.X

A contract for placing a takeover bid for an NFT collection

A CSS button library built using Sass and Compass

vue-particle-effect-buttonsA bursting particles effects buttons component.

you can use dom-testing-library with anything that renders to the DOM

vue-filepond - A Vue.js component for FilePond - a file upload library that can upload anything you throw at it.

A web dev server that lets you import anything*

Chat with your team while you collaborate over code using VS Live Share

vue-dropdown-menu - Dropdown menu component for Vue. Any element can be dropdown trigger and anything can be dropded down content.

A bursting particles effects buttons component ✨💥❄️🌋

🅰️ Inputs, keyboard, buttons, checkboxes, radio buttons, switches, forms, toasts and more for A-Frame

A fully customisable subclass of the native UIControl which allows you to create beautiful buttons without writing any line of code.

👇CSS Pressable 3D Buttons

vue-goodshare - Vue.js component for social share with beautiful button design. Simple install, extensive documentation, developer support, SEO friendly, clean code without scripts tracking user activity on the page, high speed. Work with Vue.js 2.x.

vue-component-generator - A generator for vue component, supports Vue1.X and Vue2.X.

YCOM Impersonate. Login as selected YCOM user 🧙‍♂️in frontend.

vue-burger-button - A pretty simple Vue functional component for menu burger buttons.

Turn anything into an on-prem serverless function

⚡ CyberEmbed is a powerful tool which can help you to embed website content into a single image.

vue-flatpickr-component flatpickrvue-flatpickr-component Vue.js component for flatpickr datetime picker

Share this repo

Related Repos

Social Sharing

119

Browser extension for synchronizing social media with your own RSS3 file

Re: ID 🐋 The first step to own your own data. 🍭 Introduction Automatically sync your posts on social medias to a crypto based RSS3 files that is com

Social Sharing

vuesocial - 🧞‍♀️🧞‍♂️ One easy-to-use button component for Vue.js with 65+ social network...

Documentation You can browse the documentation for Vue Social on the website. Installation npm install @growthbunker/vuesocial # Or if you prefer usi

Social Sharing

vue-share-it - A Vue.js component for sharing links to social networks

vue-share-it A highly customizable Vue.js component for sharing links on social networks. Features Easy install Highly customizable Extensive document

Social Sharing

vue-share-buttons - Vue.js component for placing buttons in your project using which you c...

vue-share-buttons Vue component for placing buttons in your project using which you can share anything. If vue-share-buttons doesn't have a social net

Social Sharing

vue-picture-sharesheet - A Vue Picture Sharesheet Component heavily inspired by the Image ...

Vue Picture Sharesheet Compoenent vue-picture-sharesheet provides an easy and beautiful sharesheet when hovering over images. Currently supported main

Social Sharing

vue-socialmedia-share - A Vue.js component for sharing links to social networks, with Vue ...

vue-socialmedia-share Vue component for social sharing vue-socialmedia-share is a vue component for sharing links to social networks Demo Features No

Social Sharing

433

vue-goodshare - Vue.js component for social share with beautiful button design. Simple ins...

🍿 vue-goodshare Vue.js component for share link to social networks and mobile messangers A simple way to share a link on the pages of your website in

Social Sharing

1.3k

vue-social-sharing - A renderless Vue.js component for sharing links to social networks, c...

Vue Social Sharing A renderless components for sharing links on major social networks Less than 2.5kb gzipped Demo What is a renderless component? Ren

vue-share-buttons - Vue.js component for placing buttons in your project using which you can share anything

vue-share-buttons

Menu

Installation

Install using npm

Install using Yarn

Icons

Usage

Import component

Add the button to your template

And we get the button

Options

Buttons with a counter

Buttons without a counter

Buttons for instant messengers

Send a message via email

Full list of social networks

Example

Author

Link

License

1.5.5 (Patch/Security Release) - hwb() ReDos patch (low-severity)

1.5.4 (Patch Release)

Expected Behavior

Actual Behavior

Steps to Reproduce the Problem

Expected Behavior

Actual Behavior

Steps to Reproduce the Problem

Expected Behavior

Actual Behavior

Steps to Reproduce the Problem

Expected Behavior

Actual Behavior

Work around:

Related Repos