Button picture codes

[mondo]

Promised I'd post this when I got them documented. Got the major buttons done. search/login/out/create acct/continue/checkouts/etc. We don't use some things like gift registry so there not in. The add to cart buttons for the list and detail template is in the knowledge base.
Thank you to [email protected] support for the contact us 'send button' code as I'd missed a key statement to make it work right. If you put your pics in the images/default and name them the same you can cut and paste otherwise you have to chage name and location. The work here in IE and FF, TEST THOROUGHLY on your site!
www.stitchersstuff.com
Please let me know if you find they don't work on other browsers.


SEARCH BUTTON:
From:
<input type="submit" name="search" value="GO" class="btn" onMouseOver="this.className='btn_over'" onMouseOut="this.className='btn'">
TO:
<input type="image" name="Search" src="assets/images/default/btngo.png" border="0" alt="Go">

lOGIN ACCOUNT PAGE BUTTONS:

LOGIN:
<input type="submit" value="Log in" class="btn" onMouseOver="this.className='btn_over'" onMouseOut="this.className='btn'" id="Submit1" name="Submit1">
TO:
<input type="image" id="Submit1" name="Submit1" src="assets/images/default/btnlogin3.png" border="0" alt="Login">
RESET PASWORD:
<input type="submit" value="Reset my password" class="btn" onMouseOver="this.className='btn_over'" onMouseOut="this.className='btn'" id="Submit2" name="Submit2">
TO:
<input type="image" id="Submit2" name="Submit2" src="assets/images/default/btnresetpw3.png" border="0" alt="Reset password">
CREATE ACCOUNT:
<input type="button" value="Create Account" class="btn" onmouseover="this.className='btn_over'" onmouseout="this.className='btn'" onclick="window.location='register.asp?cg=0';">
TO:
<a href="/register.asp?cg=0"><img src="assets/images/default/btncreateacct3.png" border="0" alt="Create account"></a>

MY ACCOUNT PAGE:

Logout:
<input name="logout" type="button" class="btn" onclick="window.location='logout.asp';" value="Logout" onMouseOver="this.className='btn_over'" onMouseOut="this.className='btn'">
TO:
<a onclick="window.location.href='logout.asp';"><img src="assets/images/default/btnlogout3.png" border="0" alt="Logout"></a>

SHOPING CART:

TOP CONTINUE SHOPPING BUTTON:

<input type="button" value="[viewcart_continue-shopping]" onclick="document.location.href='[continue_url]';" class="btn" onMouseOver="this.className='btn_over'" onMouseOut="this.className='btn'">
TO:
<input type="image" onclick="document.location.href='[continue_url]';" src="assets/images/default/btncontshop3.png" border="0" alt="Continue shopping">

TOP CHECKOUT BUTTON:

<input type="button" onclick="window.location='checkout.asp?step=1'" value="[viewcart_checkout-button]" class="btn" onMouseOver="this.className='btn_over'" onMouseOut="this.className='btn'">
TO:
<input type="image" onclick="window.location='checkout.asp?step=1'" src="assets/images/default/btnbegincheckout3.png" border="0" alt="Continue shopping">

BOTTOM CONTINUE SHOP BUTTON:

<input type="button" value="[viewcart_continue-shopping]" onclick="document.location.href='[continue_url]';" class="btn" onMouseOver="this.className='btn_over'" onMouseOut="this.className='btn'" id="Button6" name="Button6">
TO:
<a onclick="document.location.href='[continue_url]';" id="Button6" name="Button6" style="pic"href="#""><img src="assets/images/default/btncontshop3.png" border="0" alt="Continue shopping"></a>

UPDATE CART BUTTON:

<input type="submit" name="Add" value="[shoppingcart_updatecart]" class="btn" onMouseOver="this.className='btn_over'" onMouseOut="this.className='btn'" id="Submit2"></td>
TO:
<input type="image" name="Add" id="Submit2" src="assets/images/default/btnupdatecart3.png" border="0" alt="Update">

BOTTOM CART CHECKOUT BUTTON:

