Header Image

[liquidws]

i am having problems with my header image. i am using a customized version of the "default" 4.1 template for vivvo. right now the header image is 170 pixels in height, i would like to change it to 240 pixels in height..

i cant seem to find where in the css i could adjust this. what i am doing is adding the banner manager in the code to replace the image, so that the user gets a new image on refresh. anyway, when i add the code the image (240 height) covers up the menu and search. any ideas on this??

here is the code i am using to attempt the header with the banner manager..


===============================

<div id="header">

<!--<vte:include file="{VIVVO_TEMPLATE_DIR}box/pages.tpl" />-->

<vte:load module="box_banners" search_zone_id="20" />

<vte:include file="{VIVVO_TEMPLATE_DIR}box/dhtml_menu.tpl" />

<vte:include file="{VIVVO_TEMPLATE_DIR}box/search.tpl" />

</div>

===============================

i have also tried wrapping the banner manager code with <div> tags and that isnt working either

please help..

[Micha]

Could you post URL of your website?
Or if you don't want to share it, you can send me PM with URL so I can take a look and give you some solutions :)
You probably need just to adjust height of #header ID, but I'd rather take a look with Firebug.

[liquidws]

no prob..

www.laredobucks.com/home

thanks micha

[liquidws]

ya, i was looking at it with Firebug also, but becuase of the compress.php, i cant seem to pin point what css file is controlling this.

[Micha]

Ok, here goes (of course, the template is header.tpl:)).

When you are including banner, make sure you place the code within <div class="header_image"> div, so the structure would be something like this:

<div id="header">
<!--<vte:include file="{VIVVO_TEMPLATE_DIR}box/pages.tpl" />-->
<div class="header_image">
<vte:load module="box_banners" search_zone_id="20" />
</div>
<vte:include file="{VIVVO_TEMPLATE_DIR}box/dhtml_menu.tpl" />
<vte:include file="{VIVVO_TEMPLATE_DIR}box/search.tpl" />
</div>

There is already border bottom within that class
.header_image { border-bottom: 1px solid #fff;}
And from what I can see, it's located in css/style.css file, right under big /*************** HEADER STYLES ***************/ comment.

You can add 240px height property to that class, so it will look like this:

.header_image { border-bottom: 1px solid #fff; height:240px;}

That should solve your problem, and if you want to ensure that nothing goes beyond that height, add overflow:hidden property also.

Oh, and remove 240px height from #header ID, you won't be needing that anymore :)

Hope that helps.

[Micha]

ya, i was looking at it with Firebug also, but becuase of the compress.php, i cant seem to pin point what css file is controlling this.

You can temporarily disable compress.php file when doing something on your site.
Simply change the name to compress.php.disabled or compressdsb.php or whatever you like to call him :)
That way you'll disable it, and you can use firebug normally.
When you finish, simply revert it back to compress.php.

[rajagiri]

my idea we can use the gif or jpg image it is also nice.

[queenpro]

How to me can use plugin browse by letters

like same my attack,i'm use tpl_4024 themes.

Thanks !

(sorry me can't permission open new thread)