Home / Facebook Connect Magento Module - Documentation

Version 1.3.0

Release Date: Oct 23rd, 2009

List Price:
$149.95 USD

New product special:
$99.95 USD

PayPal:


Documentation

Overview


1. Upload or Copy the module 2. Copy Module Activation XML file to app/etc/modules/ 3. Copy template files to your design folder 4. Copy layout file to your design folder 5. Copy translation file to app/local/xx_YY 6. Refresh your cache 7. Add Facebook App API Key and Secret Your Magento installation directory will be called {MageHome} *Note: This module requires you to have a facebook.com account and a functioning application on facebook.com. You can create an application from facebook.com by clicking the link "developers" at the bottom of your home page. From there, you should see a green button that says "Start Now". See Also: http://www.facebook.com/developers/ (set up new application button)

1. Upload or Copy the module


The first step is to copy the contents of this zip file into your Magento installation. The folder "Metrof" should be directly under "app/code/local". The resulting folder structure should look like this {MageHome} `--app `--code |--core |--community `--local `--Metrof `--FBConnect

2. Copy Module Activation XML file to app/etc/modules/


The file "Metrof_FBConnect.xml" located in this folder needs to be copied to: {MageHome}/app/etc/modules/

3. Copy template files to your design folder


The directory "fbconnect" in "design/frontend.templates/" and all files under it need to be installed in {MageHome}/app/design/frontend/default/default/templates or whichever directory your theme is installed in. The resulting folder structure should look like this: app/design/frontend/default/ . `-- default |-- layout |-- locale `-- template `--fbconnect `--customer_form_login.phtml If you have a custom design, and you do not want to use anything that looks like the default login page, you can simply copy some lines of PHP code into your design wherever you want the Facebook login button to appear. The PHP code is between the lines of hashes (######) #################################### <?php if ($this->getData('use_fbconnect')) { ?> <p>Use your Facebook account for super-fast logins.<br/> <a href="<?php echo $this->helper('fbconnect')->getLoginUrl();?>" > <img id="fb_login_image" src="http://static.ak.fbcdn.net/images/fbconnect/login-buttons/connect_light_medium_long.gif" alt="Connect"/> </a></p> <php } ?> #################################### You can also substitue your own graphic, or change the color and size of the Facebook button by changing the words "medium", "long", and "light". See: http://wiki.developers.facebook.com/index.php/Fb:login-button * [Specify small, medium, or large. (Default value is large.)] * [Specify white, dark, or light. (Default value is light.)] * [Specify short for the text label Connect only or long for the text label Connect with Facebook. (Default value is short.)]

4. Copy layout file to your design folder


The file "metrof_fbc.xml" in "design/frontend.layout/" needs to be copied to {MageHome}/app/design/frontend/default/default/layout/ or whichever directory your theme is installed in. The resulting folder structure should look like this: app/design/frontend/default/ . `-- default |-- layout | |-- ... other xml files | |--metrof_fbc.xml | `-- ... other xml files |-- locale `-- template

5. Copy translation file to app/local/xx_YY


Assuming your chosen locale is "en_US" (for English in the U.S.) copy the file "Metrof_FBConnect.csv" from "locale/en_US/" into {MageHome}/app/locale/en_US. Change "en_US" to whatever language your store runs under. If no such file exists for your language, copy the file from the "en_US" folder into the folder of your chosen locale. You can then translate the items in the CSV file into your own language. You can also customize the welcome message for your store by editing this file.

6. Refresh your cache


Login to the admin page for Magento and choose "Cache Mamangement" from the "System" menu. Choose "refresh" from the drop down menu and submit the form.

7. Add Facebook App API Key and Secret


You may need to logout of the admin and then log back in before you can complete this next step. Choose "Configuration" under the "System" menu. You should now see a tab called "Facebook" and a link under it called "FBConnect". Under the "Facebook Application Settings", paste your API Key value and Application Secret value into the appropriate boxes and click "Save Config". You can obtain these values from Facebook.

Sign-up with your e-mail to get news about this and future products.