Edward Touw

Sharing email content on social media

Written by Edward Touw Marianna Kavvadia on

Share buttons can help you share your newsletter’s content with a wider audience on social media like Facebook, Google+, LinkedIn and Twitter. In a lot of cases however, these buttons are built using java script, making them worthless for emailings. But don’t worry, there is a way to include share buttons in your emails by using HTML only (and a bit of Smarty).

Share on social media

Sharing web pages from your newsletter

Your newsletters’ recipients can share the content you link to in your emailing, without having to visit the page you’re linking to first.

To do so, include the following HTML in your email’s source code:

Facebook

<a href="http://www.facebook.com/sharer/sharer.php?u=http://www.URLexample.com">Share on Facebook</a>

Twitter

<a href="http://twitter.com/home?status=Fil+in+a+title+http://www.URLexample.com">Share on Twitter</a>

LinkedIn

<a href="http://www.linkedin.com/shareArticle?mini=true&url=http://www.URLexample.com">Share on LinkedIn</a>

Google+

<a href="https://plus.google.com/share?url=http://www.URLexample.com">Share on Google+</a>

Sharing your emailing’s web version

Sharing your newsletter’s web version on social media is a tad more difficult. After all, we are handling with a URL, when offering personalized content, that might not be the same for every recipient.

Therefore you should replace the URL from the examples mentioned before, with a bit of Smarty code:

Facebook

<a href="http://www.facebook.com/sharer/sharer.php?u={webversion}">Share on Facebook</a>

Twitter

<a href="http://twitter.com/home?status=Fill+in+a+title+{webversion}">Share on Twitter</a>

LinkedIn

<a href="http://www.linkedin.com/shareArticle?mini=true&url={webversion}">Share on LinkedIn</a>

Google+

<a href="https://plus.google.com/share?url={webversion}">Share on Google+</a>

Tip: Replace ‘Share on…’ with an image of the social media channel in question.

Meta description and title tag

Facebook, LinkedIn and Google+ use a webpage’s meta description and title tag to generate a preview of the shared content. Always make sure to set these up for every page.

To do so, use the following HTML codes:

<title>Fill in a title</title> <meta name="description" content="Fill in your meta description.">

Put this piece of code between your tags. And keep in mind that a good meta description doesn’t exceed a maximum of 160 characters.