Help Us To Improve, We Need Your COMMENTS

    read more

    Add "Drag To Share" To Blogger Blogs

    0

    You would have observed a unique bookmarking tool being used at Mashable: "Drag To Share". In 'Drag To Share', when you hover your mouse on some links (usually images), a message is displayed is to drag and share the page.





    Script in Action - LIVE DEMOS:
    • Check out "Drag and Share" on Mashable (drag the image in the post)
    • "Drag to Share" is a project by No Margin For Errors, check out the demo on their project-page.
    If you are impressed with the widget, then Add "Drag To Share" to your Blogger blog:

    STEP #1

    Log in to Blogger, go to Layout -> Edit HTML

    Now find this code:
    </head>
    And immediately BEFORE/ABOVE it, paste this code:
    <!--DRAG-TO-SHARE-STARTS-->
    <link charset='utf-8' href='http://files.main.bloggerstop.net/uploads/3/0/2/5/3025338/prettysociable.css' media='screen' rel='stylesheet' type='text/css'/>
    <script charset='utf-8' src='http://code.jquery.com/jquery-latest.js' type='text/javascript'/>
    <!--[if lte IE 6]><script src="http://files.main.bloggerstop.net/uploads/3/0/2/5/3025338/dd_belatedpng.js" type="text/javascript" charset="utf-8"/>
    <![endif]-->
    <script charset='utf-8' src='http://files.main.bloggerstop.net/uploads/3/0/2/5/3025338/jquery.prettysociable.js' type='text/javascript'/>
    <!--DRAG-TO-SHARE-STOPS-http://rapidgadgets.blogspot.com-->
     Now find this code in the template:
    </body>
     And immediately ABOVE/BEFORE it, paste this code:
    <!--DRAG-TO-SHARE-STARTS-->
    <script charset='utf-8' type='text/javascript'>
    $.prettySociable();
    </script>
    <!--DRAG-TO-SHARE-STOPS-->
     Save The Template.

    STEP #2

    IMPORTANT: Now whenever you want to apply this hack to any of your images/hyperlinks (links), then add a rel="prettysociable" attribute to the "a" tag. (You can edit your previous posts to add this attribute to your images).

    For example, a link (hyperlink) with this hack will look like this:
    <a href="http://www.google.com/" rel="prettysociable">Link To Google</a>
     and a linked image with this hack will look like this:
    <a href="http://www.google.com/" rel="prettysociable"><img src="http://www.google.co.in/intl/en_com/images/logo_plain.png" /></a>

    Posted on : | By : Er. Ankita Dhiman | In : , ,

    One Response to "Add "Drag To Share" To Blogger Blogs"

    Followers