Using Dreamweaver to edit a Zen-Cart

[Feznizzle]

Hi!

I have a ZC139c and have installed a tinyMCE.

The main reason I switched editors was so I could use the HTML button to insert code. Hindsight being what it is, I could have just used the Plain Text editor.

I have found several encouraging threads about using Dreamweaver, but I'm wondering if there are some very basic tutorials on how to configure dreamweaver (dw8) to edit a ZC?

As it stands, I almost ALWAYS turn to DW when I need to insert tables. I do this very often to create tables to list out product attributes, etc, in a legible manner for customers. (Tables seem very very buggy to manage in ZC!)

I'm looking for one of two possible solutions... simple or complete.

SIMPLE SOLUTION:
Directions on how to gather all the needed ZC css files and then load them into a DW project folder to be used when editing/creating products. I would edit to satisfaction, then copy the code and past it into HTML online.

COMPLETE SOLUTION:
I know that you can set up "test" servers to create a pretty realistic environment in DW. Is that the route I should be going? Or, better yet, I know you can edit live... is that the better way?

++++
I realize that DW is outside the scope of ZC, but I am hoping that some in the community use it and can offer some advice. Personal experience, links, whatever would be super helpful!

Thanks,
Mike

[schoolboy]

While it is "technically" possible to work zencart within Dreamweaver, it requires that you have a very clear knowledge and understanding of the PHP structure of ZC.

If you are using DW to "create" snippets of a HTML portion (such as the product description text), this is also OK, as long as you bear in mind the functionality, purpose and limitations of inline style application.

DW probably creates an independent stylesheet when it compiles (in its old-fashioned way), a flat html site.

But you are not dealing with flat html in zencart (or any other dynamic content system).

If DW is creating styles in DIVS for you, then the external stylsheet generated by DW needs to be applied to your zencart stylesheet... and there are some important considerations here... For starters, if there are similar style ID's and CLASSES in the DW stylesheet to those in the ZC stylesheet, one set of those will be (at some point) rendered NULL, by the fact that css is applied sequentially and chronologically.

Unless you have an "above average" knowledge of how css operates, and how you can "import" styles from DW into the zc framework, your best option is to create UNFORMATTED html, and then apply style ID's and CLASSES manually.

[Feznizzle]

Thanks for replying to this thread as well, Schoolboy. Notice that they dovetail?

Can I create a DW Project Folder (name it ZC Products) and then import CSS files from the site? In theory, this would make ZC css style id's popup in DW's style and format menus?

If I then apply styles using the menus, would that accomplish what you mean when you say "apply style ID's and CLASSES manually"?

[schoolboy]

I stopped using DW several years ago, so I cannot comment of how it will function today with ZC. I now find that I can actually work faster and more efficiently by working with raw, self-written html (in Emerald Editor), but that's probably because I know a little bit about the way ZC is structured.

Study the ZC stylesheet... and it's useful to view your zc site in Firefox using the Firebug plugin to do analysis on the page's structure. This will give you a very graphic and rapid idea of what css is being applied on any given page, and you will soon establish what CLASSES and ID's drive certain elements, and whether these can ALSO be used in any customized html that you later insert.

If DW can "use" the ZC stylesheet(s) as a basis for page formatting, then go ahead and try it.

As I said... its a long time since I used WYSIWYG editors, so I am unaware of how they operate these days!

[Feznizzle]

Man I wish I could do that! I bet you can see ones and zeros like Neo at the end of the first Matrix, lol.

I have programmer friends who can do that, but sadly I am nowhere near as smart as you guys! I need my visual cues, need my GUI!

I love my Firefox developer tools! Pretty much everything I know about css (a hill of beans) comes from using it this month to figure out what was going on with my ZC template. Unbelievably cool stuff, CSS (and ff tools)!

[Feznizzle]

Ok, I was able to put together a fast and dirty little method for using DW8 to do basic editing for the ZC pages (product, EZpages, etc).

Figured I'd post my solution in case somebody else comes wandering down this path.

First, go grab your css file off your server:
/includes/templates/YOU-TEMPLATE/css/stylesheet.css

Drop that file into a folder (I called mine "DW Zen-Cart Files").

Now open DW and:
1. Open DW's Preferences panel, view "General.
2. Uncheck the box that reads "Use CSS instead of HTML tags"
3. Restart DW if you had to change that option.

When DW opens again, create a new "Site". Nothing fancy, no need for ftp, etc. Choose the file you created above ("DW Zen-Cart Files") to use for your site.

Now you are ready to work:
1. Open a NEW HTML file.
2. Once open, click on the STYLE dropdown menu (mine is at bottom of screen, to the left of the "BOLD" button).
3. Choose "Attach Stylesheet...".
4. Browse to find and attach your "stylesheet.css".

Now you can use the file to build a product file (or whatever) and have it look more or less how it will on the site.

When you are satisfied with how it looks, high light the code you want and copy/paste it to the site!

[Feznizzle]

I will be using this alot, will post further tricks I come across into this thread. If anybody else knows of some cool DW stuff you can do to ZC, please post!

[schoolboy]

high light the code you want and copy/paste it to the site!

Bear in mind that you must never include any code that is OUTSIDE of the <body> and </body> tags.

ZC creates all its own headers and footers, and including any of this will cause problems.

[Feznizzle]

Good point, I forgot to say that.

Your point, by the way, is the logic behind disabling DW's "Use CSS instead of HTML tags". If you leave that on and then change the color of a headline (H1), DW will then style as if using CSS and put your color in the header (above the body) and you can't bring it with. I would never have figured that out if you had not said:

DW probably creates an independent stylesheet when it compiles (in its old-fashioned way), a flat html site.

But if you disable that, then DW will use plain ole html tags in the body... which you can copy and paste.

BTW, that has bothered me for years! Thanks, Schoolboy!

The super cool thing? While testing it, I was able to override color choices of Headline styles! I have never been able to do that using HTMLarea or tinyMCE!

[DrByte]

Another VERY IMPORTANT thing to remember when using DW ... is to NEVER use the "check out" and "check in" functions, because those put extra files on the server (".LCK" files) that can cause problems if they get auto-loaded and treated as PHP (since they're not PHP).