ShopSite Forums

Your source for ShopSite user collaboration

Skip to content

Coupon Code Text Area

Questions and answers about ShopSite Custom Templates
Post a reply

Coupon Code Text Area

Postby Kennedy » Wed Jun 29, 2011 7:49 am

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;
}
Kennedy
 
Posts: 33
Joined: Fri Jun 10, 2011 6:18 am
Top

Re: Coupon Code Text Area

Postby Jim » Wed Jun 29, 2011 8:45 am

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 --]
...
Jim
Site Admin
 
Posts: 4953
Joined: Fri Aug 04, 2006 1:42 pm
Location: Utah
Top

Re: Coupon Code Text Area

Postby Kennedy » Wed Jun 29, 2011 10:11 am

Figured you'd know an easy way. :)

Thanks Jim!
Kennedy
 
Posts: 33
Joined: Fri Jun 10, 2011 6:18 am
Top

Re: Coupon Code Text Area

Postby Kennedy » Wed Jun 29, 2011 10:40 am

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!
Kennedy
 
Posts: 33
Joined: Fri Jun 10, 2011 6:18 am
Top

Re: Coupon Code Text Area

Postby loren_d_c » Wed Jun 29, 2011 11:34 am

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
loren_d_c
 
Posts: 2572
Joined: Fri Aug 04, 2006 12:02 pm
Location: Anywhere
Top

Re: Coupon Code Text Area

Postby Kennedy » Thu Jun 30, 2011 7:54 am

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!
Kennedy
 
Posts: 33
Joined: Fri Jun 10, 2011 6:18 am
Top

Re: Coupon Code Text Area

Postby Jim » Thu Jun 30, 2011 10:39 am

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.
Jim
Site Admin
 
Posts: 4953
Joined: Fri Aug 04, 2006 1:42 pm
Location: Utah
Top

Re: Coupon Code Text Area

Postby Kennedy » Thu Jun 30, 2011 11:20 am

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.
Kennedy
 
Posts: 33
Joined: Fri Jun 10, 2011 6:18 am
Top

Re: Coupon Code Text Area

Postby Kennedy » Fri Jul 01, 2011 6:22 am

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;
}
Kennedy
 
Posts: 33
Joined: Fri Jun 10, 2011 6:18 am
Top
Post a reply

Return to Custom Template Questions

Who is online

Users browsing this forum: No registered users and 62 guests

Powered by phpBB® Forum Software © phpBB Group