Tuesday, February 5, 2008

How To Make a BlogRoll With A Scrollbar

It is pretty easy if you have patience and ability to look at the html code. I am a beginner myself and not very good at this but if you want to try this yourself then feel free to read my complicated instruction.
Look at that code below. It should have this character < in the beginning and > at the end but I deleted them so I can show all of the crazy characters. Make sure you add that characters < >though so the code will work in your page element.

div style="border: 1px solid #4c4058; width:150px; height:150px; text-align:left; overflow:auto; font-size:10px; font-family:Trebuchet MS, sans-serif; font-weight:normal; color:#4c4058; line-height:12px; background-color:#f3ecf4;"

Play with the numbers such as the border, width, height, font-size and line-height. Line-height should be the same or higher than the font-size to make it look good. Also, play with the color codes. To get more other color codes, use this site. Click the 'choose color' box and picked the color that you want. After that, copy the code in the white box and enter the code under (font) color and background-color. Make sure you do not delete this character #.

After you change all of the colors and numbers on your preference, place your blogrolling code script (down below) after the above code.

{script language="javascript" type="text/javascript" src="YOUR BLOGROLLING URL HERE"}


{br /}

Make sure you replace the { } with the < >. Also, please delete the _raw part of your blogrolling PHP code so that it will work.

Good luck. It takes time but it is worth it. If you have any problems with these codes, please let me know.

Check this related post:
How to make an automatic scroll blogroll

Home Page


Anonymous said...

Thanks for sharing this information. I was really looking for this.

Anonymous said...

Found your site through BlogCatalog. Very cool!

EuroYank - Virginia Hoge said...

Wow ... I used it and it works! You are so smart. Am happy you are not a blond!

_________________________________________________________ Related Posts with Thumbnails