Follow us on Twitter X-Cart on Facebook Wiki
Shopping cart software Solutions for online shops and malls
 

A simple fix to pretty the checkout up a little

 
Reply
   X-Cart forums > X-Cart 4 > Dev Questions
 
Thread Tools Search this Thread
  #1  
Old 06-01-2006, 11:34 AM
 
Grant Grant is offline
 

Senior Member
  
Join Date: Apr 2006
Posts: 171
 

Default A simple fix to pretty the checkout up a little

That horrid customer details page on the last page of the checkout was hurting my eyes so I had a play around and came up with this. I've still got a lot of stuff to workout on this page for my site but i thought i'd post this up before I start making too many modifications and it's too hard to back track...

I've left out a few things like the email address and the extra fields call codes but if you need them in there just copy & paste them into this script from your customer_details.tpl

Hope it's useful to somebody

Here's how the standard customer_details.tpl displays :

http://www.wyzeshop.com/screenshot10.gif

Here's how this new sexy one looks :

http://www.wyzeshop.com/screenshot9.gif

Here's how you do it :

1. Create a new file - skin1/customer/main/sexy_customer_details.tpl and put this inside it :


Quote:
{* $Id: sexy_customer_details.tpl,v 1 2006/06/01 15:15:52 max Exp $ *}
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td><div class="sidebox">
<div class="boxhead"><h2>{$lng.lbl_billing_address}</h2></div>
<div class="boxbody">


{if $userinfo.default_fields.firstname}{$userinfo.b_fi rstname}{if
$userinfo.default_fields.lastname} {$userinfo.b_lastname}{/if}{/if}

{if $userinfo.default_fields.b_address}{$userinfo.b_ad dress}{/if}{if
$userinfo.b_address_2}

{$userinfo.b_address_2}{/if}

{if $userinfo.default_fields.b_city}{$userinfo.b_city} {/if}

{if $userinfo.default_fields.b_state}{$userinfo.b_stat ename} {/if}


{if $userinfo.default_fields.b_country}{$userinfo.b_co untryname} {/if}

{if $userinfo.default_fields.b_zipcode}{$userinfo.b_zi pcode} {/if}
</div>
</div></td>
<td><div class="sidebox">
<div class="boxhead"><h2>{$lng.lbl_shipping_address}</h2></div>
<div class="boxbody">


{if $userinfo.default_fields.firstname}{$userinfo.s_fi rstname}{if
$userinfo.default_fields.lastname} {$userinfo.s_lastname} {/if}{/if}

{if $userinfo.default_fields.s_address}{$userinfo.s_ad dress} {/if}
{if $userinfo.s_address_2}

{$userinfo.s_address_2} {/if}

{if $userinfo.default_fields.s_city}{$userinfo.s_city} {/if}

{if $userinfo.default_fields.s_state}{$userinfo.s_stat ename} {/if}

{if $userinfo.default_fields.s_country}{$userinfo.s_co untryname} {/if}

{if $userinfo.default_fields.s_zipcode}{$userinfo.s_zi pcode} {/if}

</div>
</div></td>
</tr>
</table>

2. Open skin1.css & add the following code right at the bottom :

Quote:
.sidebox {
margin: 0 auto;
width: 28em;
background: url(images/sbbody-r.gif) no-repeat bottom right;
font-size: 100%;
}
.boxhead {
background: url(images/sbhead-r.gif) no-repeat top right;
margin: 0;
padding: 0;
text-align: left;
}
.boxhead h2 {
background: url(images/sbhead-l.gif) no-repeat top left;
margin: 0;
padding: 22px 30px 5px;
color: white;
font-weight: bold;
font-size: 1.2em;
line-height: 1em;
text-shadow: rgba(0,0,0,.4) 0px 2px 5px;
}
.boxbody {
background: url(images/sbbody-l.gif) no-repeat bottom left;
margin: 0;
padding: 5px 30px 31px;
}

3. Download the following 4 images and put them in your images directory.

http://www.wyzeshop.com/xcartforum/sbbody-l.gif
http://www.wyzeshop.com/xcartforum/sbbody-r.gif
http://www.wyzeshop.com/xcartforum/sbhead-l.gif
http://www.wyzeshop.com/xcartforum/sbhead-r.gif

4. Open skin1/customer/main/checkout.tpl

Find :
Quote:
{include file="customer/main/customer_details.tpl"}

Replace with :
Quote:
{include file="customer/main/sexy_customer_details.tpl"}

Best thing about this little mod = if you don't like it just undo step 4 and it will all go back to how it was before
__________________
X-Cart version : 4.0.18
Mod : Customer Also Bought
Mod : Custom catergory Templates
Mod : Custon Product Templates
Reply With Quote
  #2  
