<iframe>
code in there. OR even better create a custom template for that page with the iframe inside and simply create a page and assign that page template to it leaving the editor empty inside WordPress.
This ends as your native WordPress menu is actually loading a WordPress page that loads everything else.
There are also some nice jQuery scripts out there that could easily take care of your iframe’s height. Since you will be changing from page to page in your forum within the iframe the height of the page will be different. Those scripts will prevent the scrollbars and will resize the height if the iframe as needed, thus ending up in a seemingly ‘native’ wordpress page.
]]>I haven’t tried a custom page template, I will look into that.
Still one might reasonably expect WordPress to provide for this kind of embedding. Back in the good old days before CMS and HTML5 we did this using a frameset with one of the frames being used for the site banner and menu bar… but they killed that. Chrome won’t even display old-school frames anymore.
]]>It should look like an actual part of the theme.
You’re going about this the wrong way. You need to make this separate application look like the WordPress theme outside of WordPress. You can do this by pointing to the theme’s style.css file.
I need it to cover the entire space from the side of the screen to the widgets on the other side, from the top menu to the bottom menu the way text pages do.
This is a much easier problem to deal. Can you show us the problem? Then we can attempt to resolve it with CSS and maybe JS.
]]>Thank you for the tip on the plugin … I will investigate that this afternoon.
To show you the problem take any external “full screen” application, even good old notepad, and embed it into an empty page with only the iframe line at the top.
<iframe width=100% height=100% src="https://www.localhost/forum"></iframe>
Will result in the application covering the correct width but it will only be about 3 inches tall… the default height of a one line page. I tried cheating and setting the height to 5000 and it worked, more or less… but then I had two scroll bars, one in the application and the other in word press.
]]>The one you pointed me to seems to be focused on videos and probably has WP’s whitelist active when embedding. I’ll let you know how that turns out…
]]>In this case the height of the content could run into thousands of lines as people open pages and read through longish lists of comments… and that can change within the application itself. I don’t mind if there’s a scroll bar on the embedded page, so long as there aren’t two of them.
Picture your typical theme… widgets on the right, with an open area that spans from the bottom of the menu to the bottom of the screen and from the left window frame to the border of the widgets area… What I need is for the embedded application to take up that entire client area.
It wold also help if it could trigger WordPress to expand down past the bottom of the screen as it does on longer text files, in step with the application’s height. But that can change from moment to moment … For example: viewing the profile page occupies a lot less geography than viewing a list of all messages.
I’m using the Vanilla Forums application in self-hosted mode (not the online one) and it includes a provision for embedding… all the window dressing disappears and all you see is the forum content. So no worries about it not looking like wordpress… it’s just the issue of getting it to seamlessly fit into that available page area in WordPress.
I have done some searching for code snippets to make this work and did try a couple in the page itself. One of two things happens… either it only discovers the height of the page it’s in (usually around 3 inches) or I end up with two scroll bars.
I’m not very familiar with PHP, JS or CSS at this point, although I’ve done some windows programming in the past.
]]>This script constantly refreshes the parent iframe with the current content height. So when you click a link in your forum and the iframe page changes that script will say ‘hey i went from 400px height to 1000px height’ so your iframe will scale up to 1000. This way you only have 1 global window scrollbar as usual and it emulates your website like not even having an Iframe.. It would be like a normal WordPress page with it’s content either sort or long.
Take a look at this -> https://www.willmaster.com/library/tutorials/auto-resize-iframe-when-content-size-changes.php
The “iFrame Resizing Test” that has the button insde is actually an iframe. You will see that it will get ‘shorter’ when you click. That’s what the js script will do.
Pretty much seamlessly adding any iframe content to any page ??
I don’t know if the link provided here would fit your needs but you can get the general idea of what I would go for as a solution. There are tons of different scripts like this out there to pinpoint one that will work best for you.
]]>