If your store uses standard Editor 3.0 templates and you do not wish to enable the Social Media Sharing feature using the Design Wizard (the recommended option), you may instead enable this feature using the Store Editor Variables page. This option also requires you to add CSS styles to your store's css-edits file.

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 you 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.

Enabling the Social Media Sharing feature

1. In Store Editor, go to the Variables page.
   

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. Using the drop-down list for the Social-enable variable, choose "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 what Twitter hashtags are used for.
   
   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.

Next, you must add CSS styles for this feature to your store's css-edits file. 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. Note: A new #ys_social_pinterest element was added on October 16, 2012, to support the Pinterest sharing feature.

• Download the Social Media Sharing CSS file

• Download the Social Media Sharing CSS file for template theme 10

Template theme 10 is the theme displayed in the image below:

1. Open the file and copy the CSS styles.

2. In Store Editor, open the Advanced Editor, and click on the "Contents" link in the Advanced Editor toolbar.

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

4. Click the "Edit" link in the Editor toolbar.

5. Paste the CSS styles into the "Css-text" field.

6. Click the "Update" button.

Previewing your changes is recommended. Once you've enabled the Social Media Sharing feature, added the CSS styles to your store's css-edits file, and previewed your changes, you must publish Store Editor for the Social Media Sharing module to appear on your product pages.

Special notes for the Pinterest sharing feature, added October 16, 2012

If you enabled Social Media Sharing for your store before October 16, 2012, and wish to add the Pinterest sharing option, you must enable this option using the new Pinterest-enable option in Store Editor, as well as update your CSS bu re-running the Design Wizard or adding a new CSS element to your store's css-edits file.

To enable the Pinterest-enable option, please see step 6 in the "Enabling the Social Media Sharing Features" instructions, above.

If you do not wish to re-run the Design Wizard to update your store's CSS, you can add the following new CSS element to your store's css-edits file:

#ys_social_pinterest {float:left;}

For instructions on how to edit your store's css-edits file, see our Social Media Sharing CSS reference or the CSS instructions above.

Other notes

• 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?