Page 1 of 1
Coupon Code Text Area
Posted:
Wed Jun 29, 2011 7:49 amby Kennedy
Hopefully this is a simple one. I've searched but can't find where to change the size of the text box that the coupon code is typed into on the checkout page of a custom template.
- Code: Select all
<body>
<div id="container">
<div id="header" align="center">[-- INCLUDE header.htm PROCESS --]
</div>
<div id="sidebar1">[-- INCLUDE left-menu.htm PROCESS --]
</div>
<div id="mainContent" align="center">
[-- SC_Form --]
<table width="710" border="0" cellpadding="0" cellspacing="0" style="line-height:150%">
<tr>
<td width="15" rowspan="3" align="right" valign="top">
<p align="left" valign="top""></p>
<p align="left"></p>
<!-- Table for totals, etc. -->
</td>
<td colspan="2" align="left" valign="top">[-- SC_Cart delete image quantity name sku price total --]</td>
</tr>
<tr>
<td align="left">[-- SC_Tax_Shipping --][-- STORE.CouponCaption --][-- SC_Coupon --][-- IF SC_Coupon_Button --]
[-- BUTTON ApplyCoupon --]
[-- ELSE --]
[-- STORE.EnterCoupon --]
[-- END_IF --]</td>
<td rowspan="2" align="right">
[-- SC_Surcharge --]<br />
<br />
</font><span class="buttons"><br />
<div id="totals">[-- SC_Totals --]</div>
[-- BUTTON Recalculate --]</span><br />
<span class="buttons"><small><i>[-- STORE.SC_AnyChanges --]<br />
</i></small></span>[-- BUTTON Checkout --]<br /></td>
</tr>
<tr>
<td align="left" valign="bottom">[-- BUTTON ContinueShopping --]</td>
</tr>
<tr><td colspan="3"><span class="txtNormal">[-- SC_ShowBasket --]</span></td></tr>
</table></td></tr>
<tr><td colspan="2" align="center">[-- INCLUDE inner-footer.htm PROCESS --]</td></tr>
</table>
</div><!-- end #mainContent-->
<div id="hidden_fields">
[-- SC_PaymentSelection --]
[-- ShopSiteSecurityImage --]
</div>
<br class="clearfloat" />
<div id="footer" align="center">[-- INCLUDE outer-footer.htm PROCESS --]</div>
</div>
<!-- end #container -->
</body>
- Code: Select all
body {
font: 100% Verdana, Arial, Helvetica, sans-serif;
background: #CECECE;
margin: 0;
padding: 0;
text-align: center;
color: #000000;
}
#container
{
float:none;
width: 950px;
background: #FFFFFF;
margin: 0 auto;
border: 1px solid #000000;
text-align: left;
}
#outer_footer
{
float:none;
width: 950px;
background: #FFFFFF;
margin: 0 auto;
border: 1px solid #000000;
text-align: left;
}
#sidebar1
{
float:left;
width: 117px;
padding-right: 15px;
}
#mainContent
{
margin: 0 150px 0 117px;
position: relative;
width: 716px;
}
Re: Coupon Code Text Area
Posted:
Wed Jun 29, 2011 8:45 amby Jim
The template tag [-- SC_Coupon --] outputs this code
<input type="text" name="coupon_code" size="20">
So in your template you could replace the [-- SC_Coupon --] tag with that code and change the size="20" to what ever width you need like this:
...
<td align="left">[-- SC_Tax_Shipping --][-- STORE.CouponCaption --]<input type="text" name="coupon_code" size="10">
[-- IF SC_Coupon_Button --]
...
Re: Coupon Code Text Area
Posted:
Wed Jun 29, 2011 10:11 amby Kennedy
Figured you'd know an easy way.
Thanks Jim!
Re: Coupon Code Text Area
Posted:
Wed Jun 29, 2011 10:40 amby Kennedy
Now that I know that, I can apply that to many other issues I've been having with the styling and placement of fields. I can pretty much remove a large portion of the shopsite generated code, and replace it with my own as long as I maintain the form integrity with the proper names. Excellent!
Re: Coupon Code Text Area
Posted:
Wed Jun 29, 2011 11:34 amby loren_d_c
Don't go too crazy with this solution, it will only work for certain form fields that don't need to retain data, such as the search field and the coupon field (i.e. once you submit a coupon code, it goes into the cart and the coupon field reloads on the resulting screen with nothing in it again). You wouldn't be able to do this with some other fields such as the zip code field, the shipping or payment selections, or any of the address or payment fields in the checkout page, for example. Because there are instances where these fields need to be re-filled/selected based on previous input from the shopper, and ShopSite can only do that when it is generating the fields, not when they are hard-coded in the template.
-Loren
Re: Coupon Code Text Area
Posted:
Thu Jun 30, 2011 7:54 amby Kennedy
I'm stuck on an issue that I want to align the fields included in the [-- SC_Tax_Shipping --] generated fields. The input options (zip code, country, shipping options, and ultimately the coupon code text box) don't line up the way I want them to. That's why I'm experimenting with recreating these sections. If there's another way to align them I'm all ears...errr eyes.
http://65.18.196.252/testadd.html
click any of the buttons and it will take you into my cart to see what I'm talking about.
Also on a related subject as the coupon code text box, when I add a coupon to the order, the css is not catching the line item added by the coupon.
Enter the code: gift10 and apply it. You will notice the text of the line item is not matching the rest of the page, even though I've added the class to my style sheet.
http://65.18.196.252/publish/cart.css
Please note that any orders placed on this site will not be processed and are for testing purposes only. Any real interest should be directed at www.crystalclassics.com
Thanks!
Re: Coupon Code Text Area
Posted:
Thu Jun 30, 2011 10:39 amby Jim
The only .css reference in the cart is to /publish/cart.css. When I click on that link and open up the file I do not find any css styles for the css tags in the coupon line
<tr><td class="cart_delete">
<input src="http://65.18.196.252/media/en-US/buttons/sleek/sleek-remove.gif" class="button154" name="Remove:1" alt="Remove" align="bottom" border="0" type="image"></td><td class="cart_cp_image"></td><td class="cart_cp_quantity">Coupon Applied</td><td class="cart_cp_name">Gift 10</td><td class="cart_cp_sku">(Coupon)</td><td class="cart_cp_price"> </td><td class="cart_cp_total">-$7.50</td></tr>
There are other css styles that are also missing so view the html pages source for the areas you are having problems with and make sure you have styles for all the tags output by ShopSite.
Re: Coupon Code Text Area
Posted:
Thu Jun 30, 2011 11:20 amby Kennedy
Well that would be the first issue to address. The cart.css file on the server is not the same as the one I thought was there. Thanks for the second pair of eyes. It would have taken me forever to check that. I uploaded the file and assumed it went through correctly.
Re: Coupon Code Text Area
Posted:
Fri Jul 01, 2011 6:22 amby Kennedy
After frustration of the file being there, and the link being correct (as far as I can tell)and still not working, I've just added the entire css contents to the head of the cart template. The styles for the coupon are listed, and still not working when the coupon is added to the cart. Thanks for any help with this.
- Code: Select all
@charset "UTF-8";
body {
font: 100% Verdana, Arial, Helvetica, sans-serif;
background: #CECECE;
margin: 0;
padding: 0;
text-align: center;
color: #000000;
}
#shipalign
{
width:150px;
text-align:justify;
}
#container
{
float:none;
width: 950px;
background: #FFFFFF;
margin: 0 auto;
border: 1px solid #000000;
text-align: left;
}
#outer_footer
{
float:none;
width: 950px;
background: #FFFFFF;
margin: 0 auto;
border: 1px solid #000000;
text-align: left;
}
#header {
}
#header h1 {
margin: 0;
}
#sidebar1
{
float:left;
width: 117px;
padding-right: 15px;
}
#mainContent
{
margin: 0 150px 0 117px;
position: relative;
width: 716px;
}
#footer td
{
float:left;
}
#footer p
{
}
.checkout, surcharge, cart_quantity, cart_delete, cart_image, cart_name, cart_sku, cart_price, cart_total, zipncountry, taxnship, instruct_hdr, buttons, totals, txtNormal, cart_delete, cart_cp_image, CustomHTML, payment_hdr, payment, ship_check, ship_addr_hdr, bill_addr_hdr, addr, cart_cp_name, cart_cp_image, cart_cp_sku, cart_cp_price, cart_cp_quantity, cart_cp_total
{
FONT-family: verdana;
FONT-size: 11px;
FONT-weight: normal;
TEXT-decoration: none;
COLOR: #666;
text-align: inherit;
}
.clearfloat
{
clear:both;
height:0;
font-size: 1px;
line-height: 0px;
}
.txtHeading
{
FONT-family: verdana;
FONT-size: 11px;
FONT-weight: bold;
TEXT-decoration: none;
COLOR: #36A6C8;
}
.txtHeading2
{
FONT-family: verdana;
FONT-size: 11px;
FONT-weight: bold;
TEXT-decoration: underline;
COLOR: #36A6C8;
}
.txtunderline
{
FONT-family: verdana;
FONT-size: 11px;
FONT-weight: none;
TEXT-decoration: underline;
COLOR: #7B7B7B;
}
.txtBottomline
{
FONT-family: verdana;
FONT-size: 11px;
FONT-weight: none;
TEXT-decoration: none;
COLOR: #4B4B4B;
text-align: left;
}
.txtCopyright
{
FONT-family: Verdana;
FONT-size: 11px;
FONT-weight: none;
TEXT-decoration: none;
COLOR: #A5A5A5;
}
/*----------------- Dynamic Style ----------------------*/
A.linksBottom
{
FONT-family: verdana;
FONT-size: 11px;
FONT-weight: none;
TEXT-decoration: none;
COLOR: #4B4B4B;
}
A.linksBottom:hover
{
COLOR: #4B4B4B;
FONT-size: 11px;
FONT-weight: none;
TEXT-decoration: underline;
COLOR: #4B4B4B;
}
.menuOver
{
background-color: #CECECE;
}
.menuOut
{
background-color: #FFFFFF;
}
.menuOut A
{
font-family: verdana;
font-size: 11px;
font-weight: normal;
text-decoration: none;
color: #747476;
}
.menuOver A
{
font-family: verdana;
font-size: 11px;
font-weight: normal;
text-decoration: none;
color: #FFFFFF;
}
.txtNormal_Special {
FONT-family: verdana;
FONT-size: 11px;
FONT-weight: normal;
TEXT-decoration: none;
COLOR: #F00;
font-style: oblique;
}
.txtNormal_price {
FONT-family: verdana;
FONT-size: 11px;
FONT-weight: normal;
TEXT-decoration: none;
COLOR: #F00;
}
.txtNormal_collection {
FONT-family: verdana;
FONT-size: 11px;
FONT-weight: bold;
TEXT-decoration: none;
COLOR: #7B7B7B;
text-align: center;
}
.txtNormal_cart_title {
FONT-family: verdana;
FONT-size: 11px;
FONT-weight: normal;
TEXT-decoration: none;
COLOR: #333;
}
.txtNormal_SoldOut {
FONT-family: verdana;
FONT-size: 11px;
FONT-weight: normal;
TEXT-decoration: none;
COLOR: #333;
text-align: right;
}
#wrap_sample
{
position: relative;
bottom: 250px;
}