At RJMetrics, we use Hubspot for marketing automation and decided to do some A/B testing to determine which links are more effective on our blog. We set up two buttons, or as Hubspot calls them, “Calls to Action.” Hubspot randomly chooses which button to display and lets us track the results of each. This requires embedding a snippet of Javascript on our blog, which Posterous (our blogging platform) does not allow. We can get around this limitation using iframes.

1. Create a new page where your Javascript snippet is housed. You will need to upload this child page to an online host. In this example, iframe_link_child.html is populated with a simple link and the following Javascript:

 

2. Add an iframe to your new page from your Posterous blog post by editing the HTML and adding:

 

3. Update Link Attributes. If you have links, by default, they will open inside the existing iframe. To improve the end user experience, it may be necessary to have links open on a new page. Simply edit the target tag of your link by adding target=’_blank’ to all existing links in your child page:

 

4. Hubspot Specific: Edit Javascript to allow for new target. If you are using Hubspot’s call to actions, you will need to use Javascript to edit the element’s target property because Hubspot generates the link on the fly. To do this, execute the following Javascript code:

 

Voila! Check out our finished Javascript-enabled button on the Posterous platform: