webvpf/wn-share-plugin

Share Buttons - plugin for Winter CMS. Displays share buttons.

Maintainers

Details

github.com/WebVPF/wn-share-plugin

Homepage

Source

Issues

Installs: 380

Dependents: 0

Suggesters: 0

Security: 0

Stars: 6

Watchers: 1

Forks: 1

Open Issues: 0

Type:winter-plugin

v1.2.1 2022-07-18 20:42 UTC

Requires

MIT 0aee4554f7999a1a234e2d7e3d57173189b1aa15

  • WebVPF

socialsharewintercmswinter cmswintercms-plugin

This package is auto-updated.

Last update: 2024-04-19 00:10:51 UTC

README

plugin cover

Share Buttons - plugin for Winter CMS. Plugin component displays share buttons.

Инструкция на русском языке: https://github.com/WebVPF/wn-share-plugin/wiki

Installation Сomposer:

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 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)

Component Share Buttons

In this case, you can specify the order in which the buttons will be displayed.

You can do a similar layout:

<div>Share: {% component 'ShareButtons' %}</div>

or

<div class="container">
    <h3>Share</h3>
    <div>{% component 'ShareButtons' %}</div>
</div>

Button Style

Silver

Silver

Color

Color

With text

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:

[ShareButtons]
btns = "fb, tw, vk, ok, in, tg, vb, wa"
css = 1
skin = "text"
==
<div>Share: {% component 'ShareButtons' %}</div>

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.

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.

share('tg');

// https://example.com/slug

search parameter

Part of the address after ?

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 '#'

share('wa', {hash: 'anchor'});

// https://example.com/slug#anchor

search and hash parameters

share('wa', {search: 'a=2&b=3', hash: 'anchor'});

// https://example.com/slug?a=2&b=3#anchor