Knowledgebase/Tips & Tricks

Understanding DPD Cart Styles - Javascript / Lightbox vs. Popup

Jason Chance
posted this on May 12, 2010 00:40

DPD has two distinct cart styles-  a traditional popup style cart that opens in a new window, and a javascript powered cart that opens in a spiffy lightbox right on your page.

 

Example 1: Javascript / Lightbox cart (default):

5-12-2010-12-27-01-AM-790f.png

 

Note how the cart loads within your website and integrates fully.

 

Example 2: Non-Lightbox, Popup style cart (fallback):

5-12-2010-12-30-33-AM-47a8.png

 

Note how this cart does not load in your page- it loads in a new window.   If you have uploaded a store logo, it will be displayed here instead of your store name.

 

How the carts work:

 

The DPD "view cart / checkout" button code provided includes a javascript reference which makes the javascript  cart shown in example 1 possible.  

In the event of a buyer who does not have javascript enabled, the DPD cart will automatically fall back to the non-javascript, popup style cart shown in example 2.

If you do not include a view cart / checkout button with the required javascript on every page of your site that has DPD add-to-cart buttons, the javascript style cart will not work and will fall back to the non-lightbox cart.

If you are using a custom design that doesn't include regular DPD checkout buttons, or for some reason you can not place the view cart / checkout button code on every page of your site that has an add-to-cart button, you should include this javascript reference in the header of your HTML template to ensure that the lightbox cart works correctly on your site:

 

<script src="http://getdpd.com/js/cart.js" type="text/javascript"></script>
 

Comments

User photo
Jami Scholl

Don't forget the ending </script>.  Be sure to place the code rught before the </head> tag.

It should be:

<script src="http://getdpd.com/js/cart.js" type="text/javascript"></script>
March 03, 2011 23:48.