This is a sincere question.
Why do I ask?
Because I have been trying to insert FoxyCart as a shopping cart into an existing site's theme (if you will) and it has been and continues to be an incredibly frustrating and very complicated thing to do. I am getting there but let me tell you...it is a time consuming thing and something that must be done one little bitty step at a time. One must constantly test to make sure the responsive nature of the FoxyCart cart is not messed up. One change at a time. The smallest changes will break things if one is not extremely careful.
Now part of my experience so far (using 2.0) may be that I am not an expert in CSS and integration. I say that not because I am entirely inexperienced in CSS and otherwise but rather as an acknowledgement that perhaps, just maybe, I am not seeing something that might make integrating FoxyCart much easier than I have experienced it to be.
The documentation does make it sound like it is perfectly doable and indeed perhaps even an easy thing to do though my experience has been entirely otherwise.
So by all means if anyone knows of a way to do this from a general point of view...please feel free to help me understand how to do this better.
In the absence of such input let me if I may make some observations that might point to why it is proving to be an incredibly complicated thing to integrate FoxyCart into an existing theme (so that I can get input on these observations as well).
To start with FoxyCart attaches an ID to the HTML tag. The problem with that is that each page into which the cart is added inherits the properties of this ID. It isn't just the CART that inherits these CSS properties...it is the ENTIRE PAGE.
So something as seemingly innocuous as "#fc div" could affect every single DIV inside the entire page! Depending on the CSS specificity of course.
If I have a DIV inside the page them FoxyCart's #fc
div may affect that DIV. If FoxyCart's CSS has higher specificity than my own CSS for my own DIV...well...FoxyCart's CSS wins and my nicely rendered DIV is messed up.
It would have made more sense, from the standpoint of FoxyCart making it's cart more easily integrated into an existing site's theme, to use an ID on some DIV enclosing all of FoxyCart's code. An ID that would have appropriately applied to FoxyCart's own code leaving the rest of my page them alone. Where I could insert and/or take out FoxyCart's cart code entirely at will without the page rendering getting messed up in any way.
As it is it appears that I must do it all FoxyCart's way (on any page that I use the cart on) or else...well...there is no else I suppose short of looking for an easier to integrate cart - which I am not prepared to do for my client at this point in time.
Instead I have to backtrack to figure out how FoxyCart's CSS is affecting my page and why my page elements are being screwed up such that they don't appear correctly. In some cases the problem is that my ID's on some DIV's that come higher than FoxyCart's code affects the rendering of cart elements. So this problem works both ways.
But...it seems to me that it would have been MUCH EASIER to integrate FoxyCart IF it had not done things like attach an ID to the HTML tag of the page.
That's just one example which seems to indicate that FoxyCart was NOT made to be integrated easily into an existing site's look.
Trying to integrate it has been and continues to be (CSS wise) like trying to figure out which spaghetti noodle goes where. Not an easy thing to do any means - even with the help of Web Development tools found in browsers.
I override one FoxyCart CSS and something breaks on my own site CSS rendering. I change something in my own CSS and something breaks in FoxyCart. It is incredibly difficult at times to figure out which CSS code is breaking what.
Is there something I am missing in how to do such an integration?
Is there...like there was under 0.7.2 an unstyled version of the cart (CSS wise) that might be easier as a starting point for integration?