Very critical page layout issues

[Graphic Content]

ok try replacing with this

<?php
/**
 * Common Template - tpl_header.php
 *
 * this file can be copied to /templates/your_template_dir/pagename<br />
 * example: to override the privacy page<br />
 * make a directory /templates/my_template/privacy<br />
 * copy /templates/templates_defaults/common/tpl_footer.php to /templates/my_template/privacy/tpl_header.php<br />
 * to override the global settings and turn off the footer un-comment the following line:<br />
 * <br />
 * $flag_disable_header = true;<br />
 *
 * @package templateSystem
 * @copyright Copyright 2003-2006 Zen Cart Development Team
 * @copyright Portions Copyright 2003 osCommerce
 * @license http://www.zen-cart.com/license/2_0.txt GNU Public License V2.0
 * @version $Id: tpl_header.php 4813 2006-10-23 02:13:53Z drbyte $
 */
?>

<?php
  // Display all header alerts via messageStack:
  if ($messageStack->size('header') > 0) {
    echo $messageStack->output('header');
  }
  if (isset($_GET['error_message']) && zen_not_null($_GET['error_message'])) {
  echo htmlspecialchars(urldecode($_GET['error_message']));
  }
  if (isset($_GET['info_message']) && zen_not_null($_GET['info_message'])) {
   echo htmlspecialchars($_GET['info_message']);
} else {

}
?>


<!--bof-header logo and navigation display-->
<?php
if (!isset($flag_disable_header) || !$flag_disable_header) {
?>

<div id="headerWrapper">
<!--bof-navigation display-->
<!--eof-navigation display-->

<!--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>

[b]<div id="loginBox">
    <ul class="back">
    <li><?php echo '<a href="' . HTTP_SERVER . DIR_WS_CATALOG . '">'; ?><?php echo HEADER_TITLE_CATALOG; ?></a></li>
    <?php if ($_SESSION['customer_id']) { ?>
    <li><a href="<?php echo zen_href_link(FILENAME_LOGOFF, '', 'SSL'); ?>"><?php echo HEADER_TITLE_LOGOFF; ?></a></li>
    <li><a href="<?php echo zen_href_link(FILENAME_ACCOUNT, '', 'SSL'); ?>"><?php echo HEADER_TITLE_MY_ACCOUNT; ?></a></li>
    <?php
      } else {
        if (STORE_STATUS == '0') {
    ?>
    <li><a href="<?php echo zen_href_link(FILENAME_LOGIN, '', 'SSL'); ?>"><?php echo HEADER_TITLE_LOGIN; ?></a></li>
    <?php } } ?>

    <?php if ($_SESSION['cart']->count_contents() != 0) { ?>
    <li><a href="<?php echo zen_href_link(FILENAME_SHOPPING_CART, '', 'NONSSL'); ?>"><?php echo HEADER_TITLE_CART_CONTENTS; 

    ?></a></li>
    <li><a href="<?php echo zen_href_link(FILENAME_CHECKOUT_SHIPPING, '', 'SSL'); ?>"><?php echo HEADER_TITLE_CHECKOUT; ?></a></li>
    <?php }?>
    </ul>
</div>[/b]

<!--eof-branding display-->

<!--eof-header logo and navigation display-->

<!--bof-optional categories tabs navigation display-->

<?php require($template->get_template_dir('tpl_modules_categories_tabs.php',DIR_WS_TEMPLATE, $current_page_base,'templates'). '/tpl_modules_categories_tabs.php'); ?>

<!--eof-optional categories tabs navigation display-->

<!--bof-header ezpage links-->
<?php if (EZPAGES_STATUS_HEADER == '1' or (EZPAGES_STATUS_HEADER == '2' and (strstr(EXCLUDE_ADMIN_IP_FOR_MAINTENANCE, $_SERVER['REMOTE_ADDR'])))) { ?>
<?php require($template->get_template_dir('tpl_ezpages_bar_header.php',DIR_WS_TEMPLATE, $current_page_base,'templates'). '/tpl_ezpages_bar_header.php'); ?>
<?php } ?>
<!--eof-header ezpage links-->
</div>
<?php } ?>

then add the following to your style sheet -

#loginBox {
float:right;
height:50px;
width:200px;
}

.back {
list-style:none;
}


see if that helps, you may need to restyle your login box. From the screen shot it looks like your current login box is sitting outside the header container?

Send over another screenshot if it doesn't work

Thanks
Matt

