I am implementing the ngx-sharebuttons for social share button like facebook, whatsapp.
this is what I tried
installed package
- npm i cdk
- npm i ngx-sharebuttons
- npm i @fortawesome/fontawesome-svg-core @fortawesome/angular-fontawesome @fortawesome/free-solid-svg-icons @fortawesome/free-brands-svg-icons
import { ShareButtonsModule } from 'ngx-sharebuttons/buttons';
import { ShareIconsModule } from 'ngx-sharebuttons/icons';
ShareButtonsModule.withConfig({
debug: true
}),
ShareIconsModule
<share-buttons [theme]="'material-dark'"
[include]="['facebook','twitter','linkedin','pinterest','reddit','mix','vk','telegram','messenger','whatsapp','xing','line','sms','email','copy']"
[show]="9"
[size]="1"
[url]="'https://www.eduforbetterment.com/generate-qr-code-in-angular/'"
[image] ="'https://www.eduforbetterment.com/wp-content/uploads/2020/08/qrcode.jpg'"
[autoSetMeta]="false"
></share-buttons>
everything is working but I am not able to see the social icons for share like facebook, twitter, whatsapp and so on.
I followed this link
As you can see in the image share button is creating but icons are not creating.
below is my package.json file
"@angular-devkit/core": "10.0.1",
"@angular/animations": "^10.0.2",
"@angular/cdk": "^11.0.0",
"@angular/cli": "^10.0.1",
"@angular/common": "10.0.2",
"@angular/compiler": "10.0.2",
"@angular/core": "10.0.2",
"@angular/flex-layout": "^9.0.0-beta.29",
"@angular/forms": "10.0.2",
"@angular/localize": "^10.0.2",
"@angular/material": "^8.2.3",
"@angular/platform-browser": "10.0.2",
"@angular/platform-browser-dynamic": "10.0.2",
"@angular/router": "10.0.2",
"@fortawesome/angular-fontawesome": "^0.8.0",
"@fortawesome/fontawesome-svg-core": "^1.2.32",
"@fortawesome/free-brands-svg-icons": "^5.15.1",
"@fortawesome/free-solid-svg-icons": "^5.15.1",
"@ng-bootstrap/ng-bootstrap": "^7.0.0",
"bootstrap": "^4.5.2",
"chartist": "^0.11.4",
"core-js": "^2.6.11",
"hammerjs": "^2.0.8",
"ng-chartist": "4.1.0",
"ngx-sharebuttons": "^8.0.4",
"ngx-spinner": "^10.0.1",
"node-sass": "^4.13.1",
"rxjs": "^6.6.0",
"rxjs-compat": "^6.6.0",
"tslib": "^2.0.0",
"zone.js": "~0.10.3"
Please help me where I am doing wrong.
2
Answers
Try this one
[shareButton] is a directive that converts its host element to a share button.
https://ngx-sharebuttons.netlify.app/#/share-button-directive
I used fontawesome icons instead (you import what you need)