Background image in portlet?

Is it possible to use background-images in portlets?
We would like it to be possible with:
- Background images in folders when shown as portlets
- Background images in navigation bars when shown as portlets
We can of course have background images in HTML-portlets, but would be much more elegant if it was possible directly implemented in the style.
Looking forward to hearing your comments.
Best regards
Benjamin F. Lund
BellCom Internet www.bellcom.dk

When you are making the style you have an option (Backgroung image on the top of the combobox), when you select it you can change the background image, if it was the navigation bar style the background changed is the navigation bar.
<BLOCKQUOTE><font size="1" face="Verdana, Arial">quote:</font><HR>Originally posted by Benjamin Lund ([email protected]):
Is it possible to use background-images in portlets?
We would like it to be possible with:
- Background images in folders when shown as portlets
- Background images in navigation bars when shown as portlets
We can of course have background images in HTML-portlets, but would be much more elegant if it was possible directly implemented in the style.
Looking forward to hearing your comments.
Best regards
Benjamin F. Lund
BellCom Internet www.bellcom.dk <HR></BLOCKQUOTE>
null

Similar Messages

Adding background image to portlet title bar

Hi,
Does anyone know how to add a background image to a portlet title bar. I have tried using the LAF editor but nothing seems to work. The image will be static and not change.
Any help appreciated.

