ExpressionEngine CMS
Open, Free, Amazing

Thread

This is an archived forum and the content is probably no longer relevant, but is provided here for posterity.

The active forums are here.

CSS for EE, tools & the workflow?

November 26, 2008 5:15am

Subscribe [7]
  • #1 / Nov 26, 2008 5:15am

    Ville Walveranta

    72 posts

    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!!

  • #2 / Nov 26, 2008 5:47am

    iain

    317 posts

    Time spent reading the docs is time well spent…

    Saving Templates to Text Files

  • #3 / Nov 26, 2008 5:53am

    Ville Walveranta

    72 posts

    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! 😊

  • #4 / Nov 26, 2008 10:15am

    Crssp-ee

    572 posts

    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)  😕

  • #5 / Nov 26, 2008 1:04pm

    lebisol

    2234 posts

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

  • #6 / Nov 26, 2008 1:08pm

    Crssp-ee

    572 posts

    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.

  • #7 / Nov 26, 2008 1:09pm

    grrramps

    2219 posts

    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.

  • #8 / Nov 26, 2008 1:23pm

    Crssp-ee

    572 posts

    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.

  • #9 / Nov 26, 2008 3:01pm

    lebisol

    2234 posts

    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.

  • #10 / Nov 26, 2008 3:11pm

    Fábio Marchi

    103 posts

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

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

  • #11 / Nov 26, 2008 6:30pm

    lebisol

    2234 posts

    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.

  • #12 / Nov 26, 2008 11:19pm

    e-man

    1816 posts

    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 😊

  • #13 / Nov 27, 2008 12:16am

    Ville Walveranta

    72 posts

    Thanks everybody for great suggestions! :coolsmile:

    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.

  • #14 / Nov 27, 2008 1:50am

    Ville Walveranta

    72 posts

    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.

.(JavaScript must be enabled to view this email address)

ExpressionEngine News!

#eecms, #events, #releases