Thursday, 15 April 2010

cq5 - Adobe cq - background images / CSS -



cq5 - Adobe cq - background images / CSS -

when example, add together background images stylesheet via class, possible in cq author specify image, , cq amend css add together class , background image specification. guess other way sling resource add together inline stylesheet. what's best method?

i've done similar in modifying components in crx(de) using inline stylesheet dialogue window has additional fields users enter. added image component field having target image selected dam target when clicked.

you along lines of this:

component properties

/yoursite/components/content/-yourcomponent-/dialog/items/bgimage (your component tree may vary slightly) fieldlabel : string = image link jcr:primarytype : name = cq:widget name : string = ./bgimage xtype : string = pathfield

add next /yoursite/components/content/-yourcomponent-/yourcomponent.jsp

<% string bgimage = properties.get("bgimage", ""); string cssstyle = ""; if (bgimage != null) { cssstyle = "background:url(" + bgimage + ") no-repeat;"; } %> <div style="<%= cssstyle %>"> // other output here </div>

this rough draft, should idea.

update: if wish add together css classes externally, , reference them in code. however, you'd still have append user-selected image inline, or internally.

in crx(de), expand /etc/designs/-yoursite-/styles.css/files in development/author instance add new css file accordingly, or append code existing file the scheme merge css files 1 huge styles.css file styles.css cached system, changes may not occur based on application settings.

<div class="imagediv" style="<%= cssstyle %>"> </div>

css cq5

No comments:

Post a Comment