Login Page Layout

05 Mar 2007, 15:08

#1

New Zenner

Join Date:: Feb 2007
Posts:: 14
Plugin Contributions:: 0

Login Page Layout

What pages do I need to look at to change the layout of the log in page and create account page? If you check these links you can see what's going on. It looks like maybe something is jacked up in the css? The center column is shoving my right column off the page in the second link. I have installed the split log in mod and the Anti bot mod. I did revert to a backup of my files and these pages look like this without the mods.

http://hotrodlures.com/store/index.php?main_page=login

http://hotrodlures.com/store/index.php?main_page=create_account&action=process

Thanks.

05 Mar 2007, 16:41

#2

clydejones

Deceased

Join Date:: Nov 2005
Posts:: 7,017
Plugin Contributions:: 12

Re: Login Page Layout

You're using the split page login mod.

This mod is no longer supported since version 1.3.7 incorporates the split page by default.

But looking at your site, I'd say right off hand that the "legend" text in both boxes is too long to fit inside the boxes.

Returning Customers: Please Log In could be changed to just Please Log In

New? Please Provide Your Billing Information could be changed to Your Billing Information

05 Mar 2007, 18:53

#3

boognish

New Zenner

Join Date:: Feb 2007
Posts:: 14
Plugin Contributions:: 0

Re: Login Page Layout

O.K. I got rid of the split page log in mod, thanks for that tip! It started to look better right away.

It looks like my right column has shifted to the left on this page and the login boxes look a little funky.
http://hotrodlures.com/store/index.php?main_page=login

This page is still messed up.
http://hotrodlures.com/store/index.php?main_page=create_account&action=process

05 Mar 2007, 19:43

#4

clydejones

Deceased

Join Date:: Nov 2005
Posts:: 7,017
Plugin Contributions:: 12

Re: Login Page Layout

I looked at the view source of your site and can't find where your left and right columns have been defined and the width set.

05 Mar 2007, 20:05

#5

boognish

New Zenner

Join Date:: Feb 2007
Posts:: 14
Plugin Contributions:: 0

Re: Login Page Layout

I looked at the view source of your site and can't find where your left and right columns have been defined and the width set.

O.K. I think I took care of that. (My > were >) The first page looks pretty good. The second page still has problems.

My tpl_main_page and css can be viewed here:

http://www.hotrodlures.com/testing/

05 Mar 2007, 20:58

#6

clydejones

Deceased

Join Date:: Nov 2005
Posts:: 7,017
Plugin Contributions:: 12

Re: Login Page Layout

remove this code that appears at the top of your stylesheet

{
margin:0;
padding:0;
}

again on the create account page, I can't find where your left and right columns have been defined.

05 Mar 2007, 22:58

#7

boognish

New Zenner

Join Date:: Feb 2007
Posts:: 14
Plugin Contributions:: 0

Re: Login Page Layout

clydejones:
again on the create account page, I can't find where your left and right columns have been defined.

O.k. I think I defined my columns for real this time. I was trying to put a static image at the top and bottom of my right and left columns. It looked like I screwed that up and knocked out my column defines. What would be a slick way to add those static images?

Also... when I remove this code my header becomes a jumbled mess.

clydejones:

{
margin:0;
padding:0;
}

06 Mar 2007, 00:41

#8

clydejones

Deceased

Join Date:: Nov 2005
Posts:: 7,017
Plugin Contributions:: 12

Re: Login Page Layout

Open includes/templates/YOUR_TEMPLATE/common/tpl_main_page.php

for the left column, find:

<td id="navColumnOne" class="columnLeft" style="width: <?php echo COLUMN_WIDTH_LEFT; ?>">
<div id="navColumnOneTopWrapper"> </div> 
<?php
 /**
  * prepares and displays left column sideboxes
  *
  */
?>
<div id="navColumnOneWrapper" style="width: <?php echo BOX_WIDTH_LEFT; ?>"><?php require(DIR_WS_MODULES . zen_get_module_directory('column_left.php')); ?></div><div id="navColumnOneBottomWrapper"> </div></td>
<?php
}
?>

Add the portions highlighted in red.

for the right column find:

<td id="navColumnTwo" class="columnRight" style="width: <?php echo COLUMN_WIDTH_RIGHT; ?>">
<div id="navColumnTwoTopWrapper"> </div>
<?php
 /**
  * prepares and displays right column sideboxes
  *
  */
?>
<div id="navColumnTwoWrapper" style="width: <?php echo BOX_WIDTH_RIGHT; ?>"><?php require(DIR_WS_MODULES . zen_get_module_directory('column_right.php')); ?></div><div id="navColumnTwoBottomWrapper"> </div></td>
<?php
}
?>

add the portions highlighted in red.

save the file and upload to your server.

06 Mar 2007, 01:39

#9

boognish

New Zenner

Join Date:: Feb 2007
Posts:: 14
Plugin Contributions:: 0

Re: Login Page Layout

Hey clydejones, thanks for helping me figure this out. :thumbsup:

I started out with your suggestion from the last post and ended coming up with this for the left side and then did the same for the right (ColumnTwo of course):

 <td id="navColumnOne" class="columnLeft" style="width: <?php echo COLUMN_WIDTH_LEFT; ?>">
<div id="navColumnOneTopWrapper" style="width: <?php echo BOX_WIDTH_LEFT; ?>"></div>
<?php
 /**
  * prepares and displays left column sideboxes
  *
  */
?>
<div id="navColumnOneWrapper" style="width: <?php echo BOX_WIDTH_LEFT; ?>"><?php require(DIR_WS_MODULES . zen_get_module_directory('column_left.php')); ?></div>
<div id="navColumnOneBottomWrapper" style="width: <?php echo BOX_WIDTH_LEFT; ?>"></div></td>
<?php

and I did this to put a static banner at the bottom:

?>
<!--eof- banner #6 display -->
<div id="contentMainFooter">
</body>

06 Mar 2007, 03:11

#10

clydejones

Deceased

Join Date:: Nov 2005
Posts:: 7,017
Plugin Contributions:: 12

Re: Login Page Layout

Boognish:
Hey clydejones, thanks for helping me figure this out. :thumbsup:


<div id="contentMainFooter"></div>
</body>[/code]

don't forget to close the div.

06 Mar 2007, 03:17

#11

clydejones

Deceased

Join Date:: Nov 2005
Posts:: 7,017
Plugin Contributions:: 12

Re: Login Page Layout

You don't need the highlighted tags here: Delete them.


</tr>
<tr/>
<div id="contentMainFooter"></div>

06 Mar 2007, 17:42

#12

boognish

New Zenner

Join Date:: Feb 2007
Posts:: 14
Plugin Contributions:: 0

Re: Login Page Layout

Yep! I got rid of the <tr> tags and closed that <div>. Thanks again for all your help.

p.s. I also installed your link manager mod. Nice work!