In this post, I will explain how to load facebook like button faster.
The Official Method Explained on Facebook
The official method to load Facebook Button for HTML5 is below.There is another option - using iframe. See below.
In my experience, using iframe is relatively faster than using HTML5.
I think it's because if we use the HTML5 method, the facebook javascript SDK should be loaded before rendering the like button.
Actually, this is important fact, even if you choose the html5 way to load like button, the loaded like button is iframe in the end.
So question comes up - "What about load iframe like button manually by my self wrinting javascript?".
Loading ifram Like Button by Javascript
The below code shows loading iframe like button by javascript. To be honest nothing special at all - create iframe like button and append it to html by javascript.
$(function(){ $("#fblike").append(createLike("http://dukesoftware00.blogspot.com")); }); function createLike(url) { return '<iframe src="http://www.facebook.com/plugins/like.php?locale=en_US&href='+encodeURIComponent(url) +'&layout=button_count&show_faces=true&width=121&action=like&colorscheme=light&height=21&appId=332534556829019" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:120px; height:21px;" allowTransparency="true"></iframe>'; }
The like button below is the actual demo for above script.
コメント