@ngx-share-pat/button

v0.0.5

Published

2 years ago

Share buttons components for Angular and Ionic.

Downloads

Share button component

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

Share button component is built on top of ShareModule so you need to install both @ngx-share-pat/core and @ngx-share-pat/button.

To use the default icons, install font-awesome package.

$ npm install --save @ngx-share-pat/core @ngx-share-pat/button font-awesome

Import ShareButtonModule in your module

import { ShareButtonModule } from '@ngx-share-pat/button';

@NgModule({
  imports: [
    HttpClientModule,      // (Required) for share counts
    HttpClientJsonpModule, // (Optional) For linkedIn & Tumblr counts
    ShareButtonModule.forRoot()
  ]
})

Import core styles and theme from the global style src/styles.scss

@import '~font-awesome/css/font-awesome.min.css';
@import "~@ngx-share-pat/button/styles/share-buttons";
@import "~@ngx-share-pat/button/styles/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>

<!--Use custom text-->
<share-button button="pinterest" text="Pin" showText="true"></share-button>

Check ShareButton Component Demo

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

Issues

If you identify any errors in this component, or have an idea for an improvement, please open an issue. I am excited to see what the community thinks of this project, and I would love your input!

Published

Vulnerabilities

Links

Maintainers

Keywords

Readme

Share button component

Issues

Support

Author

License

More plugins from the author