Stylevar for header_background does not seem to work

[sauloon]

Hi,

I am running 5.1.3. I would like to change the background image for the following area.



I searched with FireBug and located the StyleVar to be header_background. I edited the StyleVar to have a background image with url("/image_9966.jpg").



I tested that the image is available at the URL i.e. no 404.

After changing and saving, I was not able to see the background image. I also cleared the system cache as well as my browser cache. I am also connected via VPN to the same network as the server i.e. no intermediate ISP proxies. I also restarted the Apache server.

I am baffled. Is there something else that I need to do?

regards,
sl

[Mark.B]

Using your sute's URK, "/image_9661.jpg" does not exist.

It needs to be in your forum's root folder (in your case, /vb) to work as you have specified it.

Can you please post a link to the actual image?

[sauloon]

Hi,

Yes. The image is in my root folder (i.e. above /vb/) and I have verified that it exists.

As I respond to this post, I noticed that the image is showing correctly now, but it was more than 30 minutes ago that I made the change.

Given that I have cleared the system cache (via AdminCP) as well as my browser cache and I do not have any intermediate ISP proxies,
does vBulletin have any additional caching mechanism for CSS files? If so, how long is the caching?

regards,
sl

[sauloon]

Hi,

I figured it out.

AdminCP->vBulletin Options->Style & Language Settings->Store CSS Stylesheets as Files? needs to be set to NO.

When stored as files, there is probably a cache time.

regards,
sl

[Merenguista]

I want do that too .. So what are the the image size in pixel please ?

[BirdOPrey5]

By default the header image would be 1200 px wide and 100 px tall, but that can vary, the height anyway, depending on the logo image you have. The header may also not display full width/height on smalls screens. You should not put an important image as the header background- that is to say- don't use it in place of your logo- the logo is designed to display regardless the screen size, the header background is not.

[Replicant]

The logo can be set to go full width and re-size with the screen size automatically regardless of screen size via custom css in the css_additional.css. My header background is 1200 x 290.

[BirdOPrey5]

Using CSS to resize elements may break responsive design, and in those cases we can only suggest you undo the manual resizing, You should try to work with the elements provided if at all possible.

[Merenguista]

You should not put an important image as the header background

Hi Joe .. what exactly do you mean by "an important image" ?

[Mark.B]

Hi Joe .. what exactly do you mean by "an important image" ?

I think Joe means that if your background image contains important information, such as site name, logo, or telephone number, or a URL, then it's a bad idea...since on some screen sizes, this information may not be visible due the header area resizing as it style is "responsive".

[Merenguista]

Thank you for these explanations Mark

[sauloon]

Hi,

It turned out that I had to undo my changes to header_background because what I wanted to do was described in

http://www.vbulletin.com/forum/forum/vbulletin-5-connect/vbulletin-5-connect-questions-problems-troubleshooting/vbulletin-5-tutorials/4028865-how-to-move-the-search-box-to-the-main-navigation-bar

regards,
sl