Global Options

Setting custom options

To avoid setting the same options on each share component/directive, you can set your custom options that applies on all share buttons components across your app.

Example

import { ApplicationConfig } from '@angular/core';
import { customShareButton, provideShareButtonsOptions, withConfig } from 'ngx-sharebuttons';
import { withIcons } from 'ngx-sharebuttons/icons';

export const appConfig: ApplicationConfig = {
  providers: [
    provideShareButtonsOptions(
      // Override default config
      withConfig({
        debug: true
      }),
      // Load the default share icons set (optional)
      withIcons(),
      // Override a specific share button config
      customShareButton('facebook', {
        color: 'orange'
      })
    ),
    // ...
  ]
};

API

Option	Default value	Description
include	[ ]	Include certain buttons. Button's order will be as you type it.
exclude	[ ]	Exclude certain buttons.
theme	null	Button theme name.
windowWidth	800	Share popup window width.
windowHeight	500	Share popup window height.
xAccount	null	Add via @accountName at the end of the tweets.
sharerMethod	'anchor'	The method used to open share, either 'anchor' or 'window'.
sharerTarget	'_blank'	The target attribute value, learn more.
windowObj	window	In case ionic is used, window object can be replaced ionic's native one.
windowFuncName	'open'	The name of the function used to open the window.
moreButtonIcon	'ellipsis-h'	More button icon in <share-buttons> component.
lessButtonIcon	'minus'	Less button icon in <share-buttons> component.
moreButtonAriaLabel	'Show more share buttons'	The aria label of more button in <share-buttons> component.
lessButtonAriaLabel	'Show less share buttons'	The aria label of less button in <share-buttons> component.
messengerAppId	null	Set the appId for Messenger which is required on desktop.
debug	false	A boolean flag that enables debugging mode.