XOOPS 
Forum
Forum Index General Forums Community Support Modules Support Themes Support Development International Support Module Hack Reviews Theme Designer Talk
  1. Board index / 
  2. XOOPS Community Support forums / 
  3. XOOPS general usage questions 
  4.  / Background image within one block
Register
1
ICHI_UK
Background image within one block

  • 2006/5/24 12:00

  • ICHI_UK

  • Not too shy to talk

  • Posts: 181

  • Since: 2005/11/1


On the frontpage of my site http://www.ichipromotions.com, we have a block showing what is broadcasting this week on our Internet Radio station.

I am wanting to but a background image within just that single block but I cannot work out the HTML code for that. When I have tried to do it a background image appears on the whole frontpage, where as I just want it in that single block...

Therefore like I have mentioned above... does anyone know the html code for this?

Thanks
2
tcnet
Re: Background image within one block

  • 2006/5/24 12:53

  • tcnet

  • Friend of XOOPS

  • Posts: 297

  • Since: 2006/5/12


If it is a custom block you could enclose your HTML code in a div with an inline style.

Like this:
le="color: #000000"><?php <div style="background-image: url(http://www.yourdomain.com/images/yourbackground.gif);"> Your HTML Here </div>

Set the "Content Type" to HTML and submit the change.

Hope this helps,
tcnet
3
ICHI_UK
Re: Background image within one block

  • 2006/5/24 12:55

  • ICHI_UK

  • Not too shy to talk

  • Posts: 181

  • Since: 2005/11/1


Cheers mate, I'll try it when I get in from work
4
ICHI_UK
Re: Background image within one block

  • 2006/5/24 15:38

  • ICHI_UK

  • Not too shy to talk

  • Posts: 181

  • Since: 2005/11/1


Hmmm tried it but the image did not show and its the correct path aswell...

Quote:


<div style="background-image: url=http://www.ichipromotions.com/images/misc/Ichi-Promotions-Logo.gif;">

MY HTML CODE HERE



</div>

5
ICHI_UK
Re: Background image within one block

  • 2006/5/24 15:45

  • ICHI_UK

  • Not too shy to talk

  • Posts: 181

  • Since: 2005/11/1


also tried..

Quote:


<div style="background-image: url(http://www.ichipromotions.com/misc/images/Ichi-Promotions-Logo.gif);">

Your HTML Here

</div>

6
martyboy
Re: Background image within one block

  • 2006/5/24 16:39

  • martyboy

  • Quite a regular

  • Posts: 256

  • Since: 2004/5/25


Hey, i managed to get a background image to show in a marquee module block, I also tried it in a custom block but i couldnt get it to work, i think it might be because the custom block doesnt have its own seperate template, im not sure though.

Heres the exact code i used in the marquee block:
le="color: #000000"><?php <table width="400" height="125" border="0" cellpadding="0" cellspacing="0"><tr> <td background="http://mjtkop.com/home/uploads/img444cee41bdf8b.gif"><{$block.marqueecode}></td> </tr> </table>


I basically just added the background bit after the <td tag, maybe if you tried putting your block content inside table tags it will work, i am not sure though.

You can see the image working here scroll down to the scrolling marquee block thats says 'Visionary Lyrics'.
Michael Jackson = King Of Pop

Xoops = King Of CMS
7
ICHI_UK
Re: Background image within one block

  • 2006/5/24 17:51

  • ICHI_UK

  • Not too shy to talk

  • Posts: 181

  • Since: 2005/11/1


Big shame as I really want it to work in a custom block... gutted
8
tcnet
Re: Background image within one block

  • 2006/5/24 19:01

  • tcnet

  • Friend of XOOPS

  • Posts: 297

  • Since: 2006/5/12


It took me a long while but I think I have this figured out.

The background-image will not display if its dimensions are larger than the block it is in.

Try resizing your image to fit your block size and it should appear.

You can set the block width and height in the div. For a 400px image you could use:
le="color: #000000"><?php <div style="width: 400px; height: 400px; background-image: url(http://www.technicalcrew.com/images/Ichi-Promotions-Logo.gif);"> YOUR HTML HERE </div>


Good Luck,
TCNet
9
ICHI_UK
Re: Background image within one block

  • 2006/5/25 9:42

  • ICHI_UK

  • Not too shy to talk

  • Posts: 181

  • Since: 2005/11/1


Like that.. but dont the dimensions affect everything thats within that block?
10
tcnet
Re: Background image within one block

  • 2006/5/25 14:28

  • tcnet

  • Friend of XOOPS

  • Posts: 297

  • Since: 2006/5/12


Hi,

Quote:
dont the dimensions affect everything thats within that block?


Yes, you are correct.

Sorry to have confused the issue, you do not have to specify the div's width and height.

Its the image's size that is preventing it from appearing, try resizing the image(approx 360px) to fit within the block's minimum dimensions.

Also, to prevent the image from repeating (tiling) you can add background-repeat: no-repeat;

le="color: #000000"><?php <td colspan="8" bgcolor="#efefef" > <div class="blockContent"> [color=0033FF]<div style="background-image: url(http://www.ichipromotions.com/misc/images/Ichi-Promotions-Logo.gif); background-repeat: no-repeat;">[/color] <span style="font-weight: bold; text-decoration: underline; font-family: Arial,Helvetica,sans-serif;"> SUNDAY – Anything Goes!</span><br style="font-family: Arial,Helvetica,sans-serif;"><span style="font-weight: bold; font-family: Arial,Helvetica,sans-serif;"> * 13:00 – 15:00:</span> <!--//** snip **//--> <b><a href="http://www.rewind-dnb.co.uk/image/ICHI_SCHEDULE.jpg">Click HERE for the full schedule</a></b> </center> [color=0033FF]</div>[/color] </div> </td>


Hope this helps,
TCNet

Login

Register now!  |  Lost Password?

Search

Advanced Search

Recent Posts

Donat-O-Meter

Stats
Goal: $15.00
Due Date: Jul 31
Gross Amount: $0.00
Net Balance: $0.00
Left to go: $15.00
Make donations with PayPal!