Hi Chris
You have to modify the .css file depending on the type of Skin you are using like "default" or "bighorn" in case of 10.x and 9.x etc. Best thing is to install Firebug for Firefox and inspect the Titlebar in firebug. That should tell exactly which .css file and which element in that .css file is used to render the Portlet Title bar.
For "default" skin, the file is window.css and the element in this file is ".bea-portal-window-titlebar" with background-color: #XXXXXX. Replace this or add another field like background-image: url(your image path). This window.css file can be found under WebContent\framework\skins\default\css\window.css. Remember that in 9.x and 10.x to see this file from Workshop IDE, you need to switch view to Merged Projects and select this file and copy this to your project to view it. BUT, I would not recommend to modify any out of box .css file. Instead create a new file custom.css file and add entries in this file which you want to overwrite. This is the standard way to customize any out of box skins look and feel. So in your custom.css file your will have one entry like this:
.bea-portal-window-titlebar {
background-image: url(your image path)
For "bighorn" skin introduced in 9.x and 10.x, the elements in .css files are slighty different but the concept is same. I customized out of box bighorn skin to change background color of portlet title bar. The .css location for portlet title bar for bighorn skin is: WebContent\framework\skins\bighorn\css\colors.css and the element is ".wlp-bighorn-titlebar". For quick testing from Firebug, inspect this element and change the background color to something else and see if it reflects in Firefox. Then you can create custom.css file under same folder structure in your portal web project and over write this element and this field alone with the background-image that you want something like:
.wlp-bighorn-titlebar {
background-color:#FF0000;
background-image:url(your image path);
It is highly recommended to have all customizations go into custom.css file only. Please make sure that you have this custom.css file entry in the skin.xml file (in case of bighorn) or skin.properties file (in case of old legacy default skin). This .xml or .properties file can be found under same folder structure like: WebContent\framework\skins\yourSkin. For new bighorn skin.xml file this custom.css file entry is already there. But for old legacy default skin you may need to add this entry.
HTH
Ravi Jegga

Background image for my portlet.

i have set a image for page background .
but i want the same image for all portlets is it possible to do?
if yes how to achive this?
and where shud i keep all my images?
i mean what is the path for images in portal.
really need help.
waiting
chaitali

Create a template.
Set that Image as background image for that template.
Use this template.
Keep the image in some shared dictory
e.g.
/image

Background images for a portlet

Hi,
Is it possble to have a background image for a portlet only, In particular I need to include the login portlet in a region but have the background of the portlet based on an image file.
Thanks in advance,
Brandon

Hello Benny,
The portal layout is done in portalcontent.jsp and portlet.jsp. The
homepage for exampleportal is portal.jsp, which does a dynamic include of
the portalcontent.jsp page. The portalcontent.jsp page loops through an
array of Portlets and includes them with an HTML table that uses a dynamic
include for each portlet by doing a <jsp:include> with portlet.jsp. There
is another HTML table in portlet.jsp.
All of this is just HTML, so it should not be difficult to customize
it. You could use WLPS to create a "backgroundImage" property for each
user or group and then use the <um:getproperty> tag to get the value when
displaying the portal. Maybe you could set "backgroundImage" to
images/wallpaper.gif for your user's group and then you could use the
<um:getproperty> tag to get this value in your JSP page. Then you could do
something like this in your HTML table in a JSP page that extends JspBase
(or PortalJspBase):
<%
String backgroundURL = fixupRelativeURL(backgroundImageValue);
%>
<table background="<%= backgroundURL %>" ...
Ture Hoefner
BEA Systems, Inc.
2590 Pearl St.
Suite 110
Boulder, CO 80302
www.bea.com

Background image in a portal page??

Hi,
How can I set a background image or watermark in a portal page instead of the plain background that comes by default.
Regards
Sreeram

Ofcourse Chris, very true. I should have mentioned the workaround in the previous post itself. Infact the solution is based on your suggestion in the previous post.
Every community page that is generated by the portal has a <div> element with a unique id. The id of div element is made up of the following string "pt-portal-content-" followed by the object id of the community page (which is unique). This <div> element has the style portalContent set to it by default.
I knew the page I would want the background to be applied to. And I knew the portlets that would go only on this page. These portlets are content portlets created from the publisher.
So in the presentation template code for one of these portlets I included a javascript function and set the background property of the div element, conditionally checking the div element's id to make sure that it is the community page I wanted to modify. And this javascript function is registered to the onload event.
Regards
Sreeram

Background image for a FTP server

I use vsftpd as a FTP server, and I've been wondering if there's any possibility to use a background image, when someone comes around via web browser.

I know,I can set the background image in the Page Template but in that case Portlets do not take that image as a background.Then It looks very awkward.
How to solve this? Anybody at Oracle.
Thanx

Background Image for a Page

Hi All,
How to have a background image for a Portalpage? As Portlets are on the top of page,setting image in the Portal Style does not help.
What's the wworkaround?
Thanx

I know,I can set the background image in the Page Template but in that case Portlets do not take that image as a background.Then It looks very awkward.
How to solve this? Anybody at Oracle.
Thanx

Add BackGround image to TextField control

Hi,
i'm using spark list that contains a few TextField controls. how can i add a background image to text field?
i've tried adding it with the htmlText property but i can i combine it with the current htmlText that contains the current text represented in the control?

You can add a background image for the whole page, but not for an individual portlet.
Jerry

How to specify relative path for background image in xsl

Hi,
I am generating a PDF from Apcahe FOP. I have an xsl for that, in the xsl fo:block I am displaying a background image. When the image path is absolute like..C:\image\logo.png it works fine. But I want to have the image in my WebContent\images folder and my xsl file is in WebContent\xsls folder. So when I try giving the relative path as ../images/logo.png, the image is not displayed.
Can anyone tell how to do this???
Thanks,
Sanjeev.

I have a fo:block like this :
<fo:block border-style="solid" border-width="0.2pt" text-align="left"
                         background-image="url('http://localhost:8080/Project/images/table_header_center.png')"
                         font-size="8pt" font-weight="bold" color="white" padding-top="1pt"
                         padding-bottom="1pt">
                         <xsl:value-of select="tr/td/span" />
                    </fo:block>In the above code you can see that the the background-image="url('http://localhost:8080/Project/images/table_header_center.png')"
has been given as absolute. The images folder is in my WebContent directory. I want this path to be relative to the context of my application , something like background-image="url('../images/table_header_center.png')".
Thanks.
sanjeev.

In linux, saving a background image (set as Desktop)feature doesnt download my image to wallpaper folder..or even to standard "Save download" feature. Can I tell firefox where (what folder) to save my "Set as Desktop" picture?

When I find a suitable picture to use as wallpaper" I often right click and use the menu item "Set as Desktop Background". The file ""example.jpg" is saved in directory\folder "/home/user" rather than for example "/home/user/my wallpaper" or in the directory
"/home/user/Downloads". The latter as being set under the "Downloads" section on the "General" tab in the "Preferences" dialog box.
Is there a configuration file where I can change the default location to save my "Set as Desktop Background" images. Or better still can the menu be customized to launch the application that allows me to set my desktop wallpapers?
I am using the "PCLinuxOS" Linux OS but I have encountered this issue in many if not all the Linux distributions I have sampled.

Don't use "Set as Desktop". Use ''' "Save Image As..." ''' instead, and file it with your other "wallpaper" images so the operating system has access to those images.
IIRC, Firefox saves a "desktop image" to the Profile folder, and it will only save one image, at that. Change the image and the previous one is gone.

Washed out background image on Treo Pro

Hi:
When I set my background image on my today screen (check the box in settings, browse to image - use 320x320 resolution) I get a "washed out" version of the image regardless of its original color, tone or intensity. Images from the preinstalled themes are fine - vibrant and clear - but the user set images are very light (almost like a 50 percent transparency in Photoshop for example). I have tried both .jpg format and .png. Backlight settings do not cure this either.
Any ideas?
Thanks.
Post relates to: Treo Pro T850 (Bell)
This question was solved.
View Solution.

Hi Again:
Upon further investigation, I have discovered that the options for setting background and transparency levels is found through the pictures and videos explorer not the file explorer.
As suggested I have set the transparency to 0 and the image (Crab Nebula through the Hubble space telescope) is as bright and vibrant as it should be.
Thanks again for the direction - it's much appreciated.
Post relates to: Treo Pro T850 (Bell)

Anchored graphic as background image?

I am working with text flowing continuously through a master text frame unto multiple pages and I am trying to anchor a full-page background image (with bleed) onto specific pages. Is this possible?
I want the background image to stay with the relevant heading on each page. However, when I use "Object/Anchored Object/Insert" to do this with "custom" as the anchor option I end up with a frame on the same layer as my text. This is okay, but when I place an image in the frame, it covers the text I have entered in the text frame. I can see the dotted line indicating the anchor connection, but not the text it is anchored to. I can't change the order of objects within the layer because the "Arrange" options are greyed out. Changing the text wrap options does not help.

Thanks Bob! Really good to know. I will stop hitting my head against a brick wall!
Adding backgrounds to master pages doesn't really cut it since I still can't have them flow dynamically with the continually evolving text in this project. (I suspect I might be able to flow backgrounds with text in Word, if it came to it, but of course I chose InDesign to give me more control, particularly over the non-text elements of the layout).

Problem with Background image and JFrame

Hi there!
I've the following problem:
I created a JFrame with an integrated JPanel. In this JFrame I display a background image. Therefore I've used my own contentPane:
public class MContentPane extends JComponent{
private Image backgroundImage = null;
public MContentPane() {
super();
* Returns the background image
* @return Background image
public Image getBackgroundImage() {
return backgroundImage;
* Sets the background image
* @param backgroundImage Background image
public void setBackgroundImage(Image backgroundImage) {
this.backgroundImage = backgroundImage;
* Overrides the painting to display a background image
protected void paintComponent(Graphics g) {
if (isOpaque()) {
g.setColor(getBackground());
g.fillRect(0, 0, getWidth(), getHeight());
if (backgroundImage != null) {
g.drawImage(backgroundImage,0,0,this);
super.paintComponent(g);
Now the background image displays correct. But as soon as I click on some combobox that is placed within the integrated JPanel I see fractals of the opened combobox on the background. When I minimize
the Frame they disappear. Sometimes though I get also some fractals when resizing the JFrame.
It seems there is some problem with the redrawing of the background e.g. it doesn't get redrawn as often as it should be!?
Could anyone give me some hint, on how to achieve a clear background after clicking some combobox?
Thx in advance

I still prefer using a border to draw a background image:
import java.awt.*;
import java.awt.image.*;
import javax.swing.border.*;
public class CentredBackgroundBorder implements Border {
    private final BufferedImage image;
    public CentredBackgroundBorder(BufferedImage image) {
        this.image = image;
    public void paintBorder(Component c, Graphics g, int x, int y, int width, int height) {
        int x0 = x + (width-image.getWidth())/2;
        int y0 = y + (height-image.getHeight())/2;
        g. drawImage(image, x0, y0, null);
    public Insets getBorderInsets(Component c) {
        return new Insets(0,0,0,0);
    public boolean isBorderOpaque() {
        return true;
}And here is a demo where I load the background image asynchronously, so that I can launch the GUI before the image is done loading. Warning: you may find the image disturbing...
import java.awt.*;
import java.io.*;
import java.net.URL;
import javax.imageio.*;
import javax.swing.*;
import javax.swing.border.*;
public class BackgroundBorderExample {
    public static void main(String[] args) throws IOException {
        JFrame.setDefaultLookAndFeelDecorated(true);
        JFrame f = new JFrame("BackgroundBorderExample");
        f.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
        JTextArea area = new JTextArea(24,80);
        area.setForeground(Color.WHITE);
        area.setOpaque(false);
        area.read(new FileReader(new File("BackgroundBorderExample.java")), null);
        final JScrollPane sp = new JScrollPane(area);
        sp.setBackground(Color.BLACK);
        sp.getViewport().setOpaque(false);
        f.getContentPane().add(sp);
        f.setSize(600,400);
        f.setLocationRelativeTo(null);
        f.setVisible(true);
        String url = "http://today.java.net/jag/bio/JagHeadshot.jpg";
        final Border bkgrnd = new CentredBackgroundBorder(ImageIO.read(new URL(url)));
        Runnable r = new Runnable() {
            public void run() {
                sp.setViewportBorder(bkgrnd);
                sp.repaint();
        SwingUtilities.invokeLater(r);
}

How to set a background image to fill the entire screen on any device in a spark mobile application

Hi,
I started developing a mobile application with Flex.
I'm trying to set a background image to fill the whole screen. I've been stucked at this point for days now. I tried everything and no solution seems to work for me.
I'm using a TabbedViewNavigatorApplication and i need to set some background images on views.
I need my image to fill the entire screen on any device. i don't need to mantain image aspect ratio, just need it to be fullscreen. This seemed to work when setting a custom skin on the TabbedViewNavigatorApplication, however this blocked all my views for some reason and all components contained in view became invisible.
Can you please tell me how can i achieve this?
Kind regards,
Dan

Basically you need a larger image which can accommodate any device. The trick is to show only what each device can display, so therefore some clipping will occur based on device. Have something centered and towards margins have a gradient or just plane colors that way the stuff in the middle will be visible on every device while nobody will care if you are clipping from the color fill.
C

Background image path changes in Template

I have a template I've created, but whenever I attempt to
create a new page from that template the path to the background
image changes automatically causing it to disappear.
The template displays this path:
body {
background-image: url(../img/bg.gif);
background-repeat: repeat-y;
background-position: center;
background-color: #E8F1FA;
While the page created from the template shows this path:
body {
background-image: url(file:///B|/Web
Development/website/img/bg.gif);
background-repeat: repeat-y;
background-position: center;
background-color: #E8F1FA;
What is causing this? Thanks in advance.

Answered on DW forum.
Murray --- ICQ 71997575
Adobe Community Expert
(If you *MUST* email me, don't LAUGH when you do so!)
==================
http://www.projectseven.com/go
- DW FAQs, Tutorials & Resources
http://www.dwfaq.com - DW FAQs,
Tutorials & Resources
==================
"logicore" <[email protected]> wrote in
message
news:gecn6f$dag$[email protected]..
>I have a template I've created, but whenever I attempt to
create a new page
> from that template the path to the background image
changes automatically
> causing it to disappear.
>
> The template displays this path:
>
> body {
> background-image: url(../img/bg.gif);
> background-repeat: repeat-y;
> background-position: center;
> background-color: #E8F1FA;
> }
>
> While the page created from the template shows this
path:
>
> body {
> background-image: url(file:///B|/Web
Development/website/img/bg.gif);
> background-repeat: repeat-y;
> background-position: center;
> background-color: #E8F1FA;
> }
>
> What is causing this? Thanks in advance.
>
>
>

Background image in portlet?

Similar Messages

Maybe you are looking for