Editing CSS with Firefox Web Developer Tool Kit

[Brent]

I'm trying to use the Web Developer Tool kit to edit my CSS but have a problem I can't solve. I think the solution must be obvious as nobody else has posted this question so I've prepared myself for embarrassment.

Whenever I click "edit css" and the style sheet loads all images in /includes/templates/your_template/images/ are stripped out. Happens with all Zen Carts not just mine.

If I then try and view the header image for example I get:

You don't have permission to access /images/header_bg.jpg on this server.

Additionally, a 404 Not Found error was encountered while trying to use an ErrorDocument to handle the request.

As this used to work I'd love to know what I have managed to break.

Regards

Brent

[Brent]

This still has me stumped and I've gone through all the config options.

What is also strange is that it strips out jpegs but not gifs. For example logo.gif loads but header_bg.jpg and tile_back.jpg don't. Also it only affects template items and stock images are untouched.

Any pointers would be greatly appreciated as I'm trying to upgrade from 1.2.7 to 1.3.5 and I'm lost without this tool.

[kuroi]

Hi Brent

You've misdiagnosed this slightly. It's nothing to do with the image file type - it's how it's linked into your site. And it's not somehting that you've done

Your logo.gif is displayed because it is a image in the page's HTML. It's pulled down, renamed and placed in your browser cache in a way that Web Developer understands.

Your header.jpg is a background reference referenced by your CSS with a path name. Web Developer goes looking for a image on that path, but unfortunately it's a relative path and Web Developer doesn't know the structure of your site and can only apply relative links relative to the page and not the original location of the file providing the relative link.

This has been taxing the brain of Web Developer's Author, Chris Pederick, for at least two years and I am not aware of an end in sight (no pun intended ). However, you can work around this if you want by creating a directory called images at the same level as your site's root directory and putting copies of your background images in there.

[Brent]

Hi Kuroi,

I was hoping you would be along as I knew you would have the answer. Your posts in this forum have helped me out on numerous occasions.

I've never used your template but I have installed and played around with it and producing a product that was "broken" was a stroke of genius. I'd seen some of your other work so knew there was no way it was meant to look like it did and my curiosity got the better of me and I started digging. I'm now well on my way to getting my head around how CSS works.

Back to my current problem I also realise why I thought the Tool Kit had "worked" in the past. When I was designing my stores this was all new to me and as I didn't understand CSS I had hard coded my images in the stylesheet.

Thanks again!

Brent

[kuroi]

You're welcome Brent.

In respect of future Zen, I prefer to think of it as "unfinished" or "unpolished" rather than "broken" . I confess to having been absolutely astounded by the number of people who took it on board and used it a basis to develop their sites , but I'm hugely relieved that we didn't end up with a few thousand future Zen clones, and that instead Zen Cart users have and continue to add their own highly original touches .