All Collections
Share Buttons
How can I embed my share buttons in my template?
How can I embed my share buttons in my template?
Anna Schmitz avatar
Written by Anna Schmitz
Updated over a week ago

If you use share buttons in your template, you'll want automatically generate share buttons with each. You can use embedded share buttons to embed buttons in your template to automatically generate share buttons with each generated share button.

1. Install Your Share Code Snippet

You'll want to include your share code snippet in the <head> section of any page where you use ShareProgress buttons:

If there aren't any buttons on the page, the script doesn't do anything, so it doesn't hurt to include it on other pages if it makes things easier.

2. Add The Share Button Tags

You can include the following tags on any page with the share code snippet to have it automatically generate a ShareProgress share button:

  • Facebook share

<div class="sp_fb_small sp_share_button"></div>
  • Twitter share

<div class="sp_tw_small sp_share_button"></div>
  • Email share

<div class="sp_em_small sp_share_button"></div>

The first time a visitor comes to the page, it will create a new button in the ShareProgress system. You can then go view your buttons in order to make any share text edits and set up any A/B tests you want to run (the name of the button(s) will be the same as the page name).

Optional: Include Meta Tags

Facebook share text will be automatically set based on any Open Graph tags on the page, but if you want to specify Twitter share language, you can do so with the following meta tag:

<meta name="sp:twitter" content="TWEET_TEXT" />

When a new Twitter share button is created, it will then use that share language by default.

Did this answer your question?