Jump to content

My iframe embed block code is removing the navigation bar and all other blocks after it from my page

Recommended Posts

Site URL: https://skithefifty.com

This iframe code <iframe src="https://www.bivy.com/adventures/us/utah/cold-fusion-couloir-5286725048860672?framed=true" style="width:100%;height:500px”/>  in both embed and code blocks causes the site navigation bar to not appear on the site page ( on desktop and eliminates the nav hamburger on mobile) and causes any other blocks on the page below it not to appear. The block with the code does appear.

Page with iframe block problems:  https://skithefifty.com/cold-fusion

 

Similar page with no iframe block and no problems:  https://skithefifty.com/grand-teton

Any suggestions on what the issue is?

Link to comment
  • 2 weeks later...
  • 1 month later...
  • 6 months later...

After I embedded the job board code, the code is functioning great - and I can see the dropdown options, but when I move my cursor off of the main tab to select a dropdown - the dropdown options disappear before I can select one.

I would appreciate anyone's help and guidance. Thank you very much in advance! 😉

https://www.c4recruiting.com/hot-jobs#!/search?page=1

 

Screen Shot 26.png

Edited by IslandGirlVentures
Link to comment
  • 1 year later...

Hi there, 

I am having a similar problem and was wondering if someone may be able to assist me. I have a page on my site into which I have embedded an iframe using the following code <iframe src="https://conservationdatasolutions.github.io/index.html#13/-22.0820/29.0324" width="99%" height="500">. However I am finding that when I insert that code I lose the navigation bar and the featured image which I set in the media tab of the page settings. Does anyone know how to get around this issue so I can see both the navigation image and the iframe? 

Thanks!

Link to comment
On 4/27/2022 at 4:12 PM, ThatchandEarth said:

Hi there, 

I am having a similar problem and was wondering if someone may be able to assist me. I have a page on my site into which I have embedded an iframe using the following code <iframe src="https://conservationdatasolutions.github.io/index.html#13/-22.0820/29.0324" width="99%" height="500">. However I am finding that when I insert that code I lose the navigation bar and the featured image which I set in the media tab of the page settings. Does anyone know how to get around this issue so I can see both the navigation image and the iframe? 

Thanks!

Can you share link to page where you used embed iframe? We can check easier

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

How to: Setup Password & Share url Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care

Link to comment
  • 4 months later...

Is there any overall solution to this problem?

I am helping a client set up this page https://www.climatepolicylab.org/rddmap

(password rdd)

And having any instance of <iframe /> in either an Embed or Code block causes the main nav and footer to disappear. They are still present in the DOM when I inspect using the web inspector, but they are not visible, though they appear just fine in the page edit UI. In testing, I can have script tags or other HTML without causing this issue.

Here's what you see on the backend, note the navigation at the top:

image.thumb.png.1242d0ba37a67c18a3479d13597f0722.png

But when you save and view that page as a regular site visitor, you get no nav or footer:

image.thumb.png.2e7b249361494e6c93e77b77e8ecee78.png

If I take the iframe out, presto, nav and footer come back... And when I look at the source code for the page, all the HTML is still there. I'm a bit stumped about what could be going on here.

Link to comment

Create an account or sign in to comment

You need to be a member in order to leave a comment

×
×
  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Hire a Designer

Stand out online with the help of an experienced designer or developer.