easy simplify checkout mod

bobcc99 · #1 02-24-2005, 01:50 AM

Hi All,

This was some simple mods I have done for X-Cart 4.11, to make the checkout neater. I post it here in case it is useful to anyone starting out.

In summary, I have changed the title of the first block of registering for profile or checkout to Customer Details, have removed URL, Fax, Company fields and brought the Phone and Email up to this block as well as some other formatting. Also removed the multiple fields for first and last name so there is just the one. Any alternative ways of doing this I'd be interested to here about.

** CHANGE TEXT "PERSONAL INFORMATION (register/checkout)**
In Admin, go to Languages, select English.
Wait for page refresh. Select Labels and type in "Personal Information"
Change this text to 'Customer Details' and click Apply Changes

** REGISTER PAGE - COMBINE CONTACT FIELDS WITH CUSTOMER DETAILS **
In customer/main/register.tpl find this code
{include file="main/register_contact_info.tpl" userinfo=$userinfo}
move to below {include file="main/register_personal_info.tpl" userinfo=$userinfo}
Open main/register_contact_info.tpl and remove the header row <tr> and associated code </tr>

** REGISTER/CHECKOUT PAGES - HIDE BILLING/SHIPPING INFORMATION FIRSTNAME LASTNAME **
Do this if you want to use the firstname lastname fields as identical for
registering, shipping and billing
Open main/register_shipping_address.tpl

Find this code:
----------------------------------------------------------------------------

Code:

{if $default_fields.firstname.avail eq 'Y'}
<TR>
<TD align="right">{$lng.lbl_first_name}</TD>
<TD>{if $default_fields.firstname.required eq 'Y'}<FONT class="Star">*</FONT>{else}{/if}</TD>
<TD nowrap> 
<INPUT type="text" name="s_firstname" size="32" maxlength="32" value="{$userinfo.s_firstname}">
{if $reg_error ne "" and $userinfo.s_firstname eq "" && $default_fields.firstname.required eq 'Y'}<FONT class="Star">&lt;&lt;</FONT>{/if}
</TD>
</TR>
 {/if}

{if $default_fields.lastname.avail eq 'Y'}
<TR>
<TD align="right">{$lng.lbl_last_name}</TD>
<TD>{if $default_fields.lastname.required eq 'Y'}<FONT class="Star">*</FONT>{else}{/if}</TD>
<TD nowrap>
<INPUT type="text" name="s_lastname" size="32" maxlength="32" value="{$userinfo.s_lastname}">
{if $reg_error ne "" and $userinfo.s_lastname eq "" && $default_fields.lastname.required eq 'Y'}<FONT class="Star">&lt;&lt;</FONT>{/if}
</TD>
</TR>
{/if}

------------------------------------------------------------------------------
REPLACE WITH

Code:

<INPUT type="hidden" name="s_firstname" size="32" maxlength="32" value="{$userinfo.s_firstname}">
<INPUT type="hidden" name="s_lastname" size="32" maxlength="32" value="{$userinfo.s_lastname}">

REPEAT FOR BILLING
Open main/register_billing_address.tpl

Find two table rows containing first last name fields as above
and replace with

Code:

<INPUT type="hidden" name="b_firstname" size="32" maxlength="32" value="{$userinfo.b_firstname}">
<INPUT type="hidden" name="b_lastname" size="32" maxlength="32" value="{$userinfo.b_lastname}">

Open main/register_personal_info.tpl
Find INPUT fields for firstname and lastname
ADD THIS CODE to end of tag

Code:

onChange="populateProfile()"

Open common_js.tpl
Add this function

Code:

function populateProfile() {
document.registerform.s_firstname.value = document.registerform.firstname.value;
document.registerform.s_lastname.value = document.registerform.lastname.value;
document.registerform.b_firstname.value = document.registerform.firstname.value;
document.registerform.b_lastname.value = document.registerform.lastname.value
}

To maintain "leave empty if same as billing" message before registering
open main/register_shipping_address.tpl
find

Code:

{if !$is_s_fields}({$lng.lbl_leave_empty_if_same_as_b_address}){/if}

replace with

Code:

{if $login eq ""}({$lng.lbl_leave_empty_if_same_as_b_address}){/if}

** CHECKOUT PAGE 3 **
To simplify information on this page...
customer/main/cart_details -

find
{if $cart.products and $have_products eq "Y"} lines 77 and 99
comment out * these and their respective end tags

customer/main/customer_details.tpl
format/remove unused fields like fax, company name fields etc.

customer/main/checkout_notes.tpl
do some formatting here

bob

KCAutosound · #2 02-24-2005, 02:54 PM

link to an example of this?

bobcc99 · #3 02-24-2005, 11:44 PM

Can't link as its a private site, but kind of goes like this:

Checkout Page 1

Customer Details
--------------------------------------
First Name: [ ]
Last Name: [ ]
Phone: [ ]
Email: [ ]

etc. etc.

Billing Details
--------------------------------------
no First Name Last Name fields - rest as normal

Shipping Details
--------------------------------------
no First Name Last Name fields - rest as normal

On checkout page 3
I have removed the notes below the items
and formatted the long confirmation details text into a 3 col table
+ some other stuff

mustang · #4 03-25-2005, 06:35 AM

Thanks again Bob.

I just implemented a slightly different version of this idea on a client site using your instructions. Seems to have worked like a charm!

I did away with the separate Customer Details area and combined the Contact Details area with the Billing Info area. I left the Shipping Firstname/Lastname in place to allow for gift orders to be addressed to person other than the purchasing customer.

Here's a screenshot.

http://www.xcartmods.com/screenshots/checkout1.gif

CobaltCat · #5 05-08-2005, 12:37 AM

mustang - how did you do your mod? I am setting up 4.0.13 and requiring the customer to put their first and last name in three different times, even if it's being shipped to the same info as the billing, is irritating. And taking the required off the first & last name fields is not satisfactory.

Any good mods out there?

Thanks!

IndieDepot · #6 05-19-2005, 04:53 PM

Yes Mustang,

I would like to know how you did that as well.

- Shannon

hzellers · #7 05-24-2005, 09:38 PM

I agree! Can you take a few moments to share? As refined as 4.012 is, it seems odd that they thought requiring a name 3 times without the option to "Check box if blah blah is the same" was a plus. But, oh well, if we can scramble to fix it, great!

Thank you!

kevin02 · #8 05-27-2005, 09:10 PM

Looking forward to the future home of xcartmods.com

youngvet1 · #9 10-02-2005, 08:37 AM

Its very odd that they STILL have not fixed this.

What are they thinking!
How is a persons name different than a persons name under the billing address??

If that is the case than te owner of the credit card is not making the purchase. I mean come on who came up with this??

The way it should be done is like similar to mustang.

put phone and email as part of billing
elimianate personal details
as it should be assumed and itr is the LAW that personal details of the person making the transaction is the one whose billing info.

Then they should go with convention,
with a checkbox if shipping is the same as billing.

flyingsaucer · #10 10-10-2005, 03:32 PM

Look at overstock.com's checkout steps. Very easy, very uncluttered and minimal info on screen. Oh by the way they have the copy billing address to shipping address checkmark.

It is also unnecessary to ask the user to create a username since they already have an email address entered. Does it not make it easier to remember for the user?

I think the bottomline is:
The less info you ask the user to fill out, the less abandoned carts we will have.

I am thinking of modifying my checkout pages in the coming days and if I can come up with something easierto use, I sure will share.

[Yes, I am aware of the easy checkout mod ($99 one) and it is not exactly what I need either.]