• Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 7094
  • Last Modified:

Add style to cross domain iFrame

I want to add a style to a cross domain iframe so that the left nav and header are hidden in the iframe.  I basically just want to display the main content in the iframe.

I know that doing this with javascript is problematic due to security restrictions.  I don't have easy access to the iframe code but I might be able to add something as it is on the Point2 realestate site and there might be a way to add content but I think I would have to add some javascript.

If so, maybe there would be a way to just check if there is a parent frame and if the parent frame is my frame.  I could then set the style of those elements to display: none.  Wondering if there is another way with CSS in the iframe of some other method.  I don't think there is an easy way or any way to do it from the parent.
0
sscotti
Asked:
sscotti
  • 3
  • 2
1 Solution
 
stilliardCommented:
You could try using php, you could have your iframe link to a page on your domain, which would request the page you want, but you could also embed css into the page this way.

Other than this, i found a site asking what i think is the same question and they have several ideas on there.
http://stackoverflow.com/questions/217776/how-to-apply-css-to-iframe
0
 
sscottiAuthor Commented:
Can you elaborate on the first option.  I am using PHP.  Is this pretty much like using a proxy?
0
 
stilliardCommented:
basicly your php file refferenced by the iframe should look something like this:

 
<?php

// set the url of the page you would have previously linked to in the iframe
//$url = 'http://www.website-to-request.com/';
$url = 'http://www.reallyeasycart.co.uk/';

// Setup the new css you want to inject into the page 
$css = '
<style type="text/css">

body { background: green; }
.some-other-elements { ... }

</style>
';

// Get the file contents (you may want to replace this with a curl request 
$site_content = file_get_contents($url);

// a simple way to inject style into this page would be to ad it directly above the closing head tag (if there is one) 
// this can be changed to any element, or even using the dom class you could ammend this with more detail. 
$site_content = str_replace('</head>', $css.'</head>', $site_content);

// you may also need to inject a base href tag so all the links inside are still correct
// comment out the next line if not needed 
$site_content = str_replace('<head>', '<head><base href="'.$url.'" />', $site_content);

// return the site contents to the browser
echo $site_content;
?>

Open in new window

0
 
stilliardCommented:
sorry about that, just ignore the reference to the url on there, ive been looking at there e-commerce cart today and thought id test this script on them for a second, its not important to the script anyway.
basicly you would replace that url with the one you want to use,
and then add the css into the $css var.
0
 
sscottiAuthor Commented:
I like that.
0
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

Join & Write a Comment

Featured Post

Ultimate Tool Kit for Technology Solution Provider

Broken down into practical pointers and step-by-step instructions, the IT Service Excellence Tool Kit delivers expert advice for technology solution providers. Get your free copy now.

  • 3
  • 2
Tackle projects and never again get stuck behind a technical roadblock.
Join Now