Share Button Component

Use <share-button> component to add share buttons individually.

Installation

NPM

npm i ngx-sharebuttons @angular/cdk
npm i @fortawesome/fontawesome-svg-core @fortawesome/angular-fontawesome @fortawesome/free-solid-svg-icons @fortawesome/free-brands-svg-icons

Usage

Import ShareButtonModule in your module

import { ShareButtonModule } from 'ngx-sharebuttons/button';

@NgModule({
  imports: [
    ShareButtonModule
  ]
})

Import the theme in the global style src/styles.scss

@import '~ngx-sharebuttons/themes/default/default-theme';

Check all themes here

Now you can use the component in your template

<share-button button="facebook"></share-button>
<share-button button="twitter"></share-button>

Check ShareButton Component Demo.

Available Inputs / Outputs

Name	Default value	Description
[button]	null	Button name, e.g. 'facebook', 'twitter' ...etc.
[theme]	null	Set button theme.
[text]	null	Custom button text.
[icon]	null	Custom button icon.
[size]	0	Button size, e.g. -4, 2.5, 1...etc.
[url]	current URL	Sharing link.
[title]	null	Override title meta tag for LinkedIn, Reddit and Email.
[description]	null	Override description meta tag for LinkedIn, WhatsApp, Messenger, Telegram, Pinterest and Email
[image]	null	Override image meta tag for Pinterest only.
[tags]	null	Override tags for Tumblr and Twitter.
[autoSetMeta]	true	Initializes meta tags inputs from the SEO meta tags.
[showIcon]	true	Show button icon.
[showText]	false	Show button text.
(opened)	button name	Stream that emits when share dialog has opened.
(closed)	button name	Stream that emits when share dialog has closed.