[Niantic Lions]

I successfully uploaded the sprite and put in the css code to change the "add to bag button" and it works OK except for one problem: the ORIGINAL add to bag text is still there, and ghosts over the new button. How do I get rid of the original text?

Also, same situation for checkout button.

[Wendy]

Originally Posted by Niantic Lions

I successfully uploaded the sprite and put in the css code to change the "add to bag button" and it works OK except for one problem: the ORIGINAL add to bag text is still there, and ghosts over the new button. How do I get rid of the original text?

Also, same situation for checkout button.

Hello,

Thank you for contacting Ecwid Customer Care Team.

I tried to inspect your store using this link http://nianticlions.org/pay-by-credit-card-entire-store but unfortunately I didn't manage to do it. I got the following error message: Sorry, no such page. Have you removed the store?

Please, give me the link to the page with your store so that I could inspect it.

In case you uninstalled the store, please add it to your site again. As I can see, your store is based on Wordpress. The recommended way to add your store on Wordpress site is to do it with the help of our official plugin. Please, find the instruction in this article: https://help.ecwid.com/customer/portal/articles/1085017

[Niantic Lions]

Sorry, Wendy. I renamed the page. You can see it at http://www.nianticlions.org/membership dues.

No big deal. I created an opaque button that overlays the original, but I would like to know why this is happening. Your sprite should work, so I changed the code back so you can see what I'm talking about. Tried different browsers (IE, Chrome< Firefox) all the same.

Also, I am using the ECWID plugin...

[Niantic Lions]

I downloaded new "add to bag" and "checkout" sprites from ecwid, and revised the css code, the new buttons show up and they work but the old original ones are "ghosted" underneath. I fooled around with some :after css, but couldn't get it to work. How do I get rid of the old residual ghost button? Store is nianticlions.org/dues

[Wendy]

Originally Posted by Niantic Lions

Sorry, Wendy. I renamed the page. You can see it at http://www.nianticlions.org/membership dues.

No big deal. I created an opaque button that overlays the original, but I would like to know why this is happening. Your sprite should work, so I changed the code back so you can see what I'm talking about. Tried different browsers (IE, Chrome< Firefox) all the same.

Also, I am using the ECWID plugin...

Hello,

I am very sorry about the delay with the reply.

Ecwid official plugin for Wordpress sites automatically enables the 'Chameleon Skin' for your store. Chameleon Skin is the design theme allowing to adapt the look of your store to the design of your Wordpress site. It defines the predominant colors and font you use on your site and automatically applies them in your product catalog.

So, if you compare your store that you have installed on Wordpress site and your Ecwid Starter Site which is https://store7577225.ecwid.com you'll see the difference.

To answer your question about buttons. The buttons in the Chameleon design theme are built with the help of CSS code only. But, the buttons in the Standard design theme are actually images, i.e. CSS-sprites. If you wish to change the design of buttons-images with the help of the instruction given in this article 'How to change your "Add to Bag" button', the CSS code will work perfectly. But, if you want to change the design of buttons that are created with the help of CSS code, you basically should use another instruction. It is in this article: 'How to change Buy Now buttons'.

As I understand, you were not happy with blue 'Add to bag' buttons from the Chameleon theme, so you replaced them with the default buttons (that come with the Standard design theme). But, the 'Add to bag' text is still here. This text belongs to the created via CSS 'Add to bag' button. It is possible to hide it. Just add the following CSS code in your Ecwid control panel > Settings > Design page > your active CSS theme and save the changes:

div.ecwid-AddToBagButton::after {
    display: none;
}
div.ecwid-AddToBagButton {
  height: 39px !important;
}

The same situation with the 'Checkout' button. Here is the CSS code to hide the original text overlapping the new button.

div.ecwid-productBrowser-cart-checkoutButton::after {
    display: none;
}
div.ecwid-productBrowser-cart-checkoutButton {
  height: 39px !important;
}

Also, if you wish, you can disable the 'Chameleon' design theme in your store. You should do it in the admin area of your Wordpress site. Go to Ecwid Store > Advanced page. Please, see the screenshot: http://take.ms/e7Dpn

If you disable the Chameleon skin, your custom CSS theme 'membership' that includes the 'Standard theme' and your own custom codes will be applied to your store front.

If you have other concerns, please feel free to write me back and it will be my pleasure to assist you further. Have a wonderful day!

[Niantic Lions]

Thanks Wendy, that code worked perfectly!

[Wendy]

Originally Posted by Niantic Lions

Thanks Wendy, that code worked perfectly!

You are welcome!

I am glad to hear that I could help.

Please, contact us again if needed. Also feel free to search our help portal at http://help.ecwid.com/ with plenty of ready answers.