Our latest version of the Shopping Cart comes with it's own configuration tab, and the setup in this area is essential to have in place before you begin selling online.
PLEASE NOTE: At present, our Canadian clients cannot use this version of the cart and will need to use the previous version, so those clients will not see this tab. The functions described here will instead be configured in your Canadian PayPal account. We hope in the future to have a shopping cart that can handle these operations for our Canadian clients internally, but we do not have an estimate on when we might complete development of that functionality.
You can get to this part of the system by clicking on the Gear-Shaped Button on the far right side of the blue Admin Toolbar and then clicking on Settings > Website > Shopping Cart. Please note that if you do not see that tab, you can call our Support team at 877-909-6699, option 2, and we can look into getting that activated for you.
Shopping Cart Settings
To configure your Shopping Cart, go to the gear-shaped button on the far right side of our blue Admin Toolbar, click it then click Settings > Shopping Cart. See the note above if that tab is not visible for you.
Here are your options for the configuration of your Shopping Cart:
- Order Notifications Email - Enter the email address you wish for the system to send email notifications of the web orders that go through your shopping cart. If you leave this blank, no notifications will be sent.
Checkout Header Options - Numbers 2 through 5 below are your Checkout Header Options. This governs what the header in the shopping cart will look like once you leave the site and enter the full checkout process. Note that you can have only ONE of these options active at a time.
- Store Name Only - This will be ON for you by default. The Company Name will appear in your default Headings font just as it is entered in the Company Name field on the Settings > General Settings tab.
- Custom Store Logo and Background - This option will allow you to upload a logo image file (JPEG or PNG) and set the color of the background of the header area. For your color preference, if you don't choose anything, the color will be white. To enter a color value, you'll need to find the hex code value for your color (one good resource for finding color values is ColorPicker.com, a free online app, see image below). The hex code in the Background Color field needs to look something like this: #FH7E39. So it needs to start with the pound-sign / hashtag and then there are six alphanumeric characters. To upload your image, either click on the box for the upload or drag and drop the file into the box, and your image will upload and show you a preview.
Here is ColorPicker.com. Right now, a very light gray is selected (see the circle on the left; that is the actual color being picked). You can get RGB or HSB values on the right, you can pick the part of the spectrum you want with the vertical slider, and you can click and drag the little circle to the exact shade you want:
Using this option, the header of your Checkout screen could look something like this (example is white background plus the logo file):
- Custom HTML - The final option for the configuration of your header is to put in your own HTML. That may sound intimidating, but it's actually not so bad. You can go to your website and add a Content module, compose the content you want just like you were going to add it to a page, then open the Source Code (see image below for the Source Code button) highlight and copy all of the code you see, then paste it into the Custom HTML field.
Here is what the interface that loads when you click to Configure this setting:
And here is how it will show up in the Checkout interface:
- Terms and Conditions - If you aren't yet offering a Terms and Conditions page (or even if you are), this feature is an excellent way to legally cover yourself for your web orders. The way this function works, if it is set to ON, the customer will be required to confirm that they agree to your Terms and Conditions statement. They are offered a link to view it, but can click to proceed without doing so. If you click on the Edit button, you'll see a blank version of the following:
If you don't have a statement like this, a business attorney could work one up for you, or you could emulate one you find from an online retailer that offers similar goods and services to yours. There are also free templates available online, just do a Google search for 'online store terms and conditions.'
- Cart Background Color - If you want to, you can specify the background color for the main Shopping Cart page. This is the page you go to when you click Proceed to Checkout from the smaller shopping cart window on the right, and this is the page where the order is summarized and you can go to Secure Checkout, if you're ready. So the color you put in here needs to use the hex code format as mentioned above, but in this field, you don't need the pound-sign / hashtag, so just the six alphanumeric characters. For example, in the test site, I changed this to 5F9EB3, a shade of slate blue, and this is what it looked like on the Shopping Cart page:
Once you have made your configuration preferences, click the Save button at the bottom to set them in the system.
The Shopping Cart Process
If you've never seen how the shopping process works, once everything is set up, you can do a test order to see how it all moves along. Basically, as your customers add items to their carts, the items will display in a small, transparent window in the upper right:
When you click Proceed to Checkout, you'll go to the Shopping Cart page of the site, where you'll see a summary of the order, and you can either go into the Secure Checkout area, or if you've had us activate it, the customer can do PayPal checkout, or you can click to Continue Shopping:
Once you click to proceed, you'll go to the secure checkout page, and enter your initial Shipping info, as pictured below. And from there you'll put in payment info, etc., here is the secure checkout screen: