Adjusting postition of fields in the New Customers / Login Page

[Peace Freak]

I am sure this should be easy but I can't seem to find the css or html that controls the position of the fields in the New Customers / Login Page.

All the fields are aligned correctly to the left except the State/Province field which is sitting in the middle of the page.

If someone let me know where to find the code I would be grateful!

[stevesh]

Styling issues are much easier to troubleshoot when we can see the site.

[Peace Freak]

Thanks in advance!

Here is the page:

http://goo.gl/5XqkG

[Peace Freak]

The URL of the site changed so I have attached a JPG showing the position of the State/Province field.

How can I move the fields to the left to match the other fields?

Thanks!

[RodG]

The URL of the site changed so I have attached a JPG showing the position of the State/Province field.

The .jpg doesn't help. All it does is confirm the problem.

If we had access to your site we'd be able to 'view page source' (something you can also do yourself) and inspect the code to see why it is being formatted the way it is.

A default zenCart installation doesn't have this problem, so something has been changed somewhere. The possibilities are endless.

If it is of any help, the original code portion, with correctly aligned output, reads:

----------------------------------------------------------------------------------------
<input id="city" type="text" maxlength="32" size="33" name="city">
<span class="alert">*</span>
<br class="clearBoth">
<label id="zoneLabel" class="inputLabel" for="stateZone">State/Province:</label>
<select id="stateZone" name="zone_id">
-------------------------------------------------------------------------------------------

How does this compare when you 'view page source' on your errant store?

Cheers
Rod

[Peace Freak]

Thanks for getting back to me on this. Did a search in the store using the Developor's Toolkit but could not find that code is in. Where is that code hiding? Here is a link to the login page: http://store.globalpeace.jp/index.php?main_page=login

Using Page Source, below is what I found in that section,

Thanks!

*************

<label class="inputLabel" for="suburb">Address Line 2:</label>

<input type="text" name="suburb" size = "33" maxlength = "32" id="suburb" />
<br class="clearBoth" />




<label class="inputLabel" for="city">City:</label>

<input type="text" name="city" size = "33" maxlength = "32" id="city" /><span class="alert">*</span>
<br class="clearBoth" />




<label class="inputLabel" for="stateZone">State/Province:</label>

<select name="zone_id" id="stateZone">
<option value="" selected="selected">Please select ...</option>
<option value="205">Aichi - 愛知県</option>
<option value
OTHER STATES REMOVED FOR BREVITY...
<option value="201">Yamanashi - 山梨県</option>
</select>



<label class="inputLabel" for="state"></label>

<input type="text" name="state" value="&nbsp;" size = "33" maxlength = "32" id="state" />&nbsp;<span class="alert">*</span>
<br class="clearBoth" />




<label class="inputLabel" for="postcode">Post/Zip Code:</label>

[RodG]

Thanks for getting back to me on this. Did a search in the store using the Developor's Toolkit but could not find that code is in.

You'll probably not find the full/exact code in question via the Developers toolkit. You'll need to narrow your search query to something less specific.

Where is that code hiding?

Using Page Source, below is what I found in that section,

<label class="inputLabel" for="stateZone">State/Province:</label>
<select name="zone_id" id="stateZone">
< snip >
<label class="inputLabel" for="state"></label>
<input type="text" name="state" value="&nbsp;" size = "33" maxlength = "32" id="state" />&nbsp;<span class="alert">*</span>
<br class="clearBoth" />

The line I've highlighted in blue is where the apparent mis-alignment is coming from, and a cursory look at the code indicates that this is related to the configuration->customer_details
'State' and 'State - Always display as pulldown'? settings (and/or the css styles relating to whether they are hidden or not. The empty space causing the misalignment is actually a hidden field. (not hidden well enough, apparently) <g>

Hopefully knowing the problem will lead to a solution :)

Cheers
Rod

ps. What version of Zen are you running? This could be and old bug long fixed as far as I know.

[Peace Freak]

Thanks for your sleuthing with this...

I recently upgraded to version 1.5.1. (This problem could have been in the pre-upgrade version...)

I take it that simply deleting that line of code will not be enough, or will it?

I searched for this line of code:

<label class="inputLabel" for="state">

using the Dev. Tool Kit and found the code appears in two files:

includes/templates/my_template01/templates/tpl_modules_address_book_details.php
and
includes/templates/my_template01/templates/tpl_modules_create_account.php

The line of text in those two files looks like this:

<label class="inputLabel" for="state"><?php echo $state_field_label; ?></label>

I basically don't know about php so I am not sure what I need to be looking for or changing...

If you can give me some further pointers that would be appreciated!

Thanks!

[RodG]

I take it that simply deleting that line of code will not be enough, or will it?

I can't in good conscience give an answer to that. It may be all you need to do, it may not be. There may be unexpected consequences or it may be a perfectly safe 'fix'. I'm not familiar enough with that part of the underlying code to make this determination.

What I can say though is that if you did delete that line of code (making sure you have a backup 1st) you would have already answered your own question.

I basically don't know about php so I am not sure what I need to be looking for or changing...

If you can give me some further pointers that would be appreciated!

I feel I've given you enough information to see you on your way... Sooner or later you'll need to learn how to take the next baby steps towards site maintenance/development, and being little more than cosmetic in nature, this is a good a time as any to get your hands dirty <smiles>

Trust me, you'll learn far more from simply *trying* things like deleting an apparent line of troublesome code and seeing the effects than you could ever hope to learn by just 'looking' at the code. This is why I can't in good conscience give an answer to your question. Looking at the code tells me one thing, it is only when I actually make the changes will I be be able to be confident that 1) it does what is expected, and 2) it doesn't have any adverse side effects.

The thing is, the problem doesn't exist on my site(s) so it would be pointless me making the changes anyway.

FURTHERMORE. If if this does 'fix' the problem, one then has to wonder, how, when, where and what caused it to break in the 1st place? This is yet *another* reason why I'm not confident that simply deleting that line of code is the *right* thing to do. It could be hiding a more serious underlying issue (not that I actually think this is the case).

OTOH, if it does fix the problem, with no adverse effects, then technically, the 'fix' will be perfectly correct and valid. It'll just leave a bit of an unsolved mystery. I don't like those.

Anyway, back to you....

Cheers
Rod

ps. did you try changing any of the 'state' settings from admin? Did they have *any* affect at all? (they should have).

[Peace Freak]

Well, great news Rod, deleting that line of code did the trick!

I have made new accounts in the New Customers page (In English and in Japanese) and all seems to be fine. I have also checked the Update Address Book Entry page (within the My Account area for each customer) and the fields and labels are sitting where they should be and all works fine.

Your advice was excellent, thank you. I was reluctant to touch that code and the possible consequences.

Unfortunately (or fortunately!), I didn't have to get my hands too dirty but fixing it was what I was after and my goal has been achieved!

I have the feeling that piece of code was introduced (or not removed) by someone who was adjusting things for the Japanese side of my site. In the early days (2006 or 7), there were many problems with the order of names etc. and I had to rely on other Japanese cart users for their help and their customized files.

Did not try changing the State settings from the Admin as now it is fine...

Thank you for your time on this! It is really great to have the store looking the way it should!