Inspiring

Answered

Need part of external website to fit

Forum|Forum|2 years ago
June 23, 2023
4 replies
2517 views

Before anyone asks, yes, I have permission from the National Weather Service to use this:

https://www.spc.noaa.gov/products/outlook/

I need a part of their website embeded into my website. I could just take a screenshot, but that updates several times a day. Here's the part that I need embedded on mine:

I've tried with iframe, and a div, and I can't seem to figure it out. I thought I almost had it, but when I mess with the css code, it screws up things on my website: https://www.arklahomaw.com/outlook.html (this is the page I want to put it on).

This topic has been closed for replies.

Correct answer jamedlock83

I am! It's not 100% like or how I want it, but it'll do

https://www.arklahomawx.com

B i r n o u

Legend

@jamedlock83 So what is going on ? are you set up now ?

J

jamedlock83AuthorCorrect answer

Inspiring

I am! It's not 100% like or how I want it, but it'll do

https://www.arklahomawx.com

B i r n o u

Legend

thank you for your feedback. it's true that we don't always get 100% of what we'd hoped for. but the main thing is that you're now able to provide the information service that needed to be activated.

B i r n o u

Legend

I've tried with iframe, and a div, and I can't seem to figure it out. I thought I almost had it, but when I mess with the css code, it screws up things on my website:
By @jamedlock83

in fact, to avoid any spillover from one to the other, make a clear distinction between the two: your page and your weather space.

So, CSS code your site as you would, remembering to integrate only the container block for displaying your external weather content (no matter how it's fed, iFrame, API, include, Rest, whatever...)... but it's represented by an ID (#foo), and only its display surface is taken into account in mobile mode up to 5K widescreens.

Once everything is ok and responsive, then you add a new CSS where all the rules start with #foo and which will only take into account the content of your weather area.

J

jamedlock83Author

Inspiring

Can't seem to get it to be mobile friendly though. . .

Nancy OShea

Community Expert

<iframes> are not mobile friendly.

Does NOA have a feed API you can use?

Nancy O'Shea— Product User & Community Expert

O

osgood_

Legend

that's not the point, I was just saying that APIs are powerful tools that aren't exclusively based on JavaScript programming.

that's not the point, I was just saying that APIs are powerful tools that aren't exclusively based on JavaScript programming.

By @B i r n o u

Whilst they are not exclusively based on javascript programming, javascript is probably the most convienient way to handle the data once you get it back from the API. These other programs (server-side) can be useful for hiding stuff you dont want to be public facing and may need to send to the API to get the data back, as javascript can't do that........with the exception of a javascript back-end solution like node.js of course. So if the API doesnt require any token/key etc I would use javascript, if on the other hand you are sending information which shouldn't be shared and could compromise your position, particuarly if you are paying for the data and not using a javascript back-end I'd use one of the other programs you mention and then manipulate the returned data with javascript as there are more options available, given you want a smooth user experience.

J

jamedlock83Author

Inspiring

Nevermind! I figured it out. . lol

Sign up

To post, reply, or follow discussions, please sign in with your Adobe ID.

Sign in to Adobe Community

To post, reply, or follow discussions, please sign in with your Adobe ID.

Scanning file for viruses.

This file cannot be downloaded