Adding Custom Twitter Buttons

Follow

These 'Tweet' and 'Follow' buttons are small widgets that will allow your visitors to easily interact with you on Twitter without ever having to leave your landing page.

Setting these widgets up is a simple two step process.  All you need to do is:

  1. Add the Twitter Javascript to your Unbounce page, and
  2. Embed the custom HTML components on your page.

You can fully customize the appearance and functionality of these buttons by following the instructions at Twitter's Developer websites for the Tweet Button and the Follow Button.

Step One - Add the Twitter Javascript to your Unbounce page

  1. Click the Javascripts javascript_button.png button in the bottom left of the editor. A new dialog box will appear.  
  2. In the new Manage Scripts dialog box, fill out the following information:
    • In the Script Name field, type ‘Twitter Buttons’.
    • In the Placement drop-down menu, select the Head option.
    • Copy the script found on this Twitter site and paste it into the main body of the dialog box.
  3. Click the Save Code button at the bottom right corner of the dialog box.twitter_buttons_code.png

 

Step Two - Add the Custom HTML Components On Your Page

  1. Drag and drop the Custom HTML custom_html_widget.png widget from the left-hand side of the editor to the place on your page where you would like to add the Twitter buttons. A new dialog box will appear.
  2. Follow the twitter link below and copy the code found on the page. The link will also teach you how to make any specific changes to the code if you’d like to customize the look, link, or tweet.  
  3. Go back to the Unbounce Builder. Paste in the twitter code to the Embed Custom HTML Code dialog box.
  4. Click the Save Code button at the bottom right corner of the dialog box.
  5. Save and Publish/Republish your page.

That's it! You’re all set for all your Twitter Needs. The Finished Product:

twitter_buttons_finished_product.png

 

Note:

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

 

Was this article helpful?
0 out of 0 found this helpful