How can I add the "Share Your Purchase - Facebook" function to my store?
Posted by Henry Suarez
Beginning with 3dcart's version 5.1.1; if your store is integrated with 3dcart's Facebook Connect add-on, you can also utilize a new "Share Your Purchase" function on your store.
This function will create a simple ajax pop up window that will encourage your shoppers to share news of their purchase with both their Facebook friends and Twitter followers upon completion of a purchase. This presents yet another way in which you can use Social Media channels to drive business to your store!
Note: As mentioned, you will need to have 3dcart's Facebook Connect add-on installed in order to use the "Share your Purchase" feature. If you do not currently have 3dcart's Facebook Connect add-on, please click here for details on ordering it.
Adding the "Share Your Purchase" Script to your Checkout Page
The first step in the process will be to retrieve the necessary coding that is required for the "Share Your Purchase" feature. To begin, log into your 3dcart Online Store Manager.
Along with your Facebook App ID and Secret keys, you will see a series of text variables that will be used for your "Share your Purchase" options.
Tip: You may edit these messages however you see fit, but please keep in mind that there are certain character limitations that come into play with Social media postings. (i.e. Twitter has a well-known 140 character limit)
Also, please note that only the following 3 dynamic product variables work within the message text:
Below the "Share Message" areas, you will then see two specific scripts that will be used for the "Share Your Purchase" feature. Each of these scripts will behave on your store differently, so select one (CTRL-A) and copy it (CTRL-C) to your computer's clipboard.
The two options are:
Additional Information: The "Share Your Purchase" modal window is based on the simplemodal jQuery plugin. As such, you can edit its display placement options relatively freely. For more information on this, please review the simplemodal settings by clicking here.
You can also edit the template used by the modal to customize the look and feel of the actual pop up window. The template used for this feature is located via FTP at "web/assets/templates/common/shareyourpurchase.html"
(Please note that 3dcart support will not be able to assist in the customization or designing of the modal window or its template)
Activating "Share Your Purchase"
Once you've selected and copied the script that you'd like to use, you will now need to place it onto your store's Checkout 4 template. To do this, please use the following steps.
From your Online Store Manager:
How It Will Look
Once you are complete with the above steps, your shoppers will then see the following upon a successful purchase on your store: