Learn about vue-goodshare

Vue Goodshare is a social share Vue component. A easy method to share a link with the most prominent social networks on the pages of your website. Powered by goodshare.

Documentation Check on GitHub

Features

Hight Speed.
Simple installation.
A lot of options for customization of appearance.
Extensive and comprehensive documentation.
Smooth coding without Scripts on-page to monitor user activities.
Developer support and SEO friendly.
Attractive button design already included.

Installation

Just like for any other Vue component or library, you can use node package manager:

npm install --save vue-goodshare

Usage

Learning curve for the vue-goodshare is not very steep, but there are a few things you have to understand in order to use it successfully.

Single share element

Includes only needed social networks or mobile messengers.

/**
 * Import Vue.js
 */
import Vue from "vue";

/**
 * Import vue-goodshare single element
 */
import VueGoodshareFacebook from "vue-goodshare/src/providers/Facebook.vue";

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

Add component to HTML template (with attributes):

<div id="app">
  <vue-goodshare-facebook
    page_url="https://github.com/koddr/vue-goodshare"
    title_social="Facebook"
    has_counter
    has_icon
  ></vue-goodshare-facebook>
</div>

Result:

Bundle of share elements

Facebook, Twitter, LinkedIn, Google Plus, Tumblr, Pinterest, Reddit

/**
 * Import Vue.js
 */
import Vue from "vue";

/**
 * Import vue-goodshare bundle
 */
import VueGoodshare from "vue-goodshare";

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

Add components to HTML template (without attributes):

<div id="app">
  <vue-goodshare></vue-goodshare>
</div>