How to remove hover effect on 'Pay Now' button?

Shopify Discussion
1

Hello,

Can someone please help to teach on how to remove the hover effect on ‘Pay Now’ button when check out. Thank you!

2

Hey @TJ711

Could you please provide your Store URL and, if applicable, the Password too? Your cooperation is greatly appreciated!

Best Regards,
Moeed

3

Hi Moeed,

Thank you for the fast response. The Store URL: taojinjewellery.com with no password. Thanks.

4

Hey @TJ711

Just for confirmation, out of these 3 buttons, can you please tell me that exactly from which button you’d like to remove the hover effect from?

Moeed_0-1692338603760.png
Moeed_0-1692338603760.png1358×535 39.5 KB

Best Regards,
Moeed

5

IMG_8418.PNG
IMG_8418.PNG1125×2436 308 KB

Is this ‘Pay Now’ button when check out.

6

Hi Moeed,

Just notice that the hover effect is on all the buttons during check out process. For example, ‘Continue Shipping’, ‘Continue to Payment’ and ‘Pay Now’. I would like to remove all the hover effect on all these three button. Appreciate for your help!

7

Hey @TJ711

Unfortunately, you cannot make changes in the checkout page even with coding as it requires Shopify Plus.

Best Regards,
Moeed

8

Hi Moeed,

Is it possible is because I add the coding for “Order on WhatsApp” affect the hover effect? Cause the “Order on WhatsApp” also have hover effect.

9

Hey @TJ711

To remove the hover effect from the WhatsApp button, add the following code.

Follow these Steps:

  1. Go to Online Store

  2. Edit Code

  3. Find theme.liquid file

  4. Add the following code in the bottom of the file above tag

RESULT:

Moeed_0-1692340010110.png
Moeed_0-1692340010110.png1358×879 54.8 KB

If I managed to help you then, don’t forget to Like it and Mark it as Solution!

Best Regards,
Moeed

1 Like