AddThis Blog

Adding Share Buttons to Your Emails (Or When You Can’t Use JavaScript)

There are some instances where JavaScript won’t work, such as email and with some content management systems. Yet we have a simple solution that can still get sharing buttons onto your next email campaign.

Basic Usage

To get our JavaScript-free buttons into your code, grab our newsletter code, and enter the URL you’d like to share. Our page will generate the code for you to add a Facebook, Twitter, and AddThis button for your site or email.

Please note that you can’t share the email that the buttons are in unless you have a web-accessible version of it. Also, like with our other tools, Facebook uses Open Graph tags so you’ll need to have those on the page you’re sharing (the link you’re including) to make sure Facebook displays the right title, image, and description when it’s shared.

Advanced Usage

If you want more than three buttons or if you want different services, you can read the pattern in the code to get it to do that. Let’s take a look at the code the above screenshot generates:

<!-- AddThis Button BEGIN -->
<a href="http://api.addthis.com/oexchange/0.8/forward/facebook/offer?pco=tbx32nj-1.0&amp;url=http%3A%2F%2Fwww.example.com%2F&amp;pubid=ra-4da371d82c643e7b" target="_blank" ><img src="http://cache.addthiscdn.com/icons/v1/thumbs/32x32/facebook.png" border="0" alt="Facebook" /></a>
<a href="http://api.addthis.com/oexchange/0.8/forward/twitter/offer?pco=tbx32nj-1.0&amp;url=http%3A%2F%2Fwww.example.com%2F&amp;pubid=ra-4da371d82c643e7b" target="_blank" ><img src="http://cache.addthiscdn.com/icons/v1/thumbs/32x32/twitter.png" border="0" alt="Twitter" /></a>
<a href="http://www.addthis.com/bookmark.php?source=tbx32nj-1.0&amp;=300&amp;pubid=ra-4da371d82c643e7b&amp;url=http%3A%2F%2Fwww.example.com%2F " target="_blank"  ><img src="http://cache.addthiscdn.com/icons/v1/thumbs/32x32/more.png" border="0" alt="More..." /></a>
<!-- AddThis Button END -->

See the pattern? The links for the Twitter and Facebook buttons all have /forward/ in them. So if we, for instance, wanted to add a Reddit button the code would look like this:

<a href="http://api.addthis.com/oexchange/0.8/forward/reddit/offer?pco=tbx32nj-1.0&amp;url=http%3A%2F%2Fwww.example.com%2F&amp;pubid=ra-4da371d82c643e7b" target="_blank" ><img src="http://cache.addthiscdn.com/icons/v1/thumbs/32x32/reddit.png" border="0" alt="Twitter" /></a>

And the button would look like this:

You can find a complete list of the available services on our services list. Note that this will only work with our native services. Third-party buttons like Facebook Like and Pinterest Pinit require JavaScript which, as we know, can’t run in an email.

Custom Images

Because our email newsletter buttons follow a pattern using your own images is very easy. All you need to do is replace the src attribute in the <img> tag with the absolute URL of your image. The absolute URL is the full URL of an asset online, including the protocol (http), the domain (www.example.com), and the path (/image.png).

So, if you had your own Facebook button at http://www.example.com/facebook_button.png, the code to use that button instead of our own would be:

<a href="http://api.addthis.com/oexchange/0.8/forward/facebook/offer?pco=tbx32nj-1.0&amp;url=http%3A%2F%2Fwww.example.com%2F&amp;pubid=ra-4da371d82c643e7b" target="_blank" ><img src="http://www.example.com/facebook_button.png" border="0" alt="Facebook" /></a>

Benefits of Using Email Newsletter Code

With any email campaign, you’re probably keen on understanding what’s performing well, and what’s driving the results you’re looking for. As with any AddThis tool, the email newsletter code is something you can easily track in your AddThis analytics. Clearly see what email campaign is driving more fans and followers to your social profiles!

Use JavaScript When You Can

When you can’t use JavaScript with your content management system, such as Google Pages, or email delivery services, the email newsletter option would be a great fit! But when you can use JavaScript, you’ll reap more of the benefits AddThis tools has to offer. Check out some of the latest website widgets we have for you to choose from.

If you’ve got any questions we’re here to help at help@addthis.com