-
-
Save simshanith/4271873 to your computer and use it in GitHub Desktop.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <!DOCTYPE html> | |
| <html class="en"> | |
| <head> | |
| <meta charset="utf-8"> | |
| <title>Example Facebook Page Like Box</title> | |
| </head> | |
| <body> | |
| <div id="fb-root"></div> | |
| <div id="main-wrapper" style="height: 100%;"> | |
| </div><!-- end main wrapper --> | |
| <script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script> | |
| <script> | |
| // default values for rendering Like Box. | |
| // docs @ https://developers.facebook.com/docs/reference/plugins/like-box/ | |
| var href = 'https://www.facebook.com/VML' // Facebook page to display | |
| iframeWidth = 400, // minimum supported width == 292px. required paramter. | |
| iframeHeight = undefined, // optional | |
| colorScheme = 'light', // light looks way better in my opinion | |
| showFaces = true, // not supported in all browser. renders facepile of everyone who has liked the page | |
| stream = true, // show the Facebook Page wall posts? | |
| borderColor = undefined, //optional; expects css color. does not accept rgba(); does accept rgb() | |
| header = true, // show "Find Us on Facebook" at the top of the iFrame | |
| forceWall = false; // only for Pages that are also Facebook Places. toggles between wall posts & checkins on stream | |
| // construct container for Like Box iFrame | |
| $('<div id="fbLikeBox" class="fb-like-box" style="height: 100%;">') | |
| .attr('data-href', href) | |
| .attr('data-width', iframeWidth) | |
| .attr('data-height', iframeHeight) | |
| .attr('data-colorscheme', colorScheme) | |
| .attr('data-show-faces', showFaces) | |
| .attr('data-stream', stream) | |
| .attr('data-border-color', borderColor) | |
| .attr('data-header', header) | |
| .attr('data-force-wall', forceWall) | |
| .appendTo('#main-wrapper'); | |
| window.fbAsyncInit = function(){ // async init callback | |
| var $likeBox = $('#fbLikeBox'); // save a reference to the jQuery obj | |
| if($likeBox && | |
| $likeBox[0] && // basic Reference Error avoidance | |
| !$likeBox.attr('fb-xfbml-state') && // see if it's currently being processed | |
| window.FB) | |
| { // confirm that the FB JS SDK has been loaded | |
| console.log('parsing XFBML'); | |
| console.log(document.getElementById('fbLikeBox')); | |
| FB.XFBML.parse(document.getElementById('fbLikeBox')); | |
| } | |
| }; | |
| </script> | |
| <script> | |
| var myAppID = 160939127744; // facebook application id | |
| (function(d, s, id) { | |
| var js, fjs = d.getElementsByTagName(s)[0]; | |
| if (d.getElementById(id)) return; | |
| js = d.createElement(s); js.id = id; | |
| js.src = "//connect.facebook.net/en_US/all.js#xfbml=1&appId="+myAppID; | |
| fjs.parentNode.insertBefore(js, fjs); | |
| }(document, 'script', 'facebook-jssdk')); | |
| </script> | |
| </body> | |
| </html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment