Board Optimization - Put Your Logo on CSS [vBulletin]

Info:
Put your vBulletin logo on CSS, this can optimize your pages load time.

Live Demo

Installation:

1- Add the code below in the additional.css template

#vbulletin_logo {
background-image: url(http://www.YOURWEBSITE.com/images/logo.png); 
display:block;
background-repeat: no-repeat; 
text-indent:-9999px;
height:73px;
width:183px;
position:relative;
left:5px;
top:22px;
}

Red: You will need to change it with your own logo url and other options ...




2- Find and replace the code below in the header template:

<a name="top" href="{vb:link forumhome}" class="logo-image"><img src="{vb:stylevar titleimage}" alt="{vb:rawphrase x_powered_by_vbulletin, {vb:raw vboptions.bbtitle}}" /></a>

With:

<a href="{vb:link forumhome}{vb:raw session.sessionurl_q}" title="YOUR TITLE" id="vbulletin_logo">YOUR WEBSITE NAME</a>

use following code, if you are using the vbulletin suite version.

<a href="{vb:raw vboptions.homeurl}{vb:raw session.sessionurl_q}" title="YOUR TITLE" id="vbulletin_logo">YOUR WEBSITE NAME</a>

Note: it works fine with any version of vBulletin.

[hgleigh]

Hi, I am a newbie at CSS code let alone the whole forum idea! I read a forum post on how good and easy vBulletin is so I purchased it and yes I do find it pretty self explaining though I am stuck and have been for 2 days now. I have vBulletin 4.2.0 suite and have succesfully installed it and wanted to add my own logo. Found this post and have completed the code change and it works fine my only question is how do I get it to center on my page? I can increase the px from the left but it does not load evenly on other devices or screen sizes. Many thanks for any help.

Leigh

[Arrogant-One]

Originally Posted by fxwoody

Good one Logect! Cut my loading time from 10.76 seconds to 6.7 seconds!

Cudo my friend

How do you measure this?

I just installed this mod and the load times seem only slightly better.