How to Share Content Using Standard and Custom Icons with Social Forward

This document contains conceptual and procedural information on sharing content through the Social Forward function using standard and custom icons to represent your social networks of choice.

Prerequisites

You should be familiar with HTML and AMPscript in order to make full use of the Social Forward section.

Why Use Standard and Custom Icons with Social Forward

Social Forward uses a default set of icons to represent the social networks supported within the  ExactTarget application. However, you may want to alter the appearence of icons to call attention to a section, such as changing the size or color of the icon. You may also want to alter the icon to better fit the design of your email. These steps allow you to change the icons used in Social Forward in a specific message without alterting the default icons.

How to Create your Email

Follow these steps to create your email:

  1. Begin your email in the ExactTarget application using a template or by revising an existing email.
  2. Click a content box and select Create Content.
  3. Choose a HTML content box and click Next.
  4. Enter the Shared Content Slot name, Title, and Description. Choose a CSS stylesheet if you wish. Click OK when you are finished.
  5. Paste either the Standard Icon or the Custom Icon Base HTML Mark-up inside the two HTML region tags. You can find that code in the appropriate section below.
  6. Paste the Social Specific HTML Mark-up wherever you want the icon to be located. ExactTarget recommends placing it as close to the content to be shared as possible for best results, but you can locate the code anywhere in the email. Make sure the content slot name matches in the region tags and the code.

Standard Icon

The following HTML code shows a standard email using content boxes to share content with a standard Facebook icon.

Base HTML Mark-up

The Base HTML Mark-Up contains the general content in the box:

<p>Standard Facebook Icon</p>
<table cellspacing="0" cellpadding="0" align="left">
    <tbody>
        <tr>
            <td align="right"><a href="http://example.com" conversion="false" title="" alias="">Share this link using the Facebook icon!</a></td>
        </tr>
    </tbody>
</table>
<p>This link takes you to Example.com.</p>

Social Specific HTML Mark-Up

The Social Specific HTML Mark-Up contains the content specific to sharing the content in the box. Make sure the content slot name in the GetSocialPublishURL() function matches the name you gave your content slot in the Create Your Email steps.

<p><a href="%%=GetSocialPublishURL('1','StandardFacebookShare')=%%" alias="Social Forward to Facebook" title="Publish to Facebook"><img src="http://image.preview.exacttarget.com/lib/ffcf14/m/1/social_default_facebook_icon.jpg" border="0" alt="Facebook" title="Facebook"></a></p>

Custom Icon

The following HTML code shows a standard email which uses content boxes to share content with a custom Facebook icon.

Base HTML Mark-up

The Base HTML Mark-Up contains the general content in the box. 

<p>Custom Facebook Icon</p>
    <table cellspacing="0" cellpadding="0" align="left">
        <tbody>
            <tr>
                <td align="right"><a href="http://example.com" conversion="false" title="" alias="">Share this link using the Facebook icon!</a></td>
            </tr>
        </tbody>
    </table>
<p>This link takes you to Example.com.</p>

Social Specific HTML Mark-Up

The Social Specific HTML Mark-Up contains the content specific to sharing the content in the box. The difference between this Mark-Up and the Standard Icon Social Specific Mark-Up is the URL specified in the img src="" tag. Make sure the content slot name in the GetSocialPublishURL() function matches the name you gave your content slot in the Create Your Email steps.

<p><a href="%%=GetSocialPublishURL('1','CustomFacebookShare')=%%" alias="Social Forward to Facebook" title="Publish to Facebook"><img src="http://image.preview.exacttarget.com/lib/ff66157875/m/1/facebook-alt.png" border="0" alt="Facebook" title="Facebook"></a></p>

 


Enter the digits 17390 backwards:
   
 

 

 

Tag page
You must login to post a comment.