Skip to content

Social media share buttons and share counts for React.

License

Notifications You must be signed in to change notification settings

zaycev-net/react-share

Repository files navigation

react-social-btn

Buttons "Share" on social networks with the number of users to rate for React.

NPM JavaScript Style Guide

Install

This package requires node >= 4, but we recommend node >= 8.

yarn add react-social-btn

Usage

import React from 'react';

import {ShareButton, SocialList} from 'react-social-btn';

const Example = () => {
    const list = [
        {
            name: 'vk',
            textButton: 'Vkontakte',
            utm: '?utm' //optional
        },
        {
            name: 'mail',
            textButton: 'My@Mail.ru',
            utm: '?utm' //optional
        },
        {
            name: 'ok',
            textButton: 'Odnoklassniki',
            utm: '?utm' //optional
        },
        {
            name: 'facebook',
            textButton: 'Facebook',
            utm: '?utm' //optional
        },
        {
            name: 'twitter',
            textButton: 'Twitter',
            utm: '?utm' //optional
        },
        {
            name: 'telegram',
            extButton: 'Telegram',
            utm: '?utm' //optional
        },
        {
            name: 'copy',
            extButton: 'Copy link',
            utm: '?utm', //optional
            onClick: () => {
            	console.log('Link copied')
            } //optional
        }
    ];
 
    return (
        <>
            <ShareButton
                title="Share"
                style={{
                    marginBottom: '1em'
                }}
                className="share"
                toCount={true}
                list={list}
                defaultUrl="https://zaycev.net"
                callback={() => console.log('Share click')}
            />
            <SocialList
                style={{
                    marginBottom: '1em'
                }}
                className="share-list"
                list={list}
                toCount={true}
                defaultUrl="https://zaycev.net"
            />
        </>
    );
};

Props

ShareButton

Name props Default Optional props Description
title Поделиться Title button
style Other styles from Button
className Extra className from Button
toCount true true/false Enabled/Disabled count social share
list All social array List name and title button
defaultUrl Default Url
callback Callback from button click
isSubscribe Subscribe to the community

SocialList

Name props Default Optional props Description
style Other styles from Button
className Extra className from Button
toCount true true/false Enabled/Disabled count social share
list All social array List name and title button
defaultUrl Default Url

License

MIT © Zaycev.net

About

Social media share buttons and share counts for React.

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published