I’m designing my first EE site, a medium-sized site to replace an older custom-written website for a digital/print magazine. I have the site frame and the menus done, and I’m ready tackle the content areas.

As I’ve started the work with the content I’ve quickly found out that creating/editing the framework for the content (to plug in dynamic EE fields as well as ads delivered by OpenX) in EE gets quickly rather tediouis. My normal method for creating hand-coded sites has long been to use a good editor with language highlighting, intellisense, etc. directly wired to the development server. Hit save, refresh the browser and see the changes.

On EE side this process is much slower. Scroll down to locate the piece of code I’m currently working on, make changes, hit update refresh in another screen.. repeat. Surely there has to be a better way!

So my question is, what is your workflow when working on the site CSS framework to be used in EE? Do you generally create it within EE, or do you use external tools – whatever your tools may be (Dreamweaver, text editor..) – to create the design, and then just cut-and-paste it into an EE template?

Any time-saving tips would be very welcome!

Thanks!!

Time spent reading the docs is time well spent…

Saving Templates to Text Files

Indeed… that [document] alone seems to revolutionize how I use EE! I think I’ll lay down the pen (or rather the keyboard) for a few days for an in-depth EE documentation review. It’ll pay back in the end.

Thanks!

iain - 26 November 2008 11:47 AM

Time spent reading the docs is time well spent…

Saving Templates to Text Files

The very first screencast for Ryan’s Engine City screencast makes it apparent how easy it is to work with CSS especially as a text file. Hanging around here and you maybe think it’s only for Textmate or Dreamweaver that it make sense. I’m going to try PSPad Pro a freebie, that I just noticed the latest versions have an FTP client built-in.

I’m curious how many here are strictly hand coders who could type probably over a hundred tags a minute, just like regular typers type WPM (words per minute) 

Hey T.Gee
Have you had any luck integrating custom tags {you know the exp weblog etc.} {/into PSPad}?

I’ve taken a look at that, the program works from XML sheets to do auto-complete features, from what I can tell. Sounds like there might be some possibilities. Looking at the sample XML sheet, I couldn’t quite figure out how it worked. I’ll post a link to a sample XML doc if I can find one.

™T.Gee. - 26 November 2008 04:15 PM

I’m curious how many here are strictly hand coders who could type probably over a hundred tags a minute, just like regular typers type WPM (words per minute) 

For CSS I use CSSEdit (Mac) to do the major heavy lifting, or substantial changes in Live Preview mode, but all the tweaks and adjustments are done inline in EE by hand. You gotta love the versioning ability.

lebisol - 26 November 2008 07:04 PM

Hey T.Gee
Have you had any luck integrating custom tags {you know the exp weblog etc.} {/into PSPad}?

Check this version of PSpad online help, something called interactive clips, macros (easy to record), all sorts of bells and whistles, there might be something there easier than going xml like the PHP. Not finding much on the autocompletion features but they are there someplace.
See also PSpad Context Files for Autocompletion.

Maybe start another thread to continue exploring psPad if you find anything worth yelling about.

Thanks for the links, I will dig around. This was one of the reasons why I started (after many many yrs of love) considering dumping Dreamweaver….being how I spend 99% of the time in code view and prefer the auto-completion. For now it is all snippet based but a few macros would not hurt.

@Ville Walveranta
I can highly recommend TopStyle for css edits.

Buddies, to work with CSS in Windows, nothing better then Stylizer…amazing…

http://www.skybound.ca/stylizer/

Bharrabhaz - 26 November 2008 09:11 PM

Buddies, to work with CSS in Windows, nothing better then Stylizer…amazing…

http://www.skybound.ca/stylizer/

It was too awkward for me to use, it hogs the workspace…but that is just me.
Here is an article people might like.

Ville Walveranta - 26 November 2008 11:15 AM

On EE side this process is much slower. Scroll down to locate the piece of code I’m currently working on, make changes, hit update refresh in another screen.. repeat. Surely there has to be a better way!

A 1-stop solution: CSSEdit. If you use its live preview mode you’ll be sold

Thanks everybody for great suggestions!

I switched the system to template editing mode for now. I, too, am likely to use the web-based editing for later tweaks, but in the initial design phase I’d like to use my favorite editors: UltraEdit Studio for general editing, TopStyle for CSS, Antechinus JavaScript Editor for JS, and Zend Studio for PHP. It would be great if their features could be found from one program but, for example, I haven’t found instant JavaScript error highlighting in anything else than Antechinus JS Editor, and no other program beats Zend Studio’s intellisense for PHP (which, of course, is no surprise since Zend is “The PHP Company”).

CSSEdit doesn’t help me since I’m on Windows platform. Stylizer looks interesting; I’ll give it a try. I’ve used StyleMaster in the past, but TopStyle seems to be at least currently in the lead. However, what I’d really like to have is a utility to easily (visually) create CSS layouts especially for statically sized pages. It would spit out a clean div structure which could then be manually edited further. The visual editors just tend to produce awfully messy code which makes a poor scaffolding to build the site on. Usually this means having to write everything from a scratch by hand.

Stylizer seems pretty cool! I went through its demo and it seems it would potentially speed up work quite a lot. I like abbreviations and short-cuts and the live view comes pretty close to a visual layout tool.

I also picked up Ryan’s video series. Viewing those is probably a few hours well spent.