https://github.com/wcoder/share-buttons
:+1: Simple, powerful, customizable and super lightweight social buttons for your site
https://github.com/wcoder/share-buttons
buttons hacktoberfest javascript pure-javascript share-buttons social-buttons social-networks webshare
Last synced: about 2 months ago
JSON representation
:+1: Simple, powerful, customizable and super lightweight social buttons for your site
- Host: GitHub
- URL: https://github.com/wcoder/share-buttons
- Owner: wcoder
- License: mit
- Created: 2015-05-18T15:52:04.000Z (over 10 years ago)
- Default Branch: master
- Last Pushed: 2024-06-12T21:30:57.000Z (over 1 year ago)
- Last Synced: 2025-08-04T06:22:12.636Z (2 months ago)
- Topics: buttons, hacktoberfest, javascript, pure-javascript, share-buttons, social-buttons, social-networks, webshare
- Language: JavaScript
- Homepage: https://wcoder.github.io/share-buttons/
- Size: 393 KB
- Stars: 52
- Watchers: 3
- Forks: 12
- Open Issues: 3
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# Share Buttons [](https://www.npmjs.com/package/share-buttons) 
Simple, powerful, customizable and super lightweight (1 Kb Gzip) social buttons for your site.
## [Demo](https://wcoder.github.io/share-buttons/)
## Browser support
* Google Chrome
* Mozilla Firefox 3.5+
* Opera 10+
* Safari 3.2+
* IE 8+
* Android
* iOS
**Copy to clipboard** is not supported on IE, see [browser compatibility for more information](https://developer.mozilla.org/en-US/docs/Web/API/Navigator/share#browser_compatibility)
**WebShare API** is only partially supported, see [browser compatibility for more information](https://developer.mozilla.org/en-US/docs/Web/API/Navigator/share#browser_compatibility)
## Install
### Available in NPM
```sh
npm i share-buttons
```
include `share-buttons.js` in the end of page:
``` html
```
### Getting the library from CDN
```html
```
Paste this HTML on the page:
``` html
```
Added styles:
``` css
.share-btn > a {
border: 1px solid #ccc;
padding: 5px;
font-size: 12px;
font-family: Verdana, Arial;
}
.share-btn > a:hover {
cursor: pointer;
}
```
Profit!!
## Share via
Network | `data-id`
----------|---------
Facebook | fb
VK | vk
Twitter | tw
Telegram | tg
Pocket | pk
Reddit | re
Evernote | ev
LinkedIn | in
Pinterest | pi
Skype | sk
WhatsApp | wa
Odnoklassniki | ok
Tumblr | tu
Hacker News | hn
Xing | xi
EMail | mail
Print | print
Copy | copy
WebShare API | share
## Customizing
Custom 'url', 'title', 'description':
``` html
```
Styles - full customization.
## Examples
If you are using [Font-Awesome](https://github.com/FortAwesome/Font-Awesome):
```html
```
You can also use [simple-icons](https://github.com/simple-icons/simple-icons).
----
© 2015+ Yauheni Pakala and [contributors](https://github.com/wcoder/share-buttons/graphs/contributors) | MIT