Geeks and God Podcast

(206)984-3694geeksandgod@gmail.comfeeds.feedburner.com/geeksandgod
login | register

.PSD to Zen?

I'm at the point where I'm fairly proficient at creating a .PSD file, generating the .HTML and .CSS, dropping in some .PHP print calls and saving as a page.tpl.php.

However, I've got no clue how to get from .PSD to Zen. (For those unaware, Zen is a Drupal theme which is cleanly coded and well noted; built with the intent of being a solid platform from which to launch a custom theme from.) Is this something you could address in an upcoming show (or maybe at the conference?)

Thanks!

-NP

All about CSS

If you are going to use the ZEN theme then it's all about CSS. It's the idea behind the Zen theme is http://www.csszengarden.com/. So, start where you have it and then modify CSS until you get what you want. You may want to use Firebug to help you with the CSS.

Now, you can't do everything with the Zen theme. There are things you may want to do that you can't do with just CSS. Then alter the page.tpl.php file to change your html layout.

Hope this helps.

Matt Farina
Geeks and God Co-Host
www.innovatingtomorrow.net
www.mattfarina.com

Here is a video that may

Here is a video that may help: http://www.theartlab.net/drupa...

I recently did some theme work based off of zen. If you use the dev version check out these instructions for creating a subtheme so you can modify the page.tp.php file if needed as Matt talked about: http://drupal.org/node/201423

Also, I have had good luck recently with using the Foundation theme. http://drupal.org/project/foun...

Thanks
Shrop

Zen Zen Zen

Hey Matt & shrop, thanks for your replies. I was clear how the page.tpl.php and style.css interacted, I'm just having trouble making the leap from .PSD. When I start from scratch I can write the .HTML based on my image and drop in the.PHP print calls. However, I find it much more difficult to begin with an existing theme. Drupal user mollyclare has created an incredible Zen map and I just can't decipher how to use it. Maybe I simply need more time with the code and a greater confidence with basic coding.

I'm a big fan of Elliott Rothman's Drupal School! However, I believe the theme changed enough at Zen 5.x-0.8 this particular video is no longer applicable to the more recent versions. I can get the latest loaded and created a subtheme fairly easily. I can theme it the way I like, but it seems more difficult (at least the way I work) than the method described above. Oh well, I just gotta keep learning, I guess.

I'll also check out the Foundation theme.

Thank you both for your help!

-NP

Thanks for the tip on

Thanks for the tip on mollycare's pdf. That is great!

You are right, Zen has changed a lot from the time Elliott recorded the video (I hope this guy starts to do more videos again!) I do think that it gives some basic concepts that are still applicable. It may be a little to basic for where you are at right now though.

Foundation may help you from scratch better than Zen. The problem I had with Zen when going from PSD is that if you need to do things like move the primary nav out of the header ID, things start to get hairy. It seems zen is best if you only need minor changes to the page.tpl.php and are mostly adjusting CSS.

The main thing of great benefit to learn from Zen is the how it handles turning columns on and off via css. Foundation does this too in a slightly different way. Once you have that (if needed), you can pretty much start from scratch. Heck, If your theme is more complicated that most basic fixed width bloggy/drupal looking themes, you may be better off starting from scratch.

I have battled this a lot lately with some new sites I am working on..

Thanks!
Shrop

Part of the SAP Network