Whatsapp button overlapping Sticky Add to Cart

I have added join chat whatsapp button on my website- But it is overlapping the sticky add to cart button on my single product page. I can see the scroll to top automatically going up when the sticky add to cart pops up. How can I do the same for the whatsapp button?

Attachments:

You must be logged in to view attached files.

Hello?

Hi tikliwebsite,

Thanks for reaching to us.

First of all, take my apologies for the delay in answering because of the weekend.

Please add the following Custom CSS code to Theme Settings > Custom CSS > Global Custom CSS:

div.joinchat {
	--bottom: 100px;
}

For the display it when scrolling, you need to take a look at plugin settings to see if they support it.

Regards,

This option is not working for me because the WhatsApp icon seems to be floating mid air on all the other pages. It only looks good when sticky add to cart comes. Whatsapp button also going up only when sticky add to cart comes would have been great. But as that is not possible, I have a different solution in mind.

I want to shift the scroll to top button on the left hand side. (There is no setting available in the theme settings so you will have to give me a code). Whatsapp icon I will shift to the right hand side and I want to remove the compare icon & the cart icon from the sticky add to cart. In this way, even if whatsapp button overlaps the sticky add to cart, it will only overlap the blank white space & not the product image as it does on the left hand side. I have seen such a design on this website- https://moora.in/products/mallika-hand-block-print-red-mul-mul-cotton-saree (Attaching ss of their design below)

Hi tikliwebsite,

Thanks for your patience.

1. Back to top button

Please add the following Custom CSS code to Theme Settings > Custom CSS > Global Custom CSS:

button.m-button--scroll-top {
	left: 16px;
}

2. Sticky add to cart

It seems you removed Compare and Wishlist features, please confirm me back.

Regards,

No I have note removed Wishlist & compare from the website

Hi tikliwebsite,

Please add the following Custom CSS code to Theme Settings > Custom CSS > Global Custom CSS:

div.m-sticky-addtocart--addon {
	display: none;
}

Regards,

I put in all 2 codes that you gave me but none of it worked. Scroll to top is still on left & the wishlist & compare icons are still there in the sticky cart. I am attaching ss below

Attachments:

You must be logged in to view attached files.

Hi tikliwebsite,

Please remove @media attribute and check again https://prnt.sc/go79HpKXLkzZ

Regards,

[Author]

Posts