Combination View Flat View Tree View
Threads [ Previous | Next ]
toggle
devaki s
background image
December 22, 2008 1:52 AM
Answer

devaki s

Rank: New Member

Posts: 21

Join Date: September 15, 2008

Recent Posts

Hi,

I would like to apply background image for a custom portlet (single portlet) which i have created.

I tried using .portlet{background-image(../images/pic.jpg);} but this applies to the entire portlet available not for one portlet.

Please can any one help solving this issue.

Thanks,
Devaki
The Meurwinn Concept Concept
RE: background image
December 22, 2008 2:05 AM
Answer

The Meurwinn Concept Concept

Rank: Expert

Posts: 262

Join Date: April 9, 2006

Recent Posts

Hi,
you should create a "<div>" with a custom id or custom css class , put your jsp code into the div and apply the css style to your div.

If you want to apply the backgroubnd image on every part of the portlet (title... to footer), you should add a css style with extJs or jQuery to your portlet.
devaki s
RE: background image
December 22, 2008 2:50 AM
Answer

devaki s

Rank: New Member

Posts: 21

Join Date: September 15, 2008

Recent Posts

hi Meurwinn,

Thanks for the reply.

can you please suggest me with sample code or any sample post

i want to apply the backgroubnd image on every part of the portlet. i have not added a css style with extJs before.
The Meurwinn Concept Concept
RE: background image
December 22, 2008 2:52 AM
Answer

The Meurwinn Concept Concept

Rank: Expert

Posts: 262

Join Date: April 9, 2006

Recent Posts

i've never done this for only one portlet.

But what do you want to do ? Put a background picture in all the portlet or only the body ?

And other solution. Perhaps you can define a background picture in the custom style of your portlet in the interface.
devaki s
RE: background image
December 22, 2008 3:00 AM
Answer

devaki s

Rank: New Member

Posts: 21

Join Date: September 15, 2008

Recent Posts

I want to put a background picture for all the portlet.

But if u want to suggest for only the body please even that helps me
The Meurwinn Concept Concept
RE: background image
December 22, 2008 3:16 AM
Answer

The Meurwinn Concept Concept

Rank: Expert

Posts: 262

Join Date: April 9, 2006

Recent Posts

Put your test.gif in your images theme folder and create the css style
1.mySpecialPortletStyle {
2     bacground-image: url(../images/test.gif)
3}


AND

In a javascript code, select the div of your portlet "portlet--xxx_INSTANCE_xxx" with jquery or extjs for exemple
And add it your css class
OR
select the div you added in your portlet content and look for it's parent with css class "portlet" and add your css class on it.


Perhaps there are some others solutions.
devaki s
RE: background image
December 22, 2008 9:36 PM
Answer

devaki s

Rank: New Member

Posts: 21

Join Date: September 15, 2008

Recent Posts

Hi Meurwinn,

I have created a css class like
1
2.mySpecialPortletStyle
3{   
4         bacground-image: url(../images/test.gif)
5}

Modified portlet.vm file and applied this css class for the portlet by comparing with unique portlet id

portlet.vm
 1
 2
 3#set ($portlet_display = $portletDisplay)
 4#set ($portlet_id = $portlet_display.getId())
 5#if($potlet_id.equals(".........."))
 6     <div class="mySpecialPortletStyle">
 7         .........................
 8     <div>
 9#else
10      <div class="portlet">
11      .......................
12     </div>
13#end


now i am able to apply background image for single portlet

thanks