Old 06-01-2006, 12:02 PM
 
balinor balinor is offline
 

Veteran
  
Join Date: Oct 2003
Location: Connecticut, USA
Posts: 30,253
 

Default

Sexy..now there is a word not often associated with X-Cart! Moving to Custom Mods.
__________________
Padraic Ryan
Ryan Design Studio
Professional E-Commerce Development
Reply With Quote
  #3  
Old 06-01-2006, 12:13 PM
 
Grant Grant is offline
 

Senior Member
  
Join Date: Apr 2006
Posts: 171
 

Default

Haha, I swear to God i'm gonna get my checkout looking so hot I'm gonna have to start selling soiled panties :P
__________________
X-Cart version : 4.0.18
Mod : Customer Also Bought
Mod : Custom catergory Templates
Mod : Custon Product Templates
Reply With Quote
  #4  
Old 06-02-2006, 05:19 PM
 
vulcan-works vulcan-works is offline
 

Senior Member
  
Join Date: Feb 2004
Posts: 143
 

Default Re: A simple fix to pretty the checkout up a little

Quote:
Originally Posted by Grant
4. Open skin1/main/customer/checkout.tpl

you mean skin1/customer/main/checkout.tpl right?
__________________
X-cart--4.7.12

vulcanworks.net
Reply With Quote
  #5  
Old 06-03-2006, 02:17 AM
  Dongan's Avatar 
Dongan Dongan is offline
 

X-Wizard
  
Join Date: Jul 2005
Location: www.mercuryminds.com
Posts: 1,531
 

Default Re: A simple fix to pretty the checkout up a little

Quote:
Originally Posted by vulcan-works
Quote:
Originally Posted by Grant
4. Open skin1/main/customer/checkout.tpl

you mean skin1/customer/main/checkout.tpl right?

He means. you are right.
Reply With Quote
  #6  
Old 06-03-2006, 02:29 AM
 
Grant Grant is offline
 

Senior Member
  
Join Date: Apr 2006
Posts: 171
 

Default Re: A simple fix to pretty the checkout up a little

Quote:
Originally Posted by vulcan-works
Quote:
Originally Posted by Grant
4. Open skin1/main/customer/checkout.tpl

you mean skin1/customer/main/checkout.tpl right?

Yeah sorry
__________________
X-Cart version : 4.0.18
Mod : Customer Also Bought
Mod : Custom catergory Templates
Mod : Custon Product Templates
Reply With Quote
  #7  
Old 06-03-2006, 03:13 PM
 
Kiwami Kiwami is offline
 

Advanced Member
  
Join Date: Nov 2004
Location: Miami, FL
Posts: 69
 

Default sexy is right !

Sweet - That made soooooo much of a diffrence to my eyes
__________________
Follow me on twitter www.twitter.com/kiwami
@Kiwami
X-Cart Gold 4.4.3 | Cpanel | Dedicated Server
Reply With Quote
  #8  
Old 06-03-2006, 04:49 PM
  groovico's Avatar 
groovico groovico is offline
 

X-Man
  
Join Date: Apr 2003
Location: Firetanksoftware.com
Posts: 2,326
 

Default

Its amazing what a difference small changes like these can make to the overall feel of the shopping experience
__________________
Groovico

Used by X-carters the world over:
Marketing Manager Pro Bundle For X-cart
Featured Product Manager for X-cart
Feed manager pro for X-cart

http://www.firetanksoftware.com

Celebrating 7 Years of providing quality X-cart Add ons and X-cart Mods for x-cart 3.X to X-cart 4.4.X
Reply With Quote
  #9  
Old 06-03-2006, 06:49 PM
 
TA TA is offline
 

eXpert
  
Join Date: Apr 2006
Posts: 303
 

Default

Very nice mod and a great improvement over default. Thank you!
__________________
v4.7.12
v5.4.x (In Dev)
Reply With Quote
  #10  
Old 06-04-2006, 02:31 AM
 
Grant Grant is offline
 

Senior Member
  
Join Date: Apr 2006
Posts: 171
 

Default

Glad this is useful to somebody

I'm working on a total overhaul of the checkout as the default look is so messy and not very easy to follow for the customer.

Here's a little snip of the progress so far :

http://www.wyzeshop.com/screenshot13.gif
__________________
X-Cart version : 4.0.18
Mod : Customer Also Bought
Mod : Custom catergory Templates
Mod : Custon Product Templates
Reply With Quote
Reply
   X-Cart forums > X-Cart 4 > Dev Questions



Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

vB code is On
Smilies are On
[IMG] code is On
HTML code is Off
Forum Jump


All times are GMT -8. The time now is 04:36 PM.

   

 
X-Cart forums © 2001-2020