Skip to content
On this page

Getting started

To begin using the Share Button Links React package, follow the installation instructions below.


Installation

You can install the package using either yarn or npm. Run one of the following commands in your project directory:

yarn add share-button-links-react

// or

npm install share-button-links-react

Usage

javascript
import {
  ButtonFacebook
} from "share-button-links-react/components/buttons";

To import the CSS or SCSS for styling, add the following lines:

css
@import "share-button-links-react/main.css";

/* or */

@import "share-button-links-react/main.scss";

Note: The majority of the SVG icons used in the buttons are sourced from Bootstrap Icons, while others are sourced from Tabler Icons.

Available Options

Buttons

To import button components, use the following code:

javascript
import { 
  ButtonFacebook
} from "share-button-links/components/buttons";

The available options include: ButtonCopy, ButtonEmail, ButtonFacebook, ButtonTelegram, ButtonLinkedIn, ButtonPinterest, ButtonPocket, ButtonReddit, ButtonTumblr, ButtonTwitter, and ButtonWhatsapp.

Icon Buttons

To import icon button components, use the following code:

javascript
import {
  FacebookIcon
} from 'share-button-links/components/icons';

The available options include: FacebookIcon, WhatsappIcon, TelegramIcon, TwitterIcon, LinkedInIcon, RedditIcon, PinterestIcon, TumblrIcon, PocketIcon, EmailIcon, and CopyIcon.

Button Group

To import the button group component, use the following code:

javascript
import ButtonGroup from 'share-button-links/components/button-group';

The available options for the button group include: facebookIcon, whatsappIcon, telegramIcon, twitterIcon, linkedInIcon, redditIcon, pinterestIcon, tumblrIcon, pocketIcon, emailIcon, and copyIcon.

These imports allow you to utilize the various components and options provided by the Share Button Links React package in your project.