Add ShareOpenly to your site

Add a ShareOpenly share button to your site so your visitors can share your content to any social network. No account or sign-up needed.

Share Button

Add a share button anywhere on your page. Copy and paste this code:

<div class="shareopenly-button"></div>
<script defer src="https://shareopenly.org/js/v1/shareopenly.js"></script>

To show a text label next to the icon, add data-label:

<div class="shareopenly-button" data-label="Share"></div>

The button automatically shares the current page URL and title. You only need to include the script tag once, even if you have multiple buttons on the page.

Floating Share Button

Add a floating share button that stays fixed on the screen as the user scrolls:

<div class="shareopenly-floating"></div>
<script defer src="https://shareopenly.org/js/v1/shareopenly.js"></script>

By default it appears in the bottom-right corner. To move it, use data-position:

<!-- bottom-left, top-right, or top-left -->
<div class="shareopenly-floating" data-position="bottom-left"></div>

For full positioning control, use inline CSS:

<div class="shareopenly-floating" style="bottom: 40px; right: 100px;"></div>

Options

Attribute Description
data-label Text label next to icon (e.g. "Share")
data-theme purple (default), light, dark, or auto
data-size small, medium (default), or large
data-url Override the URL to share (default: current page)
data-text Override the share text (default: page title)
data-position Floating only: bottom-right, bottom-left, top-right, top-left

Color Themes

↗ Share
purple (default)
↗ Share
light
↗ Share
dark
↗ Share
auto (matches dark mode)

For a custom background color, use a CSS custom property:

<div class="shareopenly-button" style="--shareopenly-bg: #ff6600"></div>

The icon color adjusts automatically based on the background brightness.

Custom Integration

If you'd prefer to build your own share link instead of using the button widget, you can link directly to ShareOpenly:

https://shareopenly.org/share/?url={URL}&text={TEXT}

Replace {URL} with the full URL of the page you want to make shareable, and {TEXT} with the title of the page or any other text you want to encourage your visitors to share.

The url parameter is optional. You can share text without a URL:

https://shareopenly.org/share/?text={TEXT}

Note that some platforms (Facebook, LinkedIn, Reddit, and Telegram) require a URL to share, so they won't appear as options for text-only shares.