ESL Share - custom element to trigger various share actions for page or url with metadata based on ESL web components

Examples

Share example

Share button examples

Example of share button with default icon rendering.

Another example of share button.

Share me through Linkedin

Example of share button with defining config via markup. The button's configuration uses attributes to specify the URL and title of the page to be shared.

The same button is defined via config and the name attribute.

Share list examples

Shows buttons from a specified group.

Displays list of share buttons of group 'alternative'

Shows buttons from a specified group.

Displays list of share buttons of the mix of Facebook, the group 'alternative', and Twitter button

Shows a Facebook button, buttons from a specified group, and a Twitter button.

List of share buttons which presents buttons with all action types

This example shows a button with the native share mechanism on the device which will be inactive on the desktop browser.

Displays list of share buttons (without group or list)

Shows all available buttons from config. The component's configuration uses attributes to specify the URL and title of the page to be shared.

Share popup trigger example

Displays trigger icon. Hovering or clicking on the icon shows a popup with the list of share icons. The component's configuration uses attributes to specify the URL and title of the page to be shared.