This is an old revision of the document!


Change Button Colors on Sidecart, Cart, and Checkout (v2.0)

​To customize the colors of the sidecart, cart, and checkout button colors:

  1. Go to this page and copy the CSS you see there to your computer's clipboard.
  2. Go to your Templates configuration in your FoxyCart admin.
  3. Scroll down until you see “custom header: ” under “Add custom header and footer code to your templates” (this may need to be checked to get the “custom header:” input box to appear). You may see some code already in the text area. You can paste the code that you copied to your clipboard in Step 1 into the top of that box (take care not to remove anything that's already there).
  4. Change the existing colors in the styles to be the desired color. In the example code, the two colors in use are #FFFFFF (white) and #ec6725 (orange). Here's a hex color picker in case you need one to select a new color.
  5. Scroll down until you see the “Update” button and click to save.
  6. Take a look at the cart and checkout to ensure that it looks as expected. Hover over the buttons to see if there are any adjustments you'd like to make to those styles.

Site Tools