PDA

View Full Version : Forum Home Enhancements - UKBL ~ Forum Marquee/Scroller with Pictures


UKBusinessLive
03-02-2009, 10:00 PM
UKBL ~ Forum Marquee/Scroller with Pictures

Want a different kind of Scroller/Marquee for your Site, With changable gradients and Font Colours/Type/Size.

LIVE DEMO: http://www.ukbusinesslive.co.uk/forum/Scroller.htm

https://vborg.vbsupport.ru/external/2009/03/53.png

This is so easy to add to your forum. First we start with the images

just upload the images to your forums images/misc folder

To change the gradient, just make up a 50px by 100px box and add a gradient of your choice, i made mine in Paint.net, but you can use photoshop or gimp.

https://vborg.vbsupport.ru/external/2009/03/125.jpg

Next comes the transparent gifs, they are 40 pixels square, you could add your logo or any other image you want.

https://vborg.vbsupport.ru/external/2009/03/46.gif https://vborg.vbsupport.ru/external/2009/03/47.gif

Just make sure all the graphics are uploaded to your correct folder and thats it on the graphics side.

Now the code :D

<html>
<head>

<title>UKBL ~ Forum Scroller display</title>

</head>
<BODY BGCOLOR="#FFFFFF" TEXT="#000000" leftmargin=0 rightmargin=0 topmargin=0 bottommargin=0 marginheight=0 marginwidth=0>

<br><br>

<center>
<table width="800" border="0" cellpadding="0" cellspacing="0" style="border: 1px solid #5272A9; color: #5272A9; font: 33px arial black, arial, sans-serif; letter-spacing: 5px; font-weight: bold" background="images/misc/grad.jpg"><tr><td align="center" valign="middle">
<marquee scrolldelay="100">
<img src="images/misc/rss.gif" align="middle"> Welcome Friends <img src="images/misc/purse.gif" align="middle">
</marquee>
</td></tr></table>
</center>

<br><br>

</BODY>
</HTML>

1st Edit

<table width="800" border="0" cellpadding="0" cellspacing="0" style="border: 1px solid #5272A9; color: #5272A9; font: 33px arial black, arial, sans-serif; letter-spacing: 5px; font-weight: bold"

here you edit the width of the marquee, default is 800, You can change the border width, and color The font color and style, so easy from this 1st edit.

2nd Edit

background="images/misc/grad.jpg">

This is the location of the gradient gif, if you change the color and the name of your gradient, don't foreget to change it here too ;)

3rd Edit

<img src="images/misc/rss.gif" align="middle"> YOUR MESSAGE HERE <img src="images/misc/purse.gif" align="middle">

Here you can see the 2 gif files and their locations, You can add more pictures by simply adding the html code like this <img src="images/misc/YOUR.GIF" align="middle">

You can see where your message goes too ;)

When you've finished, Save your edits and copy and paste the entire code to your Styles Header, Right at the bottom. Or you could experiment by adding it to other templates, ;)

You can, since its only basic html code, add more than one to a page, with different messages, Experiment is the fun part :D

Thats it, Hope you have fun with your new scroller

Please click install if you use ;)

UKBusinessLive
03-03-2009, 07:41 PM
:D Reserved ;)

FReeSTER
11-25-2010, 03:24 PM
Working great on vB4.0.8

Thanks :D:p