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

erik kulvinskas vaporboy at gmail.com
Wed Feb 25 19:02:14 UTC 2009


All, thanks for your responses but i AM developing on the file system. I have
change the portlet code because A, the method i am using for rounded corners
is different from how Plone does things. B, the method i am using is much
simpler using divs instead of dl's, dt's, etc etc.

Instead of using custom css for every portlet color, i figured it would be
easier to call the css and just switch out the single image i am using for
the rounded corners depending on the portlet i am in (news, rss, etc) . You
can find the method i am using here:
http://www.schillmania.com/content/projects/even-more-rounded-corners/

Oh, and implementing rounded corners WITH transparent curves is not a
trivial thing in the standard build-out of plone. i have a gradient
background and need rounded corners to look properly. So, many of the
methods that exist out there that have 'rounded corners' work ONLY if you
background is solid that the corner resides on. The above method is the one
i found that works quite nicely

Veda, thanks for the info on the links and tutorials, i have poured through
those, i have about every plone/zope book out there (waiting for yours to be
available) and i 'get' the file system development.

Erik



vedaw wrote:
> 
> 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
> 
> 
> _______________________________________________
> UI mailing list
> UI at lists.plone.org
> http://lists.plone.org/mailman/listinfo/ui
> 
> 

-- 
View this message in context: http://n2.nabble.com/Custom-CSS-for-different-portlet-types--tp2384432p2385499.html
Sent from the User Interface & Design mailing list archive at Nabble.com.





More information about the UI mailing list