Connect your shopping cart to Facebook

Web Cart Tutorials
Default Integration
Connect your cart to Facebook
Customize your cart's style and functionality

If you integrate Facebook's login on your website, your store's cart will be connected to the largest social network on the planet. If a customer leaves your store without purchasing the items in their cart, those items will remain in their cart for the consumer to complete their purchase across any Payvment powered shopping cart on Facebook such as Payvment's Facebook storefront solution.

Connecting Facebook's login with the shopping cart is not complicated. Just follow the steps below. If your website already uses Facebook Login, skip to Step Two of this tutorial.

Note: This tutorial requires your web server to be running PHP. If you are not sure if your web host is running PHP, contact your hosting company or system administrator.

Step One: Integrate Facebook's Login

Facebook makes it very easy for you to integrate Facebook Login into your website. Click here to go to Facebook's documentation. Facebook's docs will give you all the code you need to copy into your website to enable your visitors to login using their Facebook credentials. While integrating Facebook's login on your website, you will be given a Facebook API Key. You will need the Facebook API Key in the next step of this tutorial.

Step Two: Adding the Facebook-Enabled 'Cart Request' to your web page

Now that you have Facebook's login working on your website, let's connect the shopping cart to it. This is simple. Just add "&fbconnect=<?php echo $_REQUEST['FACEBOOKKEY_user']; ?>" to Payvment's Cart Request script after your Payvment API Key. Replace 'FACEBOOKKEY with the Facebook API Key you got in Step One. Your Cart Request script will look like the example below only with your own Payvment API Key and Facebook API Key added. More details on adding the Cart Request to your website can be found here.

<script src="https://api.payvment.com/cart/?apiKey=1234567&fbconnect=<?php echo $_REQUEST['10b92fd8a94ddb5778cd5f86e88b3_user']; ?>" type="text/javascript"></script>

Step Three: Modify Facebook's Javascript

Now in this final step we need to make one small change to the code Facebook gave you to integrate Facebook Connect on your website. Below is the Facebook code you should look for in your webpage and the code to replace it with.

Find this Facebook code on your page:

FB.init("YOUR_FACEBOOK_KEY","http://YOURWEBSITE.com/xd_receiver.htm");

Replace it with this:

FB.init("YOUR_FACEBOOK_KEY","http://YOURWEBSITE.com/xd_receiver.htm",{"reloadIfSessionStateChanged":true});

Your store's shopping cart is now connected to every Payvment powered shopping cart on Facebook increasing your ability to complete more sales.

Next: Customize your cart's style and functionality