Background Photo in Splash Page (Welcome Page)

[madcampus1]

Please help! I'm new to MC, so needless to say I've read the online help and am still lost. Please help me.

Here's what I'm trying to do. I wanted to add a photo to the main splash page, then I need to put links on top of the photo. To execute, I was going to do this:

1. Add photo to background
2. Add a table to the page, turn off the borders, then add in my content to flow over the photo in certain spots

BUT, I can't get a photo into the background. I did do what the online help said to do, it said to add a PHOTO to the body class, but doing that put the PHOTO in all of my topics. Don't want that! It did work, but then on all of my topics I got that particular photo. I only want the photo in my WELCOME PAGE (or splash page).

In advance, thank you for helping me...

MadCampus Writer

[nickatwork]

Off the top of my head....

Get your photo, write the text (if any is required) over the photo in a image editor, like photoshop.
Now you have an image with text over the top, you cant move the text, but with this you can put image-maps over the top.

Put the photo into the topic, right click and select Image Map. Using an image map it puts an invisible link over an image. Put the image map over the text you entered. You can set hover text and edit the links etc.

The only problem with this, if it matters, is that the text wont change colour to indicate a link is present, or that a link has been clicked, though the mouse pointer will change to the hand icon as usual.

[LTinker68]

I did do what the online help said to do, it said to add a PHOTO to the body class, but doing that put the PHOTO in all of my topics.

You were close, you just missed a minor step. Or the help could have left the step out.

Create a class under the body tag in the stylesheet then specify your background image for that body class. In the topic, right-click on the body tag block and assign the class you just created to that body tag. So only that one topic will use the body class that has a background image -- all other topics will use the default body tag which doesn't have a background image.

As an alternative, if you're like me and you have a second masterpage that doesn't have a breadcrumb proxy and you use that masterpage for your "welcome" topic, then you can associate the background image with the html class you would have already created for that masterpage, instead of creating a new body class.

[madcampus1]

Thank you to all the above respondents! I liked the first solution, but I think Lisa's might work best. I would need to the links to change colors like a regular webpage...

Thanks all...
Love the forums...

[Eric Lachance]

Why don't you just create a div with the background, and the table as its contents? Something like this (not tested):

Code: Select all

<div style="background:url('Resoures/images/photo.jpg'); background-repeat:none; background-position: top left; width : 200px; height: 200px;">
<table border="0" colspan="0" rowspan="0" width="200">
 <tr><td>Link 1</td><td>link 2</td></tr>
 <tr><td>Link 3</td><td>link 4</td></tr>
</table>
</div>

Or you could do something fancier by doing the same div, adding "position: relative" to the style, then putting a bunch of divs inside of it with your link and size/position them exactly where you want them:

Code: Select all

<div style="background:url('Resoures/images/photo.jpg'); background-repeat:none; background-position: top left; width : 200px; height: 200px; position: relative;">
<div style="position: absolute; width: 50px; top: 20px; left: 10px;">Link 1, 20px from the top, 10px from the left</div>
<div style="position: absolute; width: 50px; top: 40px; left: 40px;">Link 1, 40px from the top, 40px from the left</div>
</div>

This is all CSS/HTML and really has nothing to do with Flare itself though