[vishalon]

Not Working
Image 1 My original Layout
Image 2 What We got by changing tpl_header.php

I saw your website Its Great... graphiccontent.co.uk/

[Graphic Content]

The first image is what you already had? or is this just a photoshop mock up?

Without being able to see the site online it is very difficult as you have changed the names of certain divs from the originals.

basically if you want the login details to appear on the top right you need to just grab the relevant piece of php and place it in a new div inside that container.

If you can upload what you have already I will be able to help.

Thanks for the comment about the site, I just need to get around to displaying my portfolio on there.

Here is one of my recent zens
www.tshirtplace.co.uk

Let me know if you can get the site online.

Thanks
Matt

p.s. did you download Firebug? it will solve most of your problems.

[vishalon]

Yes Matt

I can upload the site online I already install Zen Cart on my server hostmoster.com

But I will be not able to upload today because I have to go for dinner. If you don't mind then can you visit tomorrow. 1st image is Photoshop mock.

I downloaded Firebug and installed.

Regards
Vishal Deb

[gjh42]

You want the login box (the actual input fields) at the top of the #logoWrapper div so it can float right and rise to the top. Replace the comment
<!-- here is the place to call the login code -->
with the actual login code.
You want the #navMainWrapper div completely below #logoWrapper.

The .back class is used all over the place, so you don't want to globally alter it. If you want to alter it in a particular element where you are editing code anyway, just change the class reference; otherwise, specify where you want to affect it like
#navMain .back {list-style: none;}

<?php
/**
 * Common Template - tpl_header.php
 *
 * this file can be copied to /templates/your_template_dir/pagename<br />
 * example: to override the privacy page<br />
 * make a directory /templates/my_template/privacy<br />
 * copy /templates/templates_defaults/common/tpl_footer.php to /templates/my_template/privacy/tpl_header.php<br />
 * to override the global settings and turn off the footer un-comment the following line:<br />
 * <br />
 * $flag_disable_header = true;<br />
 *
 * @package templateSystem
 * @copyright Copyright 2003-2006 Zen Cart Development Team
 * @copyright Portions Copyright 2003 osCommerce
 * @license http://www.zen-cart.com/license/2_0.txt GNU Public License V2.0
 * @version $Id: tpl_header.php 4813 2006-10-23 02:13:53Z drbyte $
 */
?>

<?php
  // Display all header alerts via messageStack:
  if ($messageStack->size('header') > 0) {
    echo $messageStack->output('header');
  }
  if (isset($_GET['error_message']) && zen_not_null($_GET['error_message'])) {
  echo htmlspecialchars(urldecode($_GET['error_message']));
  }
  if (isset($_GET['info_message']) && zen_not_null($_GET['info_message'])) {
   echo htmlspecialchars($_GET['info_message']);
} else {

}
?>


<!--bof-header logo and navigation display-->
<?php
if (!isset($flag_disable_header) || !$flag_disable_header) {
?>

<div id="headerWrapper">

<!--bof-branding display-->
<div id="logoWrapper">

<div id="loginBox">
<!-- here is the place to call the login code -->
</div>

    <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>
</div>
<!--eof-branding display-->

<!--bof-navigation display-->
<div id="navMainWrapper">
<div id="navMain">
    <ul class="back">
    <li><?php echo '<a href="' . HTTP_SERVER . DIR_WS_CATALOG . '">'; ?><?php echo HEADER_TITLE_CATALOG; ?></a></li>
<?php if ($_SESSION['customer_id']) { ?>
    <li><a href="<?php echo zen_href_link(FILENAME_LOGOFF, '', 'SSL'); ?>"><?php echo HEADER_TITLE_LOGOFF; ?></a></li>
    <li><a href="<?php echo zen_href_link(FILENAME_ACCOUNT, '', 'SSL'); ?>"><?php echo HEADER_TITLE_MY_ACCOUNT; ?></a></li>
<?php
      } else {
        if (STORE_STATUS == '0') {
?>
    <li><a href="<?php echo zen_href_link(FILENAME_LOGIN, '', 'SSL'); ?>"><?php echo HEADER_TITLE_LOGIN; ?></a></li>
<?php } } ?>

<?php if ($_SESSION['cart']->count_contents() != 0) { ?>
    <li><a href="<?php echo zen_href_link(FILENAME_SHOPPING_CART, '', 'NONSSL'); ?>"><?php echo HEADER_TITLE_CART_CONTENTS; ?></a></li>
    <li><a href="<?php echo zen_href_link(FILENAME_CHECKOUT_SHIPPING, '', 'SSL'); ?>"><?php echo HEADER_TITLE_CHECKOUT; ?></a></li>
<?php }?>
</ul>
</div>
<div id="navMainSearch"><?php require(DIR_WS_MODULES . 'sideboxes/search_header.php'); ?></div>
<br class="clearBoth" />
</div>
<!--eof-navigation display-->
<!--eof-header logo and navigation display-->

<!--bof-optional categories tabs navigation display-->

<?php require($template->get_template_dir('tpl_modules_categories_tabs.php',DIR_WS_TEMPLATE, $current_page_base,'templates'). '/tpl_modules_categories_tabs.php'); ?>

<!--eof-optional categories tabs navigation display-->

<!--bof-header ezpage links-->
<?php if (EZPAGES_STATUS_HEADER == '1' or (EZPAGES_STATUS_HEADER == '2' and (strstr(EXCLUDE_ADMIN_IP_FOR_MAINTENANCE, $_SERVER['REMOTE_ADDR'])))) { ?>
<?php require($template->get_template_dir('tpl_ezpages_bar_header.php',DIR_WS_TEMPLATE, $current_page_base,'templates'). '/tpl_ezpages_bar_header.php'); ?>
<?php } ?>
<!--eof-header ezpage links-->
</div>
<?php } ?>

