Enabling the Social Media Sharing feature using the SOCIAL-SHARE RTML operator is recommended only for merchants using custom templates. If you are using standard Editor 3.0 templates, you may enable this feature by using the Design Wizard (recommended), or by using the Store Editor Variables page and adding CSS styles to your store's css-edits file.

IMPORTANT: If you are not familiar with modifying RTML, contacting your developer is strongly recommended. Please note that Turbify does not support template customization or RTML modification.

Enabling this option requires

• Inserting the SOCIAL-SHARE RTML operator into the store template that displays the store-item (recommended placement)
• Adding CSS styles to your store's CSS file
• Configuring your Social Media Sharing settings using the Store Editor Variables page

If your store uses custom types, please see the special note about custom types at the bottom of this help article.

Before you start

When enabling the Social Media Sharing feature, you will be given the option to enter a Facebook Application ID. Providing a Facebook Application ID is recommended, but optional. When you provide this ID, it enables Facebook's Open Graph Meta Tags, which let you administer Facebook Pages for products (where yo u can share product updates and engage with customers who have Liked a product), and use Facebook Insights to track key metrics.

While the Social Media Sharing feature has been designed to share the correct product image, product name, and product description even in the absence of a Facebook Application ID, because the Facebook Like feature belongs to a third-party site, this feature may change or be deprecated over time. Providing a Facebook Application ID helps to ensure that the correct product image, product name, and product description continue to be shared in the event of some feature changes.

Step 1. Inserting the SOCIAL-SHARE RTML operator

The template in which you insert the SOCIAL-SHARE RTML operator will depend on your individual template customization. Recommended placement is in the template that displays the store-item.

Using the example of the standard Editor 3.0 display-item. template, to add the SOCIAL-SHARE RTML operator:

1. In Store Editor, open the Advanced Editor.

2. Click the Contents link in the Advanced Editor toolbar.

3. Click the Templates link to open the Template Editor.

4. Open the template you wish to add the SOCIAL-SHARE operator to for editing.

5. Using the example of the display-item. template, click the last div link in your template, then click New in the Template Editor toolbar.*

6. Select SOCIAL-SHARE from the list of RTML operators, and click Create.

7. Click the Paste After button in the Template Editor toolbar.

* Note: These instructions are provided as an example only. Placement of the SOCIAL-SHARE RTML operator will vary depending on your template customization.

Step 2. Adding the Social Media Sharing CSS styles

You must add the Social Media Sharing CSS styles to the CSS file used by your store templates. If the CSS styles are not added, formatting will not be applied to the Social Media Sharing module that will appear on your product pages.

First, download the Social Media Sharing CSS styles. The display attributes provided for each of the styles in the Social Media Sharing CSS file are the default styles for standard Editor 3.0 templates. You may need to customize these styles for your store, depending on your store design.

• Download the Social Media Sharing CSS styles

Once you've opened this file and made any necessary CSS modifications (see our Social Media Sharing CSS reference for information about the CSS styles), copy the CSS and insert it into the appropriate CSS file used by your store templates.

If your store templates use the css-edits file, you can insert the CSS styles into this file:

1. In Store Editor, open the Advanced Editor.

2. Click on the Contents link in the Advanced Editor toolbar.

3. On the Contents page, click the css-edits link.

4. Click the Edit in the Editor toolbar.

5. Paste the Social Media Sharing CSS into the Css-text field.

6. Click Update.

Step 3. Configuring your Social Media Sharing settings using the Store Editor Variables page

Once you've inserted the SOCIAL-SHARE RTML operator and added the CSS styles, you must configure your Social Media Sharing settings using the Variables section of Store Editor:

1. Open the Variables section of Store Editor.

2. Scroll to the Social Media Sharing section, located near the bottom of the page. Here, you will see four variables: Social-enable, Facebook-application-id, Twitter-hashtag, and Pinterest-enable.

3. Check that the Social-enable variable is set to Yes.

4. Recommended step: If you have a Facebook Application ID for your store, you may enter it into the Facebook-application-id field. If you don't have a Facebook Application ID but wish to obtain one, learn how.

5. Optional step: If you wish to add a custom Twitter hashtag to be used when customers share your products with their followers on Twitter, you may enter this hashtag into the Twitter-hashtag field. Read about how Twitter hashtags are used.
   
   Hashtags may be up to 20 characters in length, and should not include a # sign. The # sign is automatically added to your hashtag in the default message provided to customers. Including a # sign in this field will result in the hashtag displaying a duplicate # sign (e.g., ##myhashtag).

6. Optional step: If you wish to include a button for Pinterest sharing on your product pages, set the Pinterest-enable option to Yes.

7. Click the Update button.

Previewing your changes is recommended. Once you've completed the steps listed above and previewed your changes, you must publish your store for the Social Media Sharing module to appear on your product pages.

Note: When you add a new product, or first enable the Social Media Sharing feature for your products, you may notice a time delay between publishing your changes and when Facebook recognizes the Like function on the product page. This time delay issue is on Facebook's end, and because of this, Turbify cannot change how these updates are handled by Facebook.

When this delay occurs and a user clicks the Like icon on a product page, a message noting that Facebook is unable to reach the page will be displayed beside the Like icon. In some cases the delay lasts for only 1 to 5 minutes after publishing, and in other cases, can take an average of 15 minutes to resolve. If this does not resolve after an hour, then any errors seen as a result of clicking the Like icon may be as a result of a different issue.

Special note about custom types

Types define which properties are used for objects of that type. If you've created custom types for your store products, in order to use the SOCIAL-SHARE RTML operator, the type must be orderable, or have a sale price or price. The SOCIAL-SHARE RTML operator must be called by the custom template used for the custom type you've defined for your store products.

See Also:

• Social Media Sharing CSS reference
• Can I choose not to display one of the Social Media Sharing feature options?
• Can I disable the Social Media Sharing feature on individual product pages?
• How do I get a Facebook Application ID?
• How do I administer Facebook Pages for my products?
• How do I enable and use Facebook Insights?
• What's a Twitter hashtag, and how do I create one for my store?