A great way to build brand recognition and buzz about your site is to engage your customers using social media. It is also a good way to help drive traffic and help bring other potential customers to your store. In today’s world of fickle tastes, it’s no longer safe to think only of FaceBook as the only game in town. There are other networks to think about too, like the up and coming Google Plus, or the no-nonsense style of Twitter. And now Pinterest is making a splash and finding some favor as a sharing platform.
In order to help your customers spread the word about your store or the products offered, we are donating to the community an updated set of controls for social media. They could be extended on to add new social media outlets, or restyled to get the right look for your site. There are two different controls in the patch. They display the same information but using slightly different formats.
SocialMediaLinks.ascx is a control that should output links in a flow-based layout, given enough space it will show up as a horizontal bar:
This was added to the product page by going to the Manage > Scriptlets menu. The filter was set to content scriptlets, and the Show Product 1 scriptlet was edited. The line below (shown in bold) was inserted into the scriptlet content to display above the discount and buy dialog controls.
#end <hr /> [[ConLib:SocialMediaLinks ShowFacebook="true" ShowTwitter="true" ShowGoogle="true" ShowPinterest="true"]] <br /><br /> [[ConLib:ProductDiscountsDialog]] [[ConLib:BuyProductDialog]]
As can be seen from the example, the control has four options that will allow you to selectively enable or disable particular social media outlets. Changing true to false (or vice versa) will toggle the particular image in the output.
NOTE: In the image above, an additional customization was made that cannot be accomplished through the web based admin. The file ConLib/BuyProductDialog.ascx was modified to remove the existing FaceBook Like button that appears on the product page. The following lines (around 19 to 23) were deleted from the file:
<tr> <td colspan="2"> <uc:FacebookLikeWidget ID="LikeMe" runat="server" /> </td> </tr>
SocialMediaLinksDialog.ascx is a control that should output links in a style appropriate for the sidebar, using vertical arrangement and including a header.
This was added to the product sidebar by going to the Manage > Scriptlets menu. The filter was set to sidebar scriptlets, and the Product Bar 1 scriptlet was edited. The line below (shown in bold) was inserted into the scriptlet content to display above the mini-basket and product asset dialogs:
[[ConLib:SocialMediaLinksDialog ShowFacebook="true" ShowTwitter="true" ShowGoogle="true" ShowPinterest="true"]] [[ConLib:MiniBasket AlternateControl="PopularProductsDialog.ascx"]] [[ConLib:ProductAssets]]
Both controls offer the same options for toggling individual social media outlets on and off. Either control can be added to any scriptlet. For developers, they can also be added using declarative syntax in any ASP.NET file. To install the files, all you have to do is unzip these files and place them in the ~/ConLib folder of your website:
SocialMediaLinks.ascx SocialMediaLinks.ascx.cs SocialMediaLinksDialog.ascx SocialMediaLinksDialog.ascx.cs
Happy Socializing!