Hi, scroll to top does work on every reload of the page. If you like that this is done only on specific elements you need to use the "External workaround" and there you can specify the element where the scroll to top should happen. Here http://www.tinywebgallery.com/blog/advanced-iframe/advanced-iframe-pro-demo/external-workaround-with-post-message you find a working example. -> var scroll_to_top = "#totop";
you can set this on the "External workaround" tab at "Scroll to top".

Not sure how I can write a documentation how to fix popups which I don't even know about. I assume there are 1000 popup solutions around which all need to be treated differently. Basically it is easy. The owner of a page who has popups also needs to make sure his popups work fine in an iframe. So actually the owner/developer of https://apps.rivercoyotedesign.com/edc-farmtrails.org/ should fix this in the 1st place. With my plugin you can modify some styles in the page you include. Have you tried this already? in your case I don't see any settings in the ai_external.js yet.

Go to the advanced tab -> modify the iframe

set:

Content id in iframe: .mfp-content

Content styles in iframe: max-height: 90vh

Save this so that ai_external.js is generated again.

you can also try to use a fix size. Maybe also the owner of https://apps.rivercoyotedesign.com/edc-farmtrails.org/ can configure his popup plugin.

Best regards, Michael

I have added my idea also to the FAQ: http://www.tinywebgallery.com/blog/forum/advanced-iframe-faq/how-popups-in-iframes-can-maybe-be-fixed#post-954

The popup is working fine on the source https://apps.rivercoyotedesign.com/edc-farmtrails.org/ but not working on iframe. I added this 

Content id in iframe: .mfp-content

Content styles in iframe: 90vh

Nothing work. 

I added scroll to top and it's going to the element where I point. But my question is scroll to top only happen if click on a specific button not everywhere. Now click on any element goes scroll to top. 

Hi,

I checked your configuration. In the rendered code I see:

if(typeof iframe_content_id==='undefined'){var iframe_content_id='.mfp-conten';}
if(typeof iframe_content_styles==='undefined'){var iframe_content_styles='90vh';}

As you see there it a "t" missing at the first setting.

for the style I missed before the which style you need. so I would use

max-height: 90vh

If changing the style does not work it is maybe overwritten by the popup script again! You can try to fix this by setting "max-height: 90vh !important" + then on the external workaround tab you need to specify that css is rendered directly. Then this setting cannot be overwritten that easily.

For the scroll to top: You have now configured this twice! once in the shortcode which is triggered on every page load and the other one before the ai_external.js. And of course both do work. So simply remove the setting in the shortcode and keep the solution you want.

Still I recommend for the popup you fix the popup itself! Because this is the one not working properly in an iframe. Many popup solutions do work in an iframe. The one which is used one your page does not...

Please also check the documentation in the administration how to modify several styles!  Because very often this is needed as well! e.g. one is fixing the background, one is fixing the size of the popup itself...

Best regards, Michael