Google PAY BUTTON width adjustment and add to cart wobble animation help

[Little Panda]

Hello,

We are wanting to make our Google Pay button full width like shown in your product here: https://woodmart.xtemos.com/accessories/product/iphone-13-case-with-magsafe-red-rose/

How can we do that as currently it looks like the image attached (left is our product and right side is your product with full width google pay button circled)?

—————

Also you gave some code to make our Add to Cart button have a wobble effect here: https://xtemos.com/forums/topic/couple-of-questions/

However, in the new update using the layouts builder the wobble action does not activate. How to fix this?

Thank you for your advice.

Panda

• This topic was modified 2 years, 5 months ago by Little Panda.
• This topic was modified 2 years, 5 months ago by Little Panda.
• This topic was modified 2 years, 5 months ago by Little Panda.

Attachments:

You must be logged in to view attached files.

Hello,

Our demo uses the official WooCommerce Stripe Gateway plugin and it might look a bit different than yours.

Kind Regards

Hi, Okay I see. I will try the official Stripe Gateway plugin or contact our current Stripe plugin developer to see if they can change it.

With regards to the Add to Cart button wobble animation effect that has now stopped working owing since the latest Woodmart update. Are you able to provide a modified version of the code you gave us that will get it working again?

Could you please send us a link to the post where we gave you this CSS code?

Thank you in advance.

Sure it was here: https://xtemos.com/forums/topic/couple-of-questions/#post-304989

Try to replace the code with this one

@keyframes xts-shake {
		0%,
		12% {
		    -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0)
		}
    2%,
    4%,
    6%,
    8%,
		10% {
        -webkit-transform: translate3d(-10px, 0, 0);
        transform: translate3d(-10px, 0, 0)
    }
    3%,
    5%,
    7%,
		9%,
		11% {
        -webkit-transform: translate3d(10px, 0, 0);
        transform: translate3d(10px, 0, 0)
    }
}
.wd-single-add-cart .single_add_to_cart_button {
		animation-name: xts-shake;
		animation-duration: 10s;
		animation-delay: 5s;
		animation-iteration-count: infinite;
		animation-fill-mode: both;
}

Kind Regards

Yep that did it. As usual you have given quick, helpful response and answers!

We are always happy to help. Feel free to contact us if you have any further questions.

Kind Regards

[Author]

Posts