https://github.com/webvpf/wn-share-plugin
Share Buttons - plugin for Winter CMS
https://github.com/webvpf/wn-share-plugin
share wintercms wintercms-plugin
Last synced: 3 months ago
JSON representation
Share Buttons - plugin for Winter CMS
- Host: GitHub
- URL: https://github.com/webvpf/wn-share-plugin
- Owner: WebVPF
- License: mit
- Created: 2020-02-24T09:16:23.000Z (over 6 years ago)
- Default Branch: master
- Last Pushed: 2025-04-06T08:10:12.000Z (about 1 year ago)
- Last Synced: 2025-04-06T09:20:43.829Z (about 1 year ago)
- Topics: share, wintercms, wintercms-plugin
- Language: PHP
- Homepage: https://packagist.org/packages/webvpf/wn-share-plugin
- Size: 58.6 KB
- Stars: 7
- Watchers: 1
- Forks: 2
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# Share
Share Buttons - plugin for Winter CMS. Plugin component displays share buttons.
Инструкция на русском языке: https://github.com/WebVPF/wn-share-plugin/wiki
Installation Сomposer:
```bash
composer require webvpf/wn-share-plugin
```
Social Networks and Messengers:
- Facebook
- Twitter
- VK
- Odnoklassniki
- LinkedIn
- Telegram
- Viber
- WhatsApp
Features:
- easy setup
- opens in a popup window or smartphone app
- not blocked by adblockers
- SVG icons are used for buttons, so there are no dependencies on icon fonts
- no external links
- there is no interaction with database
- optimized [javascript file](https://github.com/WebVPF/wn-share-plugin/blob/master/assets/js/share.min.js "open file") less than 1 Kb
- without jQuery
## Selecting and Sorting Buttons
Specify the id of the buttons that you want to display, separated by commas (fb, tw, vk, ok, in, tg, vb, wa)
In this case, you can specify the order in which the buttons will be displayed.
You can do a similar layout:
```twig
Share: {% component 'ShareButtons' %}
```
or
```twig
Share
{% component 'ShareButtons' %}
```
---
## Button Style
Silver
Color
With text
Simple settings are available in the component settings.
## Disable css
You can completely disable predefined css in component settings. Styles can be placed in css themes or wherever convenient for you.
---
## Paste buttons
If you work with code, you can insert buttons as follows:
```ini
[ShareButtons]
btns = "fb, tw, vk, ok, in, tg, vb, wa"
css = 1
skin = "text"
==
Share: {% component 'ShareButtons' %}
```
### Buttons:
- `fb` - Facebook
- `in` - LinkedIn
- `ok` - Odnoklassniki
- `tg` - Telegram
- `tw` - Twitter
- `vb` - Viber
- `vk` - VK
- `wa` - WhatsApp
### CSS:
- 1 - enable
- 0 - disable
### Skins:
- `silver`
- `color`
- `text`
## Function `share`
You can call the `share()` function from within your scripts.
```js
share(id, paramsUrl);
```
Parameter | Type | Required | Description
------------|--------|----------|------------
`id` | string | Yes | Social network ID (fb, tw, vk, ok, in, tg, vb, wa)
`paramsUrl` | object | No | Can have `search` and `hash` options.
### Examples
The following example will send a page link to the Telegram messenger.
```js
share('tg');
// https://example.com/slug
```
#### `search` parameter
Part of the address after `?`
```js
share('wa', {search: 'a=2&b=3'});
// https://example.com/slug?a=2&b=3
```
#### `hash` parameter
The part of the URL that comes after the pound sign '#'
```js
share('wa', {hash: 'anchor'});
// https://example.com/slug#anchor
```
#### `search` and `hash` parameters
```js
share('wa', {search: 'a=2&b=3', hash: 'anchor'});
// https://example.com/slug?a=2&b=3#anchor
```