Understanding DPD Cart Styles - Javascript / Lightbox vs. Popup

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):

 

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

 

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

 

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>

 

Custom Cart Title:

By default, the cart popup close bar is blank.   You can set a custom title to be displayed for any button by adding the title attribute to any link.

Have more questions? Submit a request

Comments

  • Avatar
    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](http://getdpd.com/js/cart.js)" type="text/javascript"></script>
    
  • Avatar
    Maria Mar

    Jami, I'm trying to ascertain if I can use the same code for the view cart in all pages, for all products, or if the code for each view cart is specific for each product. Thanks. MM

  • Avatar
    Alycia Kluegl

    Is there a way to add a continue shopping button inside the lightbox(close the lightbox)? I know there is a [ x ] and you can also click outside the lightbox.

  • Avatar
    Jason Chance

    The view cart code is store specific, so it is the same for every product in your store.

    If  you have more than 1 store in DPD then you need to make sure you have the correct store's view cart code on the pages that contain that store's products, but other than that it should be the same for all products in the store.

  • Avatar
    Robert Dingley

    If I add additional stores to separate (classify) products and insert store specific "view cart" code, is this then combined into 1 checkout process for the customer?

  • Avatar
    Yuval Spector

    I'm not using any custom design but I still can't see access to the cart from the product page and the Paypal checkout looks bad (as if no CSS is applied). Tried to add the line above but the problem is still the same. Any suggestions? Am I doing something wrong? 

  • Avatar
    W. Clauss

    How can i add the language to the "view cart" or "add to cart" button/link?

Powered by Zendesk