[vishalon]

Hi GJH

I can't get you. Should I replace the whole PHP code to tpl_header file. And what this line means
Replace the comment
<!-- here is the place to call the login code -->
with the actual login code.

Thank you for consideration

[vishalon]

Well GJH
I inserted the login code which as follow where you told me to insert <!-- here is the place to call the login code -->
Am I right, please guide me

<div id="loginBox">
    <ul class="back">
    <li><?php echo '<a href="' . HTTP_SERVER . DIR_WS_CATALOG . '">'; ?><?php echo HEADER_TITLE_CATALOG; ?></a></li>
    <?php if ($_SESSION['customer_id']) { ?>
    <li><a href="<?php echo zen_href_link(FILENAME_LOGOFF, '', 'SSL'); ?>"><?php echo HEADER_TITLE_LOGOFF; ?></a></li>
    <li><a href="<?php echo zen_href_link(FILENAME_ACCOUNT, '', 'SSL'); ?>"><?php echo HEADER_TITLE_MY_ACCOUNT; ?></a></li>
    <?php
      } else {
        if (STORE_STATUS == '0') {
    ?>
    <li><a href="<?php echo zen_href_link(FILENAME_LOGIN, '', 'SSL'); ?>"><?php echo HEADER_TITLE_LOGIN; ?></a></li>
    <?php } } ?>

    <?php if ($_SESSION['cart']->count_contents() != 0) { ?>
    <li><a href="<?php echo zen_href_link(FILENAME_SHOPPING_CART, '', 'NONSSL'); ?>"><?php echo HEADER_TITLE_CART_CONTENTS; 

    ?></a></li>
    <li><a href="<?php echo zen_href_link(FILENAME_CHECKOUT_SHIPPING, '', 'SSL'); ?>"><?php echo HEADER_TITLE_CHECKOUT; ?></a></li>
    <?php }?>
    </ul>
</div>

[gjh42]

That is not the login code; it is the entire navigation code. The only part of it that relates to login is

<a href="<?php echo zen_href_link(FILENAME_LOGIN, '', 'SSL'); ?>"><?php echo HEADER_TITLE_LOGIN; ?></a>

and this is only a link that goes to the login page, it is not code for the username and password input fields.

The tpl_header.php that you posted does not contain the code to make the input fields, and I'm not sure where they are coming from in your page code.

[vishalon]

Ok
I made these changes in
C:/xampplite/htdocs/oemxtrade/includes/languages/english/html_includes/classic/define_main_page.php

Which is giving this output.

Please see the code of C:/xampplite/htdocs/oemxtrade/includes/languages/english/html_includes/classic/define_main_page.php

<div id="main">
<div id="header">

<div id="logoarea">
<div id="logo"></div>
<div id="login">
  <div style="float: left; color: rgb(54, 57, 61); padding-top: 0pt; padding-bottom: 0pt; padding-left: 0px; width: 210px; text-align: right; line-height: 2px;">
  Username 
    <input type="text" name="textfield" id="textfield" />

  Password  
    <input type="text" name="textfield2" id="textfield2" /></div>
	<div style="margin-left: 213px; margin-top: 20px;">
    <img height="22" width="22" src="images/bu.jpg" /></div> 
	
	</div>

