Magento 1.x Software Support Notice
For Magento Commerce 1, Magento is providing software support through June 2020. Depending on your Magento Commerce 1 version, software support may include both quality fixes and security patches. Please review our Magento Software Lifecycle Policy to see how your version of Magento Commerce 1 is supported.
Facebook Open Graph
The Facebook Open Graph 2.0 extension enables Facebook developers to add custom social networking buttons to your store. The Facebook Open Graph 2.0 extension is free of charge and can be downloaded from Magento Connect.
The extension uses the Facebook Open Graph 2.0 protocol. When the extension is successfully installed and all configuration is complete, the Facebook buttons appear on each product page in the store, along with the Facebook blocks that provide information about other Facebook users and friends who have clicked the social buttons. The information provided in the blocks depends on the customer who is logged in to Facebook and whether friends have performed actions with your app, such as clicked a social button.
|1.||Visit Magento Connect, and download the Facebook Open Graph 2.0 extension. Then, copy the Extension Key to the clipboard.|
|2.||On the Admin menu, select System > Magento Connect > Magento Connect Manager.|
|3.||When prompted, enter your Admin credentials, and click the Log In button.|
|4.||Paste the Extension Key, and click the Install button.|
The current implementation of the Facebook Open Graph 2.0 extension requires an application to be created manually on the Facebook Developers site.
|1.||Navigate to: https://developers.facebook.com/|
|2.||In the main menu, click Apps.|
|3.||Click Create New Application and perform all of the steps of the app creation wizard.|
The App Namespace value that you entered will be used in the Magento configuration.
|4.||In the left column, select Settings > Basic. Under the “Select how your app integrates with Facebook” heading, select Website. Then in the Site URL field, enter your store address.|
Important! Your website and store should have one domain name.
|a.||For Action Types in the Advanced settings in the Graph API URL field enter own, want or other action you want to be associated with a social networking button on your product pages. This title is for internal use.|
The dislike action is not supported by Facebook Open Graph 2.0, and cannot be saved.
|b.||The Object Type you create should have the following Object Properties:|
- URL (page URL)
- Title (product title)
- Image (image URL)
- Description (product description)
By default, a new Object Type has only the first four properties. To add the Price property, use the Add Another Property button on the Object Type page.
|1.||On the Admin menu, select System > Configuration.|
|2.||In the panel on the left, under Social, select Facebook.|
|3.||Set Current Configuration Scope to your website.|
|4.||In the Facebook Config section, do the following:|
|a.||To display Facebook buttons in the store, set Enable Facebook on Frontend to “Yes.”|
|b.||Enter the App Namespace value of your application. You can find it in the Basic Settings section of your app on the Facebook Developers site.|
|c.||Specify the App ID and App Secret values of your application. You can find them in the Basic Settings section of your app on the Facebook Developers site.|
|d.||Enter the Open Graph Type value of your Object Type. To find it on the Facebook Developers site, open the settings of your application, navigate to Open Graph > Dashboard, click your object type, and expand the Advanced settings.|
On the page header, the system will display the Apps > %Your Facebook Application Name% > Open Graph > Object Type: %Object name%.
|e.||To add and configure a button, click Add Action Button and complete the setup for each button. The action settings can be different for each store view.|
In the Action column, specify the internal button action title, for example, own or want. This value should correspond to the value you have specified in the Graph API URL field on the Facebook Developers site. The Graph API URL field is available in the Advanced section of the Action Type settings.
In the Button Title column, specify the name of the social networking button as you want it to appear in the frontend.
Enable Friend Box
In the Enable FriendBox column decide if you want to display in the frontend the related Facebook block, which contains the count and the pictures of friends.
Count Friend Box In the Count in FriendBox column, set the maximum number of friends that can be displayed in the related Facebook block. By default, it is set to 3. If you set zero value (0) or leave the field empty, then the default value is applied.
|5.||When complete, click Save Config button.|
The social network buttons you have created and the corresponding Facebook blocks now appear on the product pages of your store.