Question about iframes

So I'm looking to start somewhat of a new businessmodel, by others known as rank&rent or rent-a-serp. It's definitely not new, but out here in the Netherlands we're a little slow with SEO sometimes...

Basically the idea is to rank a personal property for a high end local kw, let's say 'dentist in Amsterdam', and start renting it out for €XXX a month to a dentist in that area using a fullscreen iframe to show his website over your own.

Now back in the day I did some of this stuff with mixed succes. I like using WordPress for it's simplicity and had a nice little page / post template that would get rid of all the excess elements on the page / post. But as time went by, and WordPress started updating.... my waterproof concept somewhat fell apart. The content underneath the iframe started showing and I got scrollbars all over the place. Sometimes updates even got rid of the template completely!

Is there anyone out there who has some experience on this matter? Or maybe executing the above method succesfully as we speak? Perhaps there's a way easier way of doing this?

Something like this I guess (it's not perfect though):

-Switch to "text" from editor
-Add following code (you can add it anywhere you like):

<iframe src="http://www.source.com/desired_page.html style="position:fixed; top:0px; left:0px; bottom:0px; right:0px; width:100%; height:100%; border:none; margin:0; padding:0; overflow:hidden; z-index:999999;">
Your browser doesn't support iframes
</iframe>

Tested on posts and it works decent enough. Scrolling bars are there and iframe loads after the content = not perfect. A bit of javascript could solve loading issue I believe. And you would be left with scrolling bars to fix.

That would be the quickest "fix" for what you need done. I played around with couple of plugins and, to my surprise, not single one of them does this properly. Not even close.

Hope this helps.

fanatik1389 said:

Something like this I guess (it's not perfect though):

-Switch to "text" from editor
-Add following code (you can add it anywhere you like):

<iframe src="http://www.source.com/desired_page.html style="position:fixed; top:0px; left:0px; bottom:0px; right:0px; width:100%; height:100%; border:none; margin:0; padding:0; overflow:hidden; z-index:999999;">
Your browser doesn't support iframes
</iframe>

Tested on posts and it works decent enough. Scrolling bars are there and iframe loads after the content = not perfect. A bit of javascript could solve loading issue I believe. And you would be left with scrolling bars to fix.

That would be the quickest "fix" for what you need done. I played around with couple of plugins and, to my surprise, not single one of them does this properly. Not even close.

Hope this helps.

Click to expand...

Thanks for your help! Haven't been on BHW for a while but you guys never let me down.
I tried your code on a testdomain in a post (result:http://www.vincks.com/uncategorized/iframe-bericht/), unfortunately something is stripping the styling away.
Once I swich from "text" to "visual" and then back to "text" this is all that's left.

<iframe src="http://www.source.com/desired_page.html style=" width="300" height="150">
Your browser doesn't support iframes
</iframe>

Any idea why WordPress or maybe the theme (Twenty Sixteen) is doing this? and how to prevent it from happening?

Mr Wonderful said:

Thanks for your help! Haven't been on BHW for a while but you guys never let me down.
I tried your code on a testdomain in a post (result:http://www.vincks.com/uncategorized/iframe-bericht/), unfortunately something is stripping the styling away.
Once I swich from "text" to "visual" and then back to "text" this is all that's left.

<iframe src="http://www.source.com/desired_page.html style=" width="300" height="150">
Your browser doesn't support iframes
</iframe>

Any idea why WordPress or maybe the theme (Twenty Sixteen) is doing this? and how to prevent it from happening?

Click to expand...

No idea my man... You can test code here for example: http://www.onlinehtmleditor.net/
Quick copy paste and you'll see.

I'll take a look at twenty sixteen and how it behaves. No other plugins custom stuff?

Edit: Working on twenty sixteen... Dropping you a pm with working example.

iframes are inconsistent try something like this:

<iframe src="http://www.source.com/desired_page.html scrolling="no"
seamless="seamless"
style="position:absolute; top:0px; left:0px; bottom:0px; right:0px; width:100%; height:100%; border:none; margin:0; padding:0; overflow:hidden; overflow-x:hidden; overflow-y:hidden; z-index:999999;">

As you can see im using seamless="seamless", scrolling="no" and additional overflow-x:hidden; overflow-y:hidden; also im positioning the iframe absolutely so it should be inside relatively positioned block element (in you case most likely body) and the page inside should be responsive. This will remove scrollbars in most browsers. How are you going to keep rank with embedded website? To do what you want you would have to replace your page content with hole in your page (because thats what iframe is) and from my experience google often don't like it (because spammers and phishers do it on daily basis)

fanatik1389 said:

No idea my man... You can test code here for example: http://www.onlinehtmleditor.net/
Quick copy paste and you'll see.

I'll take a look at twenty sixteen and how it behaves. No other plugins custom stuff?

Edit: Working on twenty sixteen... Dropping you a pm with working example.

Click to expand...

Somebody give this man a cookie!
No custom stuff, removed all non standard plugins.

Mr Wonderful said:

Somebody give this man a cookie!
No custom stuff, removed all non standard plugins.

Click to expand...

Did you get my pm? It is working. Don't know why it's not working for you and I can't tell without taking a closer look.

Now... If the code is inserted inside your page (inspect element) it displays fine. See attached image.

Edit: My bad, I'm an idiot. Messed up code I sent you the first time. Missed quote sign at the end of src.
Here's proper code:

<iframe src="http://www.source.com/desired_page.html" style="position:fixed; top:0px; left:0px; bottom:0px; right:0px; width:100%; height:100%; border:none; margin:0; padding:0; overflow:hidden; z-index:999999;">
Your browser doesn't support iframes
</iframe>

b1acky said:

iframes are inconsistent try something like this:

<iframe src="http://www.source.com/desired_page.html scrolling="no"
seamless="seamless"
style="position:absolute; top:0px; left:0px; bottom:0px; right:0px; width:100%; height:100%; border:none; margin:0; padding:0; overflow:hidden; overflow-x:hidden; overflow-y:hidden; z-index:999999;">

As you can see im using seamless="seamless", scrolling="no" and additional overflow-x:hidden; overflow-y:hidden; also im positioning the iframe absolutely so it should be inside relatively positioned block element (in you case most likely body) and the page inside should be responsive. This will remove scrollbars in most browsers. How are you going to keep rank with embedded website? To do what you want you would have to replace your page content with hole in your page (because thats what iframe is) and from my experience google often don't like it (because spammers and phishers do it on daily basis)

Click to expand...

Gotta tell you, I'm not much of a coder of any kind. But I tried your code and we're slowly getting somewhere here. This is the result: http://www.vincks.com/uncategorized/iframe-post-b1acky/
The 'post area' is filled with the iframe, the original testwebsite is showing at the sides though, it's almost like WordPress is keeping the iframe within a cage or something.
The text field once again changes the code when switching between text and visual.
This is what's left after switching:

<iframe style="position: absolute; top: 0px; left: 0px; bottom: 0px; right: 0px; width: 100%; height: 100%; border: none; margin: 0; padding: 0; overflow: hidden; overflow-x: hidden; overflow-y: hidden; z-index: 999999;" src="http://www.source.com/desired_page.html scrolling=" width="300" height="150" seamless="seamless"></iframe>

Regarding the rankings, I will be experimenting to see wether or not they'll stick. I'll mainly be targeting low competition, local searches so there's not a lot of 'surveillance'.

fanatik1389 said:

Did you get my pm? It is working. Don't know why it's not working for you and I can't tell without taking a closer look.

Now... If the code is inserted inside your page (inspect element) it displays fine. See attached image.

Edit: My bad, I'm an idiot. Messed up code I sent you the first time. Missed quote sign at the end of src.
Here's proper code:

<iframe src="http://www.source.com/desired_page.html" style="position:fixed; top:0px; left:0px; bottom:0px; right:0px; width:100%; height:100%; border:none; margin:0; padding:0; overflow:hidden; z-index:999999;">
Your browser doesn't support iframes
</iframe>

Click to expand...

Got it, we're gonne figure this one out!
I spotted the missing quote so I tried with and without it, tough luck though.
Starting to think there might be something fishy about this WP install / theme or something.

Mr Wonderful said:

Got it, we're gonne figure this one out!
I spotted the missing quote so I tried with and without it, tough luck though.
Starting to think there might be something fishy about this WP install / theme or something.

Click to expand...

http://www.vincks.com/uncategorized/iframe-bericht/
You have iframe starting like this now
================================================
<iframe src="http://www.source.com/desired_page.html style=" position
================================================
You want this (whole thing):
================================================
<iframe src="http://www.source.com/desired_page.html" style="position:fixed; top:0px; left:0px; bottom:0px; right:0px; width:100%; height:100%; border:none; margin:0; padding:0; overflow:hidden; z-index:999999;">
Your browser doesn't support iframes
</iframe>
================================================
Copy/paste it and it will work.

Ending quote needs to be placed right after "desired_page.html".

fanatik1389 said:

http://www.vincks.com/uncategorized/iframe-bericht/
You have iframe starting like this now
================================================
<iframe src="http://www.source.com/desired_page.html style=" position
================================================
You want this (whole thing):
================================================
<iframe src="http://www.source.com/desired_page.html" style="position:fixed; top:0px; left:0px; bottom:0px; right:0px; width:100%; height:100%; border:none; margin:0; padding:0; overflow:hidden; z-index:999999;">
Your browser doesn't support iframes
</iframe>
================================================
Copy/paste it and it will work.

Ending quote needs to be placed right after "desired_page.html".

Click to expand...

Alright, I made a fresh install, same theme, added the ending quote and now things are working perfectly!

For anyone trying to do the same thing here, this is the code you'll need to use, simply paste it in the "text" field - big time credits to fanatik1389:

<iframe src="http://www.source.com/desired_page.html" style="position:fixed; top:0px; left:0px; bottom:0px; right:0px; width:100%; height:100%; border:none; margin:0; padding:0; overflow:hidden; z-index:999999;">
Your browser doesn't support iframes
</iframe>

Mr Wonderful said:

Alright, I made a fresh install, same theme, added the ending quote and now things are working perfectly!

For anyone trying to do the same thing here, this is the code you'll need to use, simply paste it in the "text" field - big time credits to fanatik1389:

<iframe src="http://www.source.com/desired_page.html" style="position:fixed; top:0px; left:0px; bottom:0px; right:0px; width:100%; height:100%; border:none; margin:0; padding:0; overflow:hidden; z-index:999999;">
Your browser doesn't support iframes
</iframe>

Click to expand...

im expierencing some sort of delay. when loading and switching pages. It will disappear then reappear

Thank you brother.

It worked perfectly on my wordpress site!!