Monday, 9 March 2015

Famax 4.0 - The Complete Facebook FanPage Solution - jQuery Plugin

Famax 4.0 - jQuery plugin

Check out our latest project - Dream Pack!

The Complete Facebook FanPage experience on your website!

4.0 Features:

1. A page to display all Albums of the FanPage
2. A page to display all Videos of the FanPage
3. Dispay Comments and Likes for any Post
4. Ability to add Comments and Likes on any Post with Facebook Login
5. Improved Skins

3.0 Features:

1. Show Facebook Albums (each album in a Tab)
2. Lazy Loading of images (first loads a Low definition pic and then loads a HD pic)
3. A new grey Skin for Famax
4. Ability to select any Tab on page load

2.0 Features:

1. Works on any device size (responsive + fluid)
2. Fancy layout (new grid + header)
3. Load more button for feeds
4. Improved lightbox popup for videos (responsive + fluid)
5. Optimized code overload (minified JS+CSS ~ 50KB)
6. Uses Facebook v2.2 API
7. A Tab for your Fan Page posts
8. Another tab for your Fan Page Tags (and what people are posting on your page)
9. Drop Down in place of tabs for Mobile mode
10. Customize anything with CSS (or send us an Email)


Grey Skin

Tags Page


Albums Page


White Skin

Load More

Mobile Mode

Multiple Images Posts


1. Include plugins

Upload the download package to your server at the appropriate path. Include the plugin as shown below

2. Create a container for your interface

Add a div as shown below in you HTML. This div will contain the Famax widget and display your channel feed.

3. Call the Famax plugin

You can directly use the Generator to generate the below jQuery call code

4. How to get create your Facebook App

1. Login to Facebook Developers website.
2. From the "My Apps" drop down click on "Add a New App"

3. Click on the Website option

4. Type in a name for your app and click on "Create ..."

5. Give it a category and click on "Create APP ID"

6. Type in the name of your website and click "Next"

7. Now Click on the "My Apps" tab on the top of the page. You should see your new app. Click on it.

8. Here you can find you App Id and App Secret

9. Fill in your Contact email in Settings page. Then Fill your App details on the App Details page as shown in the below screen. Also upload an App Icon on the same page.

10. Go to the Status and Review Tab on the left and toggle the button so that you app will be live and available to all users.

5. Submit you Facebook APP for review

Okay, so if you want users to add likes and comments via Famax, you need to perform this step. Otherwise you can skip this.

1. In the Settings page, make sure you have the correct website URL where Famax will be hosted

2. In your APP details page, you should have the below items -
a) Logo: 1024 x 1024 high-resolution image for your app
b) Long Description: Explanation of what your app does and why you need the functionality going through review
c) Privacy Policy: An accessible website URL that hosts your privacy policy

3. Go to the "Status and Review" Tab and click on Start Submission.

4. In the dialog box, select the "publish_actions" permission and click on "Add"

5. Fill out the Items in review page as shown in the below screens. Finally click on Submit for Review.

6. Some steps to protect your APP

Okay, so this is an optional step, where you can take some precautions so that no one can touch your APP settings.

1. Obfuscate the code having the call to Famax (in Step 2). Use the JS Obfuscator to obfuscate your code that has the App secret. Use the obfuscated code on your page. Using this step, the App Id and Secret will not be available to people looking at your site's source code.

2. In your Facebook App, go to the "Settings" page and click on the "Advanced" Tab. Here you can see the "Update Settings IP Whitelist" field. Add your IP address here.Using this step, only the specified IP address will be able to make changes to your App settings. This means if someone finds your App Secret and tries to update your App settings, he won't be able to do it.

Basically, the above steps will make the App Secret worthless for the attacker. All he can do is retrieve public data from Facebook, which is anyway public :)

That's it guys. Let me know what other improvements you would like in the next version!
Download is live!


  1. I like your plugin a lot, thanks. It would be nice if you could set a max-height on the actual posts container, so that you could put a y-scroll on only that and leave the page header and tabs in place.

    1. Yes sure, we have noted this down and we will try to add this in the next version which is coming soon :)

  2. Hi - Can I use your Facebook feed code for Weebly or Squarespace or does it have to be WordPress?

    1. If you can edit your HTML on Webly or Squarespace, then you can use the Javascript version of Famax. You can upload the scripts to Google Drive and use that link in the Step 1 Include Plugins section :)

  3. Hey Jake,

    I don't think people need to request publish_actions permissions anymore as per your instructions say. I installed Famax 4.0 on my site and submitted a review request to the Facebook team. The approval for publish_actions was denied as the plugin does not actually post comments / likes you make via Famax to the persons personal timeline, which I was informed is what the publish_actions permission is meant to allow. However, I can still comment and Like via Famax and the results show up on the FanPage. So it doesn't seem publish_actions is needed for the comment / like via Famax.

  4. is it possible to import FB images with black and white colors?

    1. No Sir, you can display all images on a Page or from a specific album in a FanPage on Facebook :)

  5. is this limited to only fan pages? or i can also use albums from my personal facebook account

    1. Yes, this is limited to FanPages. Facebook has removed support for displaying personal account photos etc. from their API.

  6. Can this be used to display a feed of reviews from Facebook?

  7. Please could you help me with the warning about the Notes for publish_actions? Thanks!

  8. nice, but one thing that is 1000% missing is the possibilitiy to show the Date and Time on the posts. If you have 2 collums it is from time to time confusing, what is new, what is old and so on. So please please add this feature to let somewhere show the date and time of the posts.

    1. Thank You Michael. I will add this in the next version upgrade :)

  9. This is brilliant!! I am considering to implement it on my website. Is it possible to 'build' a custom feed from a set of different pages?

    1. No, you can use our PhotoMax plugin where you can have multiple page feeds. But those feeds will be separated by Tabs in the plugin.

  10. I installed this plugin, works great but today when I load the page facebook plugin doesnt work and I get error messege Session expired. Please reload the page.

    1. It means your token is expired. Please generate a new Token using our Token generator

    2. Thanks for response..I managed to generate new token..add it to the page but it still not working..when i open the console i get error: jquery.famax.js:1048 Uncaught TypeError: Cannot read property 'length' of undefined

    3. Please share your web page link. There might be some settings issue. Or write to me at

    4. Hi Jake! I'm having the same issue. I installed this plugin a few weeks ago, works great but now doesnt work and I get message "undefined" instead of the Fanpage name and a broken image icon. Even when I download the package again.

      I have sent you an email. Thank you!

    5. I found a kind of solution... I have copied all the code from your demo page and after reconfigured my fan page I have hidden the "div class="control_holder"" tags with a property style "display:none". And done...

    6. Andrea, you just need to generate a new Token and use that :)

  11. I sent you an email with link to the page. Thank you!

    1. Already sent you the updated Token. You just need to update that :)