Add Pinterest - Pin It Button to RadSocialShare

Thread is closed for posting
1 posts, 0 answers
  1. 63F75A2C-1F16-4AED-AFE8-B1BBD57646AD
    63F75A2C-1F16-4AED-AFE8-B1BBD57646AD avatar
    1572 posts
    Member since:
    Oct 2004

    Posted 25 Jan 2013 Link to this post

    Requirements
    RadControls version Q3 2012
    .NET version any
    Visual Studio version any
    programming language JavaScript
    browser support

    all browsers supported by RadControls


    PROJECT DESCRIPTION

    Currently RadSocialShare does not support Pinterest Pin It button out of the box. However, the button can easily be add manually to the control through JavaScript.

     

    Each main button of RadSocialShare is rendered as LI with class “sshListItem” which is located in an UL with class “sshContent” and the Pinterest button is rendered as anchor with an image inside of it. The href attribute of the anchor is a JavaScript function that searches for any images that can be Pinned. This function is obtained from Pinterest (http://pinterest.com/about/goodies/).

    javascript:void((function()%7Bvar%20e=document.createElement('script');e.setAttribute('type','text/javascript');e.setAttribute('charset','UTF-8');e.setAttribute('src','http://assets.pinterest.com/js/pinmarklet.js?r='+Math.random()*99999999);document.body.appendChild(e)%7D)()); '

     

    The function AddButton searches for the UL with class “sshListItem” and adds a LI element to it which contains the Pinterest anchor and image. The function also applies width to the RadSocialShare, so that the new button fits in. The AddPinterestPin is the function that calls the AddButton function with the appropriate arguments - the first is the UL class of RadSocialShare and the second one is the HTML of the Pinterest button which is to be inserted. The AddPinterestPin function which inserts the Pin It Button is executed in the window.onload event.

    The original version of the code is taken from the Extend RadSocialShare using RadSocialExtender.js addon blog post  by Patrick Dunn.

Back to Top

This Code Library is part of the product documentation and subject to the respective product license agreement.