ng-share-social-cards v0.0.2
Social Share Cards for Angular
This is an Angular library that provides pre-built share card components for various social media platforms. The library receives an object containing metadata for the content being shared and generates platform-specific share cards accordingly.
Installation
Install the package via npm:
npm install ng-share-social-cardsUsage
Import the SocialShareCardsModule into your Angular module:
import { ShareSocialCardsModule } from 'social-share-cards-angular';
@NgModule({
imports: [
// ...
ShareSocialCardsModule
]
})
export class AppModule { }In your component, import the share card components and provide the required metadata:
import { Component } from '@angular/core'; import { DiscordShareCard, FacebookShareCard, GoogleShareCard, LinkedInShareCard, PinterestShareCard, SlackShareCard } from 'social-share-cards-angular';
import { Component } from '@angular/core';
import { DiscordShareCard, FacebookShareCard, GoogleShareCard, LinkedInShareCard, PinterestShareCard, SlackShareCard } from 'ng-share-social-cards';
@Component({
selector: 'app-share',
template: `
<discord-share-card [metadata]="metadata"></discord-share-card>
<facebook-share-card [metadata]="metadata"></facebook-share-card>
<google-share-card [metadata]="metadata"></google-share-card>
<linkedin-share-card [metadata]="metadata"></linkedin-share-card>
<pinterest-share-card [metadata]="metadata"></pinterest-share-card>
<x-share-card [metadata]="metadata"></x-share-card>
<xv2-share-card [metadata]="metadata"></xv2-share-card>
<slack-share-card [metadata]="metadata"></slack-share-card>
`
})
export class ShareComponent {
metadata = {
title: 'My Content Title',
author: 'John Doe',
favUrl: 'https://example.com/favicon.ico',
url: 'https://example.com/my-content',
description: 'This is a description of my content.',
keywords: ['keyword1', 'keyword2', 'keyword3'],
imgUrl: 'https://example.com/content-image.png'
};
}Metadata Object
The library expects an object of type Metadata with the following properties:
title(string): The title of the content being shared.author(string): The author of the content.favUrl(string): The URL of the favicon associated with the content.url(string): The URL of the content being shared.description(string): A description of the content.keywords(string[]): An array of keywords related to the content.imgUrl(string): The URL of the image associated with the content.
Components
The library provides the following share card components:
DiscordShareCardFacebookShareCardGoogleShareCardLinkedInShareCardPinterestShareCardSlackShareCardXShareCardXV2ShareCard
Each component accepts the metadata object as an input property and renders the share card based on the provided metadata.
License
This library is licensed under the MIT License.