<td valign="top"><input type="button" onclick="window.location='checkout.asp?step=1'" value="[viewcart_checkout-button]" class="btn" onMouseOver="this.className='btn_over'" onMouseOut="this.className='btn'" id="Button7" name="Button7"></td>
TO:
<a onclick="window.location.href='checkout.asp?step=1 '" id="Button7" name="Button7" style="pic"href="#""><img src="assets/images/default/btnbegincheckout.png" border="0" alt="Begin checkout"></a>

CHECKOUT 1:

LOGIN:
<input type="button" value="[checkout1_login]" name="B3" onclick="document.location='checkout.asp?step=log-in';" class="btn" onmouseover="this.className='btn_over'" onmouseout="this.className='btn'">
TO:
<a onclick="window.location.href='checkout.asp?step=l og-in';"><img src="assets/images/default/btnlogin3.png" border="0" alt="Login"></a>

PROCEED TO SHIPPING:

<input type="submit" name="Add22" value="[checkout1_submitbutton]" class="btn" onmouseover="this.className='btn_over'" onmouseout="this.className='btn'">
TO:
<input type="image" name="add22" src="assets/images/default/btngotoshipping3.png" border="0" alt="Go to shipping">

CHECKOUT 2:

<input type="submit" name="Add222" value="[checkout2_submitbutton]" class="btn" onMouseOver="this.className='btn_over'" onMouseOut="this.className='btn'">
TO:
<input type="image" name="add222" src="assets/images/default/btngotopayment3.png" border="0" alt="Go to payment">

CHECKOUT 3:
CONFIRM ORDER BUTTON:
<td align="right" ><input type="submit" value="[checkout3_submitbutton]" name="B1" class="btn" onMouseOver="this.className='btn_over'" onMouseOut="this.className='btn'">
TO:
<input type="image" name="B1" src="assets/images/default/btnconfirm3.png" border="0" alt="Checkout">

CONTACT US:

SEND BUTTON:

<input type="button" onClick="javascript:addNew();" value="[crm_button-add-ticket]" class="btn" onMouseOver="this.className='btn_over'" onMouseOut="this.className='btn'">
TO:
<a href="#" onClick="javascript:addNew();"><img src="assets/images/default/btnsend3.png" border="0" alt="Send"></a>

[ajessey]

single page check out buttons needed

looking for the code to change the checkout button on checkout_one.asp and also the code for the go buttons for the promo code and the shipping calculation on viewcart.asp

[piaf]

Mondo, this document just saved me hours of grief. Thanks so much for taking the time to post it last year. :)

[mondo]

Glad to help, it was a lot more trouble than I believed it would be and thought worth posting. If you do any I didn't include/had at the time please post so I can add it to my library.

[jdaniels]

I'll add to this wonderful post:

On the listing page, this is what I changed to add an image button to the 'related items'

<input type="button" value="[category_buyitlink]" onClick="window.location='add_cart.asp?quick=1&ite m_id=[catalogid]'" class="btn" onMouseOver="this.className='btn_over'" onMouseOut="this.className='btn'">

changed that to:

<a onclick="window.location='add_cart.asp?quick=1&ite m_id=[catalogid]'"><img src="assets/templates/v40001/images/addtocart.png" border="0" alt="Add to Cart"></a>

[tclifesafety]

Out of curiosity, is this post intended simply as an instruction to change the stock buttons to images site-wide?

Why did you want to use images instead of CSS?

[mondo]

Why did you want to use images instead of CSS?

To be honest our buttons are CSS now. A year and a half ago I wasn't CSS oriented so went with images. Many people still prefer the direct image route so it depends on your preference.

[justinkas]

Does anyone know how to change the single page checkout button to an image???

Hello,

I have seen many requests for this but no responses. Does anyone know the code to be able to change the checkout button on the single page checkout to an image file instead?

Here is the default code in there now:

<input type="button" value="[checkout3_submitbutton]" name="B1" class="btn" onClick="doCheckout(this.form);"/>

Mondo's post in this thread for replacing check out button with an image is ONLY for multi-page checkout and DOES NOT work for the single page checkout button replacement sadly.

Thank you in advance :)

Justin

[tmilone103]

Bump.. Would also like info on changing the one page checkout buttons.