Implement Native Sharing Buttons With Ease – share-button

Preview:

Description:

share-button is a super tiny web component that allows users to share the current page through their OS’ native sharing dialog.

It leverages the Web Share API to provide a platform-agnostic sharing experience, which means your visitors can share web pages directly with their favorite apps, regardless of the device or operating system they’re using.

How to use it:

1. Download and import the share-button.js as a module.

<script type="module" src="share-button.js">
</script>

2. Wrap your sharing button into the <share-button /> component. That’s it.

<share-button>
  <button>Share</button>
</share-button>

Changelog:

v1.1.3 (04/18/2024)

• Fixes sharing URLs from Firefox mobile

v1.1.2 (12/30/2023)

• Bugfix

v1.1.1 (12/20/2023)

• Catch errors when the native share UI is dismissed