[Plone-UI] Custom CSS for different portlet types?

[Veda Williams]

It sounds like you've started working through the ZMI to do skinning, which
is an OK place to start until you get the concepts down. You will have
trouble moving things around via the ZMI, at which point you should start
looking at filesystem development.

In the meantime... Rene is correct in saying that this can be done trivially
using only CSS and the CSS hooks that Plone portlets give you by default.
Make the changes to your ploneCustom.css, make sure that your portal_css is
in debug mode ( 
http://plone.org/documentation/how-to/how-to-make-your-css-changes-take-effe
ct-instantly), and you should see the updates.

There's no need for variables / calling of CSS, etc. Plone already knows
about ploneCustom.css, so it should be pretty straightforward.

I'm somewhat biased, but there's a great theming chapter in the new
Practical Plone book if you need some step-by-step assistance:

http://www.packtpub.com/practical-plone-3-beginners-guide-to-building-powerf
ul-websites/

Cheers,

- Veda


On 2/25/09 7:55 AM, "erik kulvinskas" <vaporboy at gmail.com> wrote:

> 
> I am trying to create a custom color header for each type of portlet type
> within my theme. I have created some custom css in my ploneCustom.css
> (<theme>/skins/theme_styles) for my theme using a rounded corner technique
> and it looks great. What i would like to do, for example, is have the news
> portlets have a grey header and RSS portlets to have an orange header, etc.
> So for the news portlet, i have a custom news.pt file that i am loading
> within my theme and i THINK i have to do the following:
> 
> 1) set some sort of variable in my news.pt file such as 'portletColor
> string:grey'
> 2) separate out the rounded corners css into a separate css file
> 3) call that css file within my news.pt and pass that variable to the css so
> that the particular image it calls is the one that i have set as a variable
> in the news.pt file.
> 
> So here are my questions:
> 
> 1) am i thinking of this correctly?
> 2) if so, what type of file do i save this ccs as? a .pt or .dtml
> 3) where do i call this css from? browser/templates/blah.css.dtml(.pt) ??
> 4) how do i pass the variable value from the news.pt to the css and then
> have the css render that value when it gets called?
> 
> I hope i have not been too confusing.
> 
> thanks,
> 
> -erik