Adding ShareThis Buttons to Your Landing Page

Follow

Adding ShareThis share buttons will give your visitors a number of customizable ways to spread the landing page love and is pretty easy to set up. To set this up, you will need first configure the buttons on your ShareThis platform, then:  

  1. Add the ShareThis Javascript to your Unbounce page, and
  2. Embed the custom HTML components for either share buttons or follow buttons on your page.

Step 1 - Add the ShareThis Javascript to Your Unbounce Page

  1. Log in to your ShareThis account.
  2. On the bottom left corner of the screen, click the Property Settings option. A new page will appear.
  3. Scroll down the page until you see the section entitled Get the code: copy and install sharethis.js. Copy the javascript that you see in this section.
  4. Log in to your Unbounce account and find the page where you would like to add your ShareThis widget. Click Edit to get to the Unbounce Builder.
  5. Click the Javascripts javascripts_button.png button in the bottom left of the editor to add the javascript to your Unbounce page. A new dialog box will appear.  
  6. In the new Manage Scripts Dialog box, fill out the following information:
    1. In the Script Name field, type “ShareThis Buttons”.
    2. In the Placement drop-down menu, select Head.
    3. Paste the script from your ShareThis account into the blank field.
  7. Click the Save Code button at the bottom right-hand corner of the dialog box.sharethis_javascripts_code.png

 

Step 2 - Add the Share/Follow Buttons to Your Landing Page

ShareThis gives you a number of different styles of Share and Follow Buttons that you can add to your landing page.

  1. Start by selecting the option that you’d prefer and navigate to that option on the ShareThis platform.
  2. Toggle the switch to ‘on’ on the ShareThis website for the button style that you’ve selected.sharethis_toggle.png
  3. Follow the instructions on the ShareThis website to pick which social media platforms you’d like to add to your Share/Follow Buttons and arrange them in the order and alignment settings that you’d like.

    Note:

     If you’re using Follow Buttons, make sure that you fill out your account information in the ShareThis platform at the bottom of the Inline Follow Buttons page for any accounts that you’re adding in the widget.
  4. Copy the code provided on the ShareThis page.sharethis_copy_code.png
  5. Navigate to the Unbounce Builder. Drag and drop the Custom HTML custom_html_widget.png button from the left side of the editor to the place on your page where you would like to add the ShareThis Buttons. A new dialog box will appear.
  6. Paste in the ShareThis code to the Embed Custom HTML Code dialog box.
  7. Click the Save Code button at the bottom right-hand corner of the dialog box.
  8. Save and Publish/Republish your page.

You’re ready to take the social media world by storm! The Finished Product:

sharethis_finished_product.png 

Note:

If you’d like to include both the Share and Follow buttons as above, you’ll need to embed a separate Custom HTML component for each widget, though the javascript only needs to be included once.



Was this article helpful?
1 out of 4 found this helpful