Using jQuery on WooCommerce Cart Page Load

This topic has 7 replies, 2 voices, and was last updated 6 years, 2 months ago by Artem Temos.

Viewing 8 posts - 1 through 8 (of 8 total)

Author

Posts
September 25, 2018 at 1:24 pm #78927
robertarrow
Participant
I have a site that I’m working on and there’s an issue I’m having with a function I wrote for the cart page of the site. The site is using the WooCommerce Dynamic Pricing & Discounts plugin and a Facebook chat plugin. When a user hits the cart page, the Facebook messenger icon is directly over the ‘woocommerce-message’ div. I’ve written the following code, but it seems to only work when AJAX is used on the page, i.e., updating an item quantity or deleting a product, but it doesn’t work when the cart page is actually loaded. I was wondering if you guys had a quick solution for this. Thanks!
```
jQuery( document.body ).on( 'updated_wc_div', function(){
if(jQuery('.woocommerce-message').length){
    jQuery('.fb_dialog.fb_dialog_advanced.fb_customer_chat_bubble_animated_no_badge').css('bottom',' 75px');
}
});
```
Keep in mind I have this in the Global Custom JS of the Theme Settings

Attachments:
You must be logged in to view attached files.
September 25, 2018 at 1:51 pm #78944
Artem Temos
Keymaster
Hi,

Try to add this code as well
```
if(jQuery('.woocommerce-message').length){
    jQuery('.fb_dialog.fb_dialog_advanced.fb_customer_chat_bubble_animated_no_badge').css('bottom',' 75px');
}
```
Regards
September 25, 2018 at 2:18 pm #78952
robertarrow
Participant
Is this a separate code or am I adding it as part of the one I provided? – Side note: When I enter the following into the console:
```
if(jQuery('.woocommerce-message').length){
    jQuery('.fb_dialog.fb_dialog_advanced.fb_customer_chat_bubble_animated_no_badge').css('bottom',' 75px')};
```
It moves the Facebook icon to where it needs to be.
September 25, 2018 at 2:27 pm #78956

Artem Temos
Keymaster

Yes, it should be a separate code.

September 25, 2018 at 2:34 pm #78959
robertarrow
Participant
I had to do it like this in order for it to actually work. Please take a look at the cart page now.
```
jQuery( document.body ).on( 'updated_wc_div', function(){
if(jQuery('.woocommerce-message').length){
    jQuery('.fb_dialog.fb_dialog_advanced.fb_customer_chat_bubble_animated_no_badge').css('bottom',' 75px');
}
});
```
September 25, 2018 at 7:58 pm #79010

Artem Temos
Keymaster

Sorry, but additional code customizations are out of our theme support scope.

September 25, 2018 at 8:43 pm #79035
robertarrow
Participant
My apologies, I wrote the wrong code snippet. It was the following:
```
setTimeout(addClass, 2500);
function addClass(){
	if(jQuery('.woocommerce-message').length){
	    jQuery('.fb_dialog.fb_dialog_advanced.fb_customer_chat_bubble_animated_no_badge').css('bottom',' 75px');
	}
}
```
I know it’s out of your scope, but do you know why I would have to delay it? Is it something to do with the third-party plugins?
September 26, 2018 at 5:59 am #79074

Artem Temos
Keymaster

As we see you have already added a delay 2.5s using setTimeout function. What kind of delay do you mean?
Author

Posts