Using Custom Button Graphics for DPD Classic Add-to-Cart, Buy Now, and Checkout buttons

DPD buttons are plain HTML for maximum compatibility with every web page.

***This tutorial only works with the Classic Button options


DPD buttons are comprised of the following parts:

All buttons contain the link to the DPD action, which is the <a> tag

All buttons contain the image tag which loads the button images, which is the <img> tag

View Cart / Checkout buttons also contain a javascript reference that makes the lightbox cart work on your site


An example of a DPD add to cart button:


<a href="" class="dpdcart iframe"><img alt="Add to Cart" src="" border="0"></a>


to change the image used in a button, you simply need to change the <img> tag's src value to your own button graphic's location on your own website. 


For example, if my button is located at "" the same button code above would look like:


<a href="" class="dpdcart iframe"><img alt="Add to Cart" src="" border="0"></a>


That's all there is to it!


It is important that you never change the contents of the <a> tag (the link) or change the javascript reference included after view cart / checkout buttons- these are the required part of the button that makes DPD work!

Have more questions? Submit a request


  • Avatar
    Mark Wilkie

    I have some custom images in the DPD checkout process and they seem to trigger an exclamation mark in the tab at the top of the page instead of a closed lock. If you click on this it says - Your connection to this site is not fully secure.

    I have to assume it is images on our checkout page which are pulled from our own server. E.g background, secure ordering credit card image.

    Possible translation... abandoned shopping cart due to a sense of unsecured order page?

Powered by Zendesk