Closed jerrell-rebel closed 3 months ago
Check the console output, I'm seeing error 403 in the iframe when it tries to load the js file.
There might have been a hiccup but I don't see the 403 error on my console on my end now.
It's also worth mentioning I've set the warningTimeout to 20000.
You're right! I didn't notice because my IP was whitelisted in my .htaccess file. For others experiencing the same error, here's how I managed to allow access without compromising the security/permissions of my other files.
You can try to adjust the file's permission first to 7/5/5 - ultimately allowing/ticking everything on the Execute row.
If that still does not work, you might have an .htaccess file nested on your /wp-admin folder. Put on this code -
<Files "iframeResizer.contentWindow.min.js">
Allow From All
</Files>
#iFrame Resizer allow execution/permission
Again, thank you David for this awesome library! 🤘
Glad it works now. Could I ask a small favour, I'm currently updating the docs and I would love to add a small guide on how to use iframe-resizer with WordPress, but I've never used it. I was wondering, if you could detail how you set it up, so I could include it and help everyone else.
I would have expected 644
to be ok for the permission, as it does not run on the server.
Sure thing! In my case, we use a theme builder and a cpanel hosting with some custom security blocks to only allow certain IP's to access files.
I uploaded the files to the /wp-admin/js path and put on the htaccess code above.
On the iframe host, I called the iframeResizer.contentWindow.min.js file using a plugin called "Header Footer Code Manager (HFCM)" and on the iFrame caller, I just pasted this code and everything works right off the bat.
Everything just seems to be very similar with a non-wordpress website. Please let me know if there's anything else you need to know. Thanks again!
iframe {
width: 1px;
min-width: 100%;
}
/*@media only screen and (max-width: 767px) {
iframe {
min-height: 500px !important;
}
}*/
</style>
<script src="https://domain.com/wp-admin/js/iframeResizer.min.js"></script>
<iframe id="myIframe" src="domain.com"></iframe>
<script>
// Initialize iframe resizer
iFrameResize({ log: true }, '#myIframe');
</script>```
Thank you, I've just put a page together on the draft website for Version 5. https://iframe-resizer.com/frameworks/wordpress/
Firstly, great work on the resizer! Works well on desktop. Just one small issue, when I test it on my mobile, it does not resize the iFrame. Half of the content just sinks, it does not calculate the dynamic height too. Here's the page for reference - thebreeze.com.au/who-we-work-with/
Nothing too special on how it is called. Just the regular CSS (iframe {width: 1px;min-width: 100%;}) script code (iFrameResize({ log: true }, '#myIframe');). I have also tried and experimented the different values from heightCalculationMethod.
resizer version is v4.3.9
Please let me know if you need more info! Thanks :)