How do I style the cart?
Good question. It’s slightly tricky but once you get it it’ll make sense.
The issue is that the thickbox + cart is two separate pieces:
HTMLgenerated that’s part of your site’s
<body>, which is where the “close” and “x” links are.
iframeinside the modal window, which is an entirely separate
HTMLpage, and cannot be styled by the parent frame’s
So, if you want to customize the cart itself, you need to add your new
CSS to the cart template (as pasted in or cached in the FoxyCart admin). If you want to customize the “framing” of the modal window (Thickbox aka FoxyBox), then you do that on the
CSS on your own site, as it’s overriding the
foxybox.css file that you would (typically) include on your own site.
Also, the FoxyCart-provided
styles.css should be on the cart, checkout, and receipt, but does not need to be on your end, since it won’t really apply to anything.
Finally, if you want to override much of the CSS we recommend starting with the “text” not the “standard” theme, as it’s easier to work with. If you like the “standard” and just want to change some images or something, go for it, but if you’re going to do open heart CSSsurgery on it, just use the text theme.
More information on customizing
CSS and templates on FoxyCart is available on ourscreencasts, particularly #2 and #3.