Magento Facebook App : Document/Tutorial

The Magento Facebook app theme is a premium Magneto template for the Magento Facebook App that integrates social shopping via Facebook.The theme enables the Magento store owners to efficiently integrate Facebook to their store, thus allowing the customers to shop completely from the Facebook store.

Step 1. Download and install the plugin
——————————————————————————————————————————–

If you haven’t purchased Magento Facebook app then follow the link to purchase it http://www.apptha.com/category/extension/Magento/Magento-Facebook-App

Magento Facebook App

IMG 1.1 : My account area

If you had already purchased the extension from www.apptha.com please sign in to your account and download the product from My Account -> My downloadable products -> Download

Installation Procedure

For Magento 1.4 ,

- Extract / Unzip the file magento-facebookapp.zip
- You will see the following folders “app”, “fbapp” , “lib” and “skin”
- Upload these folders to the root of your Magento installation
- Signout and relogin to the Magento admin

Installation ProcedureIMG 1.2 : Uploading the files through FTP client

For Magento 1.5 ,

Login to Your Magento Admin Panel, go to System–> Magento Connector–> Connect Manager and Upload the package.

Magento Connector
IMG 1.3:

Step 2. Configuring Magento Facebook app
——————————————————————————————————————————–

Magento Facebook app
IMG 2.1 : System -> Configuration
Log on to http://developers.facebook.com/apps to generate app id and secret key.  Click Create New App button at the top right on Facebook developer page.  Give the name for your app / store, when you click save it will take you to the next page where you have to provide the site address and provide canvas url

Magento Facebook Configuration
IMG 2.2 : Creating Facebook app id and secret key

Creating Facebook App
IMG 2.3 : Provide the site url and canvas url

Facebook Test Store

IMG 2.4 : Facebook app id, secret key generated

Facebook App ID

IMG 2.5 : If you have purchased the extension, apply the license key generated, provide the banner option, upload banner images, enable popular product option to display the most popular products below the banner image,  Enter the facebook id, secret key, canvas url and save it.
Magento Admin Panel

Step 3. Create multiple website for Facebook store view
——————————————————————————————————————————–

 Facebook Store View
IMG 3.1 : System -> Manage Stores -> Create website

Create websiteIMG 3.2 : Creating store for Facebook

Creating store for FacebookIMG 2.3 : Creating store view
Step 4. Final Steps
——————————————————————————————————————————–

Creating Store View IMG 4.1 : Providing base url for Facebook app store

Facebook App StoreIMG 4.2 : Selecting theme for Facebook store view

By this you will be able to successfully installed and configured your store for Facebook app.  After this you need to enable your products to be viewed in Facebook app.  Simply go to Catalog -> Manage Products -> Websites (Product Information) and enable Facebook for each products

Facebook Store View 2

Please note: You should apply the license key to get rid of the text ” Invalid License Key- Buy Now” in the home Page.

If you are not comfortable in doing these steps, you can contact us for free installation..

Adding footer links

If you want to show Footerlinks as seen in the output screenshot, Follow below steps:

Go to CMS –> Static Block –> Add New Block and enter the below given details and save.

Title: Facebook Footerlinks
Indentifer: Facebook_Footerlinks
content:

<ul>
<li class=”heading”>About Us</li>
<li><a href=”#”>Customer Service</a></li>
<li><a href=”#”>About Us</a></li>
<li><a href=”#”>Privacy Policy</a></li>
</ul>
<ul>
<li class=”heading”>Links</li>
<li><a href=”#”>Site Map</a></li>
<li><a href=”#”>Search Terms</a></li>
<li><a href=”#”>Advanced Search</a></li>
</ul>
<ul>
<li class=”heading”>Why Buy from Us</li>
<li><a href=”#”>Secure Shopping</a></li>
<li><a href=”#”>International Shipping</a></li>
<li><a href=”#”>Affiliates</a></li>
</ul>
<ul>
<li class=”heading”>My Account</li>
<li><a href=”#”>My Account</a></li>
<li><a href=”#”>My Wishlist</a></li>
<li><a href=”#”>Help</a></li>
</ul>

Step 5. Output

——————————————————————————————————————————–

Magento Facebook App

Related posts

Leave a Reply

Your email address will not be published. Required fields are marked *

*


*

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code lang=""> <del datetime=""> <em> <i> <q cite=""> <strike> <strong> <pre lang="" extra="">