1

I have a website, and I need to add an inner page from the website into another project hosted in Squarespace.

I added the section as an iframe like below

 <iframe src="https://stackoverflow.com/" name="Stack" scrolling="No" height="500px" width="100%" style="border: none;"></iframe>

the stack overflow header has to hide in that section, I have tried to add in CSS and inline CSS, it's not working.

.top-bar js-top-bar top-bar__network {
    display: none !important;
}

Any possible way?

Nayana Chandran
  • 1,416
  • 1
  • 16
  • 30

1 Answers1

1

Assuming that:

  1. the two project websites are hosted on different domains and
  2. that you are not able to set the appropriate CORS header on the iframed ("child") website and
  3. you are able to add JavaScript to the child website,

then you could add the following script at the end of the body element of the child website:

<script>
(function() {
  if (window.self !== window.top) {
    document.getElementById("myHeader").style.display = "none";
  }
})();
</script>

In the code above, you would replace myHeader with the id of the element you want to hide when the site is iframed. What that script does is it detects whether the site is iframed and, if so, it adds in inline style to the header in order to hide it. Again, that is running within the child website, not the "parent" website with the iframe embedded in it.

However, if the two websites are hosted on the same domain, then you can access the iframe via JavaScript and add CSS and/or inline styles from the "parent" website. You can also do that if the appropriate CORS header is set.

Brandon
  • 3,572
  • 2
  • 12
  • 27
  • It may be best if you edit your question to provide links to both the site that is being embedded as an iframe and the page within which it is being embedded. The code above is a general approach; there could be a number of details to account for in your specific case. – Brandon May 28 '21 at 20:12
  • 1
    Thank for the answer, by the way there is a ';' in the if that pop an error. – MrGrabazu Jul 08 '22 at 14:22