Archived topic
Iframe not scrolling
19 replies · Started by James on August 16, 2017
Hello,
Heres the first of our tests on staging site: http://tctrucker.staging.wpengine.com/cdl-practice-tests/general-knowledge/practice/gkp1/
The quiz is an iframe with content from Proprofs. It's worked fine for years, until I was contacted by test takers about tests not scrolling. At end of every test is a report that they can't access. The content is just cutoff. This also happens on any answers that have a long description.
I deactivated all plugins, no effect, scrollbars still not working/appearing.
I deactivated generatepress theme and activated 2017 theme, and scrolling worked perfectly.
I activated all plugins with 2017 theme, scrolling still working fine.
I activated generatepress. problem back, no scrolling.
When inspecting, it appears the content is there, but something is causing scrolling to not happen, or content to not appear.
Thanks!
Hmm, that's very strange. I went through each selector to see if there was some GP CSS conflicting and couldn't find any.
The reason it's cutting off is because the iframe has a fixed height of 700. Perhaps the font size/line height is small in the Twenty Seventeen theme, so everything fits within that 700 height.
Perhaps it would be worth contacting the developer of the quiz script to see if they have any ideas about the height cutting off longer content within the iframe.
Let me know :)
I just made the height 700 recently, increased from 600. Tried 100% as well to no avail.
I'd have to make the height like 3000 to be able to fit the whole end of test report, but then it would have big empty white space before that.
I have been in contact with quiz developer. They merely point out that when inspecting the code it shows scrolling= no and overfill= no. I don't know where that code is coming from, it's not in the embed code I get from proprofs.
Hmm, well GP itself can't add those tags to the element. Did they not give you a solution for it?
This is one of the biggest drawbacks to iframes.
The iframe works fine with other theme though. And with the 2017 theme, the font has nothing to do with it. I'll put that theme back up and you can see that.
Oh well, I guess that's the extent of your help then? No other ideas?
I re-activated Beaver Builder theme instead, just to test. The iframe works with that as well. Just fyi.
I'm not seeing the quiz on that page anymore.
Sorry Tom, it's there now. I had activated beaver builder plugin, but the content was deleted from when I last used it.
Hmm, so now the scrolling attribute is set to "yes".
I'm also noticing the iframe doesn't have the same ID it did before.
Is the code you're using the insert the iframe the exact same? Being inserted into the page the same way?
I ask because GP doesn't have any control over the iframe attributes or IDs - it doesn't even know the iframe exists, it just gives you the content container. It seems strange that the iframe attributes would change depending on the theme.
For experimenting purposes I've been revising the code on that page. I now have 2 different versions of the code, one how it's been for years on the bottom, the newer one with shortcode brackets at the top. As you can see, they both work the same. But for testing purposes, you could look at any of our hundreds of tests in either practice or exam mode, they've been unchanged and have worked for years.
I agree that iframes suck, and I've been looking for suitable alternatives, but no WP plugin has fit the bill thus far.
Putting back up beaver builder was a mistake and messed up some pages, but seems better now, just for temporary reasons while you check the code. If / when you want, and I appreciate any time you've been looking at this, I can activate your theme again.
Perfect.
Can you activate GP again now? Make sure you just activate the theme - nothing else.
OK, it's active again.
So the only difference I'm seeing is that the sidebar has another iframe that isn't visible on the default theme. Can you try temporarily removing that right sidebar widget?
Hmmm. Oh, the first widget is a schools lead form. OK, it's deleted.
Wow, I should have thought about that. It's scrolling now. But weird that it didn't cause problem with other themes.