In this tutorial you will find detailed instruction on how to install and configure "Facebook Products Tab" Magento extension. Using this extension you can show featured Magento products directly in your Facebook page.

Key features of "Facebook Products Tab" Magento extension:

  • Show your Magento products in Facebook for free;
  • No monthly fees;
  • 100% open source code;
  • Your own Facebook application and you are the only application owner and administrator;
  • 100% customizable design based on Magento template engine.

1. Magento Configuration

After installation of the Facebook Products Tab Magento module via Magento Connect, you will need to choose what products to show in your Facebook page.

Open any product in your Magento administration back-end and switch "In Facebook" product attribute to "Yes".

 

2. Facebook Application Creation

After this you will need to setup your own Facebook application for your Magento store.

Log in to your Facebook account, visit this link www.facebook.com/developers and click "+ Create New App" button.

Enter "App Display Name" (any name you want e.g. "My Shop") and "App Namespace" (any available value), example:

 

 

Click "Continue", your changes will be saved, you will see this message:

  • Changes saved. Note that your changes may take several minutes to propagate to all servers.

On the new page enter basic information:

 

 

Basic info:

  • App Display Name: Make this the same as the original value you entered;
  • App Namespace: Make this the same as the original value you entered;
  • Contact Email: Enter your email address;
  • App Domain: Leave it empty;
  • Category: Select a category from the drop-down list.

Next, select "Page Tab" integration type and enter all needed details, example:

 

 

Page Tab values:

  • Page Tab Name: The displayed name of the tab;
  • Page Tab URL: The unsecure URL (HTTP) of your tab page;
  • Secure Page Tab URL: Same as the "Page Tab URL" but with HTTPS protocol;
  • Page Tab Edit URL: Enter "Page Tab URL" there;
  • Page for the Facebook tab: Enter "Page Tab URL" there.

Next, notice the "edit icon" below the App Secret and App ID. This is the icon that will appear to the left of your tab's name in your Facebook page navigation. The dimension of the icon is 16 x 16 pixels.

 

 

3. Add your Magento Application to Facebook Page Tab.

To complete this step you need to copy App ID value (from previous screenshot) and enter it to this URL:

https://www.facebook.com/dialog/pagetab?app_id=308041111111111&redirect_uri=http://www.facebook.com/

Open this URL (with your own App_ID instead of 308041111111111) in your browser, you will see this page:

 

 

Click "Add Page Tab" and go to your Facebook page. You will see your new Magento store in the tab: