Share bar - Web Component ​

...

Browser support ​

Detected engine:  

  • Chromium

  • Webkit

  • Gecko

Parameters ​

The Web component uses the <z-share-bar> tag:

The parametrization of the component can be done with the following custom HTML params:

NameTypeDescription
contentstringThe quote content
socialobjectThe social media links

Playground ​

Customization ​

HTML Examples ​

Imports
html
<link rel="stylesheet" href="/0.4.4/@zurich/web-components/styles.css" />
<script type="module" src="/0.4.4/@zurich/web-components/share-bar.js"></script>
Code
html
<z-share-bar social='{ "facebook": "#"", "linkedin": "#"", "instagram": "#", "twitter": "#", "youtube": "#" }'>
  Share text
</z-share-bar>