</div>
<div id="menu">
		<ul>
			<li class="current_page_item"><a href="index.html">Home</a></li>
			<li><a href="#">About Us </a></li>
			<li><a href="oem_login.html">Login</a></li><li><a href="#">Partners</a></li>

			<li><a href="#">Community</a></li>
			<li><a href="#">Contact Us </a></li>
		</ul>
		<div></div>
  </div>
</div>
<table width="100%" cellspacing="0" cellpadding="0" border="0">
  <tbody><tr>


    <td><div align="center"><img height="250" width="960" src="includes/templates/classic/images/oemheader.jpg" /></div></td>

  </tr>
</tbody></table>

<div id="cantaner">
  <table width="100%" cellspacing="0" cellpadding="0" border="0">
    <tbody><tr>
      <td width="69%" valign="top" align="left" class="normaltext"><table width="100%" cellspacing="0" cellpadding="0" border="0">
        <tbody><tr>
          <td>&nbsp;</td>
        </tr>

      </tbody></table>
        <p><strong>All it needs is Simple Inventory Management !</strong></p>
        <p><br />
          www.oemXtrade.com is the answer to convert excess inventory into cash. Welcome to OemXtrade a global clearing house for OEM excess Electronic Components. Integrity, value and innovation are the forces that drive our success. We are the choice for trusted OEM sources. </p>
        <p><br />
          OemXtrade is defining the way Excess Inventory is managed in today's smart global marketplace. Learn how to save the environment and increase your bottom line with our simple solution.</p>
        <p><br />

          Pro-active companies will achieve significant results by managing excess inventory before it becomes worthless. OemXtrade provides an avenue for use of excess inventory. Using our website your SCM will be armed with the tools to make smart and profitable business decisions.</p>
        <p><br />
          It's easy to get started, and we provide a secure, low risk, platform to deliver increased ROI on inventory you already own. Small gains in ROI can deliver a signficant increase to your company's bottom line. There are several ways to engage and benefit from our solutions. And it helps save and manage our global resources too.</p>
        <p><br />
        <br />
          </p>
        </td>
      <td width="31%" valign="top" align="left"><div id="notice"><div style="padding-left: 20px; padding-top: 10px; font-size: 14px; font-family: Arial; font-weight: 800; color: rgb(51, 51, 51);">Register For <font color="#ff0000">Free </font>Today</div>

	  <div style="margin-top: 10px; padding-top: 10px; padding-left: 20px; padding-right: 10px;">
	    <p>Search our database of over 10</p>
	    <p>million part</p>
	    <p>&nbsp;</p>
	    <p>View Part from hundreds of distributor</p>
	    <p>with just one click</p>
	    </div>

	   <div style="margin-top: 3px; padding-top: 10px; padding-left: 20px; padding-right: 10px;"><a href="login.html"><img height="24" width="105" border="0" src="images/home-pad-btn-reg.gif" /></a></div>
      </div>
	    <div style="margin-left: 30px; margin-right: 30px; margin-top: 10px; background-color: rgb(255, 255, 204); padding: 10px; text-align: justify;">www.oemXtrade.com is the answer to convert excess inventory into cash. </div></td>
    </tr>
    <tr>
      <td>&nbsp;</td>
      <td>&nbsp;</td>
    </tr>

  </tbody></table>
 
  </div>
<div id="footer"><div id="footerarea" class="footertext">
	    <p><a href="#">Home</a>  | 
	      <a href="#">About Us </a> |
	      <a href="#">Sellers</a> |
	      <a href="#">Buyers</a> |
	      <a href="#">OemXtrade</a> |		 
	      <a href="#">Partners</a> |
        <a href="#">Community</a> |	
		 <a href="#">Community</a> |	Contact Us     </p>

	    <p>       
		        
		       Copyright © 2009-2010 <strong>OEMXTRADE</strong>.
	      All Rights Reserved. Privacy Policy </p>
</div></div>
</div>

I hope this will give us turn in our way to find solution

[gjh42]

Do you want that login box only on the home page? That is the only place define_main_page.php operates, and it is not meant to display the header (unless you disable the standard header and have a different one just for the home page).

If you want the header to have the login box or logo on all pages, put the code in tpl_header.php.