Help! Can’t see Design view of theme in Dreamweaver

I have the answer! (warning, shameless plug for ‘commercial’ yet cheap solution 😉 But first the problem at hand…

Dreamweaver is really designed to create HTML and has a feature called Live Data (soon to become Live View in Dreamweaver CS4) to view dynamic content from ‘dynamic scripted pages’, i.e. PHP. Unfortunately, this is too primitive to render WordPress code as DW assumes that one dynamic page = one scripted page. WordPress’s code (and any Content Management System for that matter) is really too intricate for DW to decode.

Enter ThemeDreamer.

http://www.themedreamer.com/demos

It will do exactly what you are looking for and can unlock the potential in Dreamweaver’s Design View (which is really just another proprietary browser with its own nuances). I’m with you in that Design View feels like a natural way to go, because you can split the screen and see code/design view. Click in the Design View window and DW takes you to the relevant block of code. ThemeDreamer doesn’t make it super easy for newbies, but it is promising. You should really look at the Theme writing tutorials/documentation here and on the web.

As regular DreamWeaver user (v. 8.1), I can tell you that the visual editor is not always WYSIWYG. I know how to code these days, so I’m not very frustrated by this — I habitually open my pages in actual browsers after every change.

But I can see why you are frustrated… try Steveorevo’s suggestion (haven’t tried it myself), but also bear in mind that working with DW as a design tool is not like working in Illustrator, Photoshop or Quark… it’s an approximation, and the fact is that you have to test in all the major browsers anyway, because they all render slightly differently (especially #$Q%$% IE6!) Be glad you weren’t designing in the earlier pre-standard days!

I love DW for it’s other features — nice CSS editor, updating of link changes, etc., but the fact is that many web designers just use a favorite text editor and preview in the actual browser. It’s a good idea to understand that DW is not a reliable preview, but only a “ballpark” preview.

Oh, re-reading the OP, I’d like to add one more comment about using DW to edit WordPress themes — I just realized you are looking at PHP files.

The easier way to do this is simply view the (live) page in your browser, view the source, and copy the entire HTML of the source into Dreamweaver and save it as an html test page (e.g. mytestpage.html) in the root of your local copy of the site. (You will probably need to change the paths referring to your style.css file, etc. — usually can be accomplished with a simple search & replace, removing the URL portion of the absolute path so that you have a relative path instead.).

That way, you have a static html copy of what WordPress’s php is generating. You can now play with the CSS and see what effects it is going to have on the page. If you are planning to change the HTML, you can change it in the test page until you are satisfied, and then edit the actual php of the header/sidebar/content files to generate the new code in the live site.

Hope that makes sense — to summarize: have WP generate the HTML page, save it as a static page, style the CSS in your editor (and possibly edit the HTML), and then make appropriate changes to the php files of your theme, if necessary.