Issue Elementor YITH Wishlist button

Hello Sophie,
we hope you’re doing well!

I see that the heart loads instantly, but what takes a while is the use of the filter.

If you deactivate Wishlist, does the filter load faster?

Could you check if you have active AJAX loading in our plugin? Try to disable it in such case.

Also, make sure you have both plugins and theme updated to the latest version.

We will be attentive to your response.

Best regards.

Hello Juan, thanks for your answer.

It seems that there is some misunderstandings that I will try to clarify.
To reply to your message:

1. It is the whole button that is loaded with delay, so the button and the icon in it of course, but the whole button is delayed. Also, the issue occurs even if you do not play with the filters, but you see it better when playing with the filters because in the case where the page is loading for the first time, the user is generally not down enough on the page to see the issue occurring, but if you go down the page, and refresh it, you will see that the issue is there, filter activated or not.

2. I am not sure why you are asking if the page loads faster without the wishlist button as it is not the matter of this ticket. Probably some millisecond better as the fewer functions you have on a page, the faster it loads but I don’t think there is a huge difference. What I can tell, which might be more useful for this case, is that if the wishlist widget is deactivated, the button is not shown at all, so indeed, we do not have the issue of the design jumping as the issue comes from the whole Yith Wishlist button not being loaded directly. Hope that clarifies the issue.

3. I am not sure why we are talking about the filter plugin as the issue occurs even when the search filter plugin is deactivated because the issue comes from the YITH Wishlist button not being shown directly when the page loads as you can see at the end of the video previously sent.

4. Yes I confirm that I have both plugins activated, and that they use the latest version meaning YITH Wishlist 3.24.0, Elementor 3.15.3, Elementor Pro 3.15.1 and woocommerce 8.0.2.

Please make sure to watch the video until the end as I believe most of your questions were answered in it. I conducted a deep investigation to find which plugin was causing the issue before contacting you, and you can see the results of this test at the end of the video, with no plugins active excluding Elementor, Woo and YITH Wishlist, and the Hello Elementor theme. Hope it will help you understand the problem I am facing.

Please let me know if the issue is clear for you now, and if it is not feel free to ask me more questions ??

Looking forward to hearing from you,
Thanks for your help,
Kind regards,
Sophie

Hello Sophie,
sorry for the misunderstanding.

The loading times of the heart in each item are really normal in our plugin, since for each item it is necessary to load the fragments of information used when being able to add that item to the wishlist. This loading will be slower if you have AJAX loading enabled within our plugin, so if you want to speed this up, you should disable it.

If you have any other questions, feel free to contact us.

Best regards.

Hello Juan,

Thanks for your reply. But does it not work the same way as YITH compare? Because I do not have this issue with the YITH compare button as you can see in the video.

Also I made a test if there is no CSS added to the button added for the position and it seems to be a position issue with the CSS used which is needed because if not, even though the widget is well aligned in our product loop in Elementor editor, the widget is not well aligned in front end, please check this video: https://share.vidyard.com/watch/dM1XNFkMsTM34u1ed8ByDs?

And this one: https://share.vidyard.com/watch/819SMsNh7f8xo7aDMeUmTv?

Please find here all the CSS used for this widget:

.add-to-wishlist-before_image .yith-wcwl-add-to-wishlist { position: inherit; } .add-to-wishlist-before_image .yith-wcwl-add-to-wishlist i { font-size: 0.9rem; color: white; } .yith-wcwl-add-button { border-radius: 50px; background-color: #8FD297; border: solid; border-width: 1px; border-color: #8FD297; min-width: 28px; min-height: 28px; display: flex; justify-content: center; align-items: center; } selector .yith-wcwl-add-button:hover { background-color: white; border-color: #57B462; } selector .yith-wcwl-add-button:hover .yith-wcwl-icon { color: #57B462; }

Looking forward to hear from you,
Thank you very much for your investigation,
Kind regards,
Sophie

Hello Sophie,

No, it does not work in the same way as Compare, since as I told you, Wishlist uses fragments in each element necessary for its correct operation, so, unlike Compare, it takes a few milliseconds/second to appear.

Regarding the CSS, by default our plugin only shows the heart in the upper left corner of the products in a loop, so any other position comes from some customization of your theme or Elementor. In any case, this is not related to the fact that the button takes time to appear.

If you have any other questions, feel free to contact us.

Best regards.

Hello @juaancmendez,

Ok thanks for explaining.

In this case, I share the solution in case other users face the same issue: I could fix it by adding a minimum height to the Elementor container containing the YITH Wishlist button so even if the YITH Button takes time to load, it does not impact the design anymore as the container containing the YITH wishlist button is directly set up with the right height.

Wishing you a very good week,
Kind regards,
Sophie