WordPress theme broken when an iframe from SantuCommerce plugin opened

user_3184454 0
Viewed 196

So I have this problem with this Santu WooCommerce plugin, so this plugin will open an iframe every time someone click the product link, this iframe will open a checkout page from santu.

So the problem I had is I think there are some conflicts on wordpress themes and santu CSS/JS. Here is the screenshot

before I click the product link from santu.

enter image description here

After click the add to cart

enter image description here

what happened after click the santu link

enter image description here

So what I want is to prevent the assets (CSS/JS) from Santu Site affected my website. So I already googled it and found about the iframe sandbox, but when I added the sandbox attributes, it's broken the santu as well.

So is there any solution about this? maybe some function in WooCommerce that can fix this problem?

Thank you.

Here's the video

woocommerce wordpress-theming wordpress iframe
1 Answers

Of course, there is needed much more information, example (at least link to that site too) and there might be needed further (and deeper) dig into those files and etc, which can be hardly achieved with this Q/A format.

However, as an ugly alternative (as a temporary solution, if you can't fix it better) is that the add-to-cart JS action should be triggered into the new window-frame (which will be closed automatically) and thus, the initial page's design won't be messed up.

If that's possible, here is phseudo-concept:

  • clicking on "add-to-cart" triggers window.open( window.location.href + '&xyz')
  • if(window.location.href.indexOf("&xyz") > -1) then trigger add-to-cart window.
  • closing that window should trigger window.close();
user_23773430
Related