jQuery Plugin To Display Facebook Fan Page Activity Feed - FB Wall
| File Size: | 8.27 KB |
|---|---|
| Views Total: | 7842 |
| Last Update: | |
| Publish Date: | |
| Official Website: | Go to website |
| License: | MIT |
FB Wall is a lightweight jQuery plugin that embeds a custom activity feed (e.g. posts, photos, events) from any Facebook fan page into your web page.
See also:
- jQuery Plugin To Display Latest Facebook Updates - Facebook Wall
- jQuery Plugin For Displaying Complete Facebook Fanpage Data - Famax
- Facebook Fan Page Feed Widget with Likes - Facio
How to use it:
1. Include jQuery library and the jQuery FB Wall plugin on your web page.
<script src="http://code.jquery.com/jquery-1.11.1.min.js"></script> <script src="js/fbwall.js"></script>
2. Include the jQuery templates plugin to render the activity feed data as a template.
<script src="js/jquery.tmpl.min.js"></script>
3. Create the template for the Facebook activity feed wall.
<script id="headingTpl" type="text/x-jquery-tmpl">
<h1>${name}<span>on Facebook</span></h1>
</script>
<script id="feedTpl" type="text/x-jquery-tmpl">
<li>
<img src="${from.picture}" class="avatar" />
<div class="status">
<h2><a href="http://www.facebook.com/profile.php?id=${from.id}" target="_blank">${from.name}</a></h2>
<p class="message">{{html message}}</p>
{{if type == "link" }}
<div class="attachment">
{{if picture}}
<img class="picture" src="${picture}" />
{{/if}}
<div class="attachment-data">
<p class="name"><a href="${link}" target="_blank">${name}</a></p>
<p class="caption">${caption}</p>
<p class="description">${description}</p>
</div>
</div>
{{/if}}
</div>
<p class="meta">${created_time} ·
{{if comments}}
${comments.count} Comment{{if comments.count>1}}s{{/if}}
{{else}}
0 Comments
{{/if}} ·
{{if likes}}
${likes.count} Like{{if likes.count>1}}s{{/if}}
{{else}}
0 Likes
{{/if}}
</p>
</li>
</script>
4. Initialize the plugin with a fanpage id and an access token.
$('#wall').facebookWall({
// insert your fanpage id
id:'jqueryscript',
// insert your acces token
access_token:''
});
5. You can also pass a custom limit as a parameter.
$('#wall').facebookWall({
// insert your fanpage id
id:'jqueryscript',
// insert your acces token
access_token:'',
// any amount
limit: 15
});
This awesome jQuery plugin is developed by Gertt. For more Advanced Usages, please check the demo page or visit the official website.











