log inhelp

View
 

How to change your big Continue Shopping button

Page history last edited by Eugene 1 year, 7 months ago

1. Grab this image: http://app.ecwid.com/icons/continue_shopping.png

It is a CSS sprite, so it actually has two images of the button.

 

2. Edit this image in any image editor. Change the look of the button.

 

3. Upload this image to your server or to any image hosting.

 

4. Add the following CSS code to your Ecwid store:

 

/* The "Continue Shopping" button in up state */
div.ecwid-ContinueShoppingButton-up, div.ecwid-ContinueShoppingButton-up-hovering,
div.ecwid-ContinueShoppingButton-ie6-up, div.ecwid-ContinueShoppingButton-ie6-up-hovering {
    background: transparent url(icons/continue_shopping.png) no-repeat top center;
}

/* The "Continue Shopping" button in down state */
div.ecwid-ContinueShoppingButton-down, div.ecwid-ContinueShoppingButton-down-hovering,
div.ecwid-ContinueShoppingButton-ie6-down, div.ecwid-ContinueShoppingButton-ie6-down-hovering {
    background: transparent url(icons/continue_shopping.png) no-repeat bottom center;
}

 

 

Replace the "icons/continue_shopping.png" with the real absolute path to the modified image. For example:

 

    url(http://www.example.com/images/my_custom_continue_shopping.png)

That's all.

 

For more details on how to add any CSS code to your store or create a custom CSS theme, refer to this article: CSS Faq

 

 

PDF version