Skip to content

Icons Guide

Murhaf Sousli edited this page Dec 25, 2022 · 10 revisions

By default, FontAwesome icons' aliases are configured in the share buttons packages

Import the ShareIconsModule in the root module

import { ShareIconsModule } from 'ngx-sharebuttons/icons';

@NgModule({
  imports: [
    ShareIconsModule
  ]
})
export class AppModule { }

Custom icons

If you want to import different icon set for the share buttons or if you don't want to import all the share icons that comes with the ShareIconsModule, you can skip it and import the icons manually.

Let's say you want to use facebook square icon instead of the default one

import { ShareButtonsModule } from 'ngx-sharebuttons';
import { FaIconLibrary } from '@fortawesome/angular-fontawesome';
import { faFacebookSquare } from '@fortawesome/free-brands-svg-icons';

const icons = [
  // ... other icons
  faFacebookSquare
];

const shareProp = {
  facebook: {
    icon: ['fab', 'facebook-square']
  }
};

@NgModule({
  imports: [
    ShareButtonsModule.withConfig({ prop: shareProp })
  ]
})
export class AppModule {
  constructor(iconLibrary: FaIconLibrary) {
    iconLibrary.addIcons(...icons);
  }
}