Site Logo Image re-size
Mod Version: 1.00, by Spangle
| vB Version: 5.0.1 | Rating:  (0 vote - 0 average) |
Installs: 7 |
| Released: 18 Dec 2013 | Last Update: Never | Downloads: 27 |
 Not Supported
 Template Edits
Code Changes
Re-usable Code
Translations
|
||
The default width for the logo image in VB5 is only 320px, which may suit the VB logo itself, but doesn't help those wanting a bigger logo, the easiest and best way to do this is by altering the css, doing it this way means you don't mess up the rest of the header area.
You only need to complete two edits to one file.
Go to :
AdminCP>Styles and Templates>Style Manager
From the drop down menu select :
Edit Templates>CSS Templates> css_global.css
Find :
Alter the max-width to the desired width in pixels, up to 720px works fine.
Find : (it should be directly underneath, the above)
Once again edit the part in red to the same figure as the first.
One point to remember is that with the height and width set to "auto" the CSS will make you image "fit" the maximum width set.
Therefore if you plan to use a larger logo, it is best to design the logo to your maximum width, if you use a smaller image, it will appear pixelated when enlarged by the CSS.
You only need to complete two edits to one file.
Go to :
AdminCP>Styles and Templates>Style Manager
From the drop down menu select :
Edit Templates>CSS Templates> css_global.css
Find :
Code:
#header .site-logo {
padding: 22px 10px 26px;
background:transparent;
min-width:90px;
max-width:320px;
position:relative;
text-align:{vb:stylevar left};
}
Find : (it should be directly underneath, the above)
Code:
#header .site-logo img {
height:auto;
width:auto;
max-width:320px;
}
One point to remember is that with the height and width set to "auto" the CSS will make you image "fit" the maximum width set.
Therefore if you plan to use a larger logo, it is best to design the logo to your maximum width, if you use a smaller image, it will appear pixelated when enlarged by the CSS.
Download
No files for download.