How can I making Twitter, Facebook and Reddit share buttons load last?

Posted by Daniel Bingham on Pro Webmasters See other posts from Pro Webmasters or by Daniel Bingham
Published on 2011-02-15T22:45:15Z Indexed on 2011/02/15 23:34 UTC
Read the original article Hit count: 254

Filed under:
|

I have a website with a number of pages that sport twitter, facebook and reddit share buttons. They take forever to load and until they do the rest of the page doesn't load. So how I can make them load last?

Currently, they are loaded something like this:

<div class="item"><a href="http://twitter.com/share" class="twitter-share-button" data-count="vertical" data-via="FridgeToFood" data-related="danielBingham:Recipe and update tweets from Fridge to Food.">Tweet</a><script type="text/javascript" src="http://platform.twitter.com/widgets.js"></script></div>
<div class="item"><script src="http://connect.facebook.net/en_US/all.js#xfbml=1"></script><fb:like layout="box_count" width="40"></fb:like></div>
<div class="item">
    <script type="text/javascript">reddit_target='recipes';</script>
    <script type="text/javascript" src="http://reddit.com/static/button/button2.js"></script>
</div>

They are in a div called "shareWrapper" and are loading to one side of the page. The buttons load where ever the script code is placed. As far as I know, I can't place the script code at the bottom of the page and move the resulting buttons after the fact. I want them to appear near the top, which right now means they are stopping everything below them from loading for several seconds.

I tried loading them using javascript, but using JQuery's $(document).ready(), but that failed. It seems to leave the page in some sort of loading loop from which it never emerges. Are there other ways to get these to load last?

© Pro Webmasters or respective owner

Related posts about JavaScript

Related posts about social-media