mr.chetanladdha:
Thanks a lot Anne ! It was that simple ! :)
To remove the space between the top navigation bar, I removed the below code from tpl_header.php.
<div id="top-middle">
<div class="onerow-fluid <?php echo $fluidisFixed; ?>">
<!--bof-branding display-->
<div id="logoWrapper">
<div id="logo"><?php echo '<a href="' . HTTP_SERVER . DIR_WS_CATALOG . '">' . zen_image($template->get_template_dir(HEADER_LOGO_IMAGE, DIR_WS_TEMPLATE, $current_page_base,'images'). '/' . HEADER_LOGO_IMAGE, HEADER_ALT_TEXT) . '</a>'; ?>
</div>
<?php if (HEADER_SALES_TEXT != '' || (SHOW_BANNERS_GROUP_SET2 != '' && $banner = zen_banner_exists('dynamic', SHOW_BANNERS_GROUP_SET2))) { ?>
<div id="taglineWrapper">
<?php
if (HEADER_SALES_TEXT != '') {
?>
<div id="tagline">
<?php echo HEADER_SALES_TEXT;?>
</div>
<?php
}
?>
<?php
if (SHOW_BANNERS_GROUP_SET2 != '' && $banner = zen_banner_exists('dynamic', SHOW_BANNERS_GROUP_SET2)) {
if ($banner->RecordCount() > 0) {
?>
<div id="bannerTwo" class="banners"><?php echo zen_display_banner('static', $banner);?></div>
<?php
}
}
?>
</div>
<?php } // no HEADER_SALES_TEXT or SHOW_BANNERS_GROUP_SET2 ?>
<div id="navMainSearch"><?php require(DIR_WS_MODULES . 'sideboxes/search_header.php'); ?></div>
<div class="clearBoth"></div>
</div>
```
>
> This made it look like below :
>
>
>
> Perfect as I would like it. However, there are some minor problems that came up :
>
> 1. The search box disappeared. !!!
> 2. When I open it up on my iphone, there is no header links for categories / contact us / information and other links.
>
> Huff !!!
For the search box, I am going to assume it is in desktop view only. Tablet and mobile devices should be showing the search bar as it uses a separate header file. For the desktop, just look at the code you removed as it contains the search box. Your fix to delete the div to remove the space is 1 way to do it but it does not give you flexibility if you wanted to use that space again. For one, you took away control of having your logo present on your site which is important to give some sort of visual that your customers recognize you by. But if that is not important than just take the snippet of code for the search and place it where you want it.
Keep in mind that since you are now dealing with moving code out of pre-defined blocks that the developer has done, you will have to put the css calls to each instance where you want it. So you will have to put styling in both the main stylesheet and the responsive default files. The latter is not needed if you feel the search box does not interfere on minimizing the desktop view. If you wanted full confrol over the styling, just change the div of navMainSearch to something else. That way you can style it to your liking. Otherwise if you use the same id, just make sure to go through all the css files that use it and change it to your style.
As for your iphone, are you expecting the horizontal navigation to show as in your screenshot? By default, the mobile layout uses a responsive menu so look at the top right for a menu icon. Tap that and the dropdown of selections will appear including your new links you added.
