Page 1 of 1
How to replace default "add to cart" with an image
Posted: Fri Oct 08, 2010 6:49 am
by yaletowner
I'm trying to find how to replace the default "add to cart" on the product page that's currently a text with background color. Instead I'd like to change it to my own button that is an image.
Also can someone suggest how to completely remove "add to wishlist", from the product page - including name of files that need editing.
Re: How to replace default "add to cart" with an image
Posted: Fri Oct 08, 2010 7:32 am
by s_ismail
yaletowner wrote:I'm trying to find how to replace the default "add to cart" on the product page that's currently a text with background color. Instead I'd like to change it to my own button that is an image.
Also can someone suggest how to completely remove "add to wishlist", from the product page - including name of files that need editing.
Go to App_Themes/Your_Theme/style.skin and locate the following line
Code: Select all
<asp:Image runat="server" SkinId="BuyNowButton" ImageUrl="images/cart_btn2.gif" />
and replace its 'cart_btn2.gif' with your own image Like this
Code: Select all
<asp:Image runat="server" SkinId="BuyNowButton" ImageUrl="images/Your_New_Image.gif" />
Re: How to replace default "add to cart" with an image
Posted: Fri Oct 08, 2010 7:53 am
by yaletowner
Thank you for this... So far this made a change in two places > The category display grid & Product search result page.
The Product Page still has the default "add to cart" text on a background. Can you point out how to change it to my own image in here.
And once on that page, how can I disable "add to wishlist" link completely.
Re: How to replace default "add to cart" with an image
Posted: Fri Oct 08, 2010 8:18 am
by s_ismail
yaletowner wrote:
The Product Page still has the default "add to cart" text on a background. Can you point out how to change it to my own image in here.
Go to ConLib/BuyProductDialog.ascx and locate the following code
Code: Select all
<asp:LinkButton ID="AddToBasketButton" runat="server" SkinID="Button" Visible="true" OnClick="AddToBasketButton_Click" Text="Add to Cart" EnableViewState="false" ValidationGroup="AddToBasket"></asp:LinkButton>
Replace with this code
Code: Select all
<asp:ImageButton ID="AddToBasketButton" runat="server" SkinID="BuyNowButton" Visible="true" OnClick="AddToBasketButton_Click" EnableViewState="false" ValidationGroup="AddToBasket"></asp:ImageButton>
how can I disable "add to wishlist" link completely.
Go to ConLib/BuyProductDialog.ascx.cs and locate the following code
Code: Select all
AddToWishlistButton.Visible = true
and comment out this line. like
Code: Select all
//AddToWishlistButton.Visible = true
Re: How to replace default "add to cart" with an image
Posted: Fri Oct 08, 2010 8:42 am
by yaletowner
That did it - Thank You!
Re: How to replace default "add to cart" with an image
Posted: Fri Jun 17, 2011 1:41 pm
by cierra
How would this work with this type of code:
<asp:Button ID="MultipleAddToBasketButton" runat="server" Text="Add to Cart" OnClick="MultipleAddToBasketButton_Click" ToolTip="Fill in the quantity and Click this to add multiple products to baskt." UseSubmitBehavior="false" />
I've tried what you have above, but it errors out
Re: How to replace default "add to cart" with an image
Posted: Mon Jun 20, 2011 6:14 am
by s_ismail
cierra wrote:How would this work with this type of code:
<asp:Button ID="MultipleAddToBasketButton" runat="server" Text="Add to Cart" OnClick="MultipleAddToBasketButton_Click" ToolTip="Fill in the quantity and Click this to add multiple products to baskt." UseSubmitBehavior="false" />
I've tried what you have above, but it errors out
Hello,
Above code will not work for you. Make Use of this code by replacing 'MultipleAddToBasketButton' button code
Code: Select all
<script language="javascript" type="text/javascript">
function AddToCartImageClicked()
{
document.getElementById('<%=MultipleAddToBasketButton.ClientID%>').onclick();
}
</script>
<asp:Button ID="MultipleAddToBasketButton" runat="server" Text="Add to Cart" style="display:none;" OnClick="MultipleAddToBasketButton_Click" ToolTip="Fill in the quantity and Click this to add multiple products to baskt." UseSubmitBehavior="false" />
<asp:Image ID="AddToCartImage" runat="server" SkinID="BuyNowButton" AlternateText="Add To Cart" onclick="return AddToCartImageClicked();" />
Re: How to replace default "add to cart" with an image
Posted: Mon Jun 20, 2011 7:11 am
by cierra
No, I am sorry, this does not work. Does not change out button, still the same one.
Re: How to replace default "add to cart" with an image
Posted: Mon Jun 20, 2011 7:47 am
by s_ismail
Are you using this code in 'CategoryGridPage3.ascx' Control or somewhere else?
Re: How to replace default "add to cart" with an image
Posted: Mon Jun 20, 2011 8:01 am
by cierra
Yes, this is from vs 7.07, page: CategoryGridPage3.ascx and the code is:
<div align="center">
<asp:Button ID="MultipleAddToBasketButton" runat="server" Text="Add to Cart" OnClick="MultipleAddToBasketButton_Click" ToolTip="Fill in the quantity and Click this to add multiple products to baskt." UseSubmitBehavior="false" />
</div>
But these buttons -- <asp:Button type commands are throughout the site and we'd like to replace them with actual images. Our customers are generally older and not very computer literate. These text based buttons are too small and very easy to miss.
Re: How to replace default "add to cart" with an image
Posted: Mon Jun 20, 2011 8:05 am
by s_ismail
It is working properly on my side. I have uploaded this control. Give a try using this.
Re: How to replace default "add to cart" with an image
Posted: Mon Jun 20, 2011 1:40 pm
by cierra
So, with this code you are seeing an image for a button? The image set in your style skin page here: <asp:ImageButton runat="server" SkinId="BuyNowButton" ImageUrl="images/add_to_cart.png" ImageAlign="AbsMiddle" />?
I do not, I see the same button I had before that is generated from CSS with the text, not the image button I have set up in my style.skin page.
Re: How to replace default "add to cart" with an image
Posted: Sat Aug 20, 2011 7:14 pm
by Richard47
I have figured out how to change the add to cart to an image button from above but I am having problems changing the add to wish list to an image button also anyone have any clues as to how I can do this.
Thanks
Richard