• Global community
    • Language:
      • Deutsch
      • English
      • Español
      • Français
      • Português
  • 日本語コミュニティ
    Dedicated community for Japanese speakers
  • 한국 커뮤니티
    Dedicated community for Korean speakers
Exit
Locked
0

Need part of external website to fit

Explorer ,
Jun 23, 2023 Jun 23, 2023

Copy link to clipboard

Copied

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:

 

Untitled.png

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).

Views

589

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines

correct answers 1 Correct answer

Explorer , Jul 11, 2023 Jul 11, 2023

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

https://www.arklahomawx.com

Votes

Translate

Translate
Explorer ,
Jun 23, 2023 Jun 23, 2023

Copy link to clipboard

Copied

Nevermind!  I figured it out. . lol

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Explorer ,
Jun 23, 2023 Jun 23, 2023

Copy link to clipboard

Copied

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

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Explorer ,
Jun 23, 2023 Jun 23, 2023

Copy link to clipboard

Copied

@osgood-Can you help me with this?

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Jun 23, 2023 Jun 23, 2023

Copy link to clipboard

Copied

<iframes> are not mobile friendly. 

Does NOA have a feed API you can use?

 

 

 

Nancy O'Shea— Product User, Community Expert & Moderator
Alt-Web Design & Publishing ~ Web : Print : Graphics : Media

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Explorer ,
Jun 23, 2023 Jun 23, 2023

Copy link to clipboard

Copied

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Jun 23, 2023 Jun 23, 2023

Copy link to clipboard

Copied

How about Web Services API (version 2) Documentation | Climate Data Online (CDO) | National Climatic Data Cent...

 

As @Nancy OShea has stated, the current method for retrieving or in any way interacting with data across the internet is by using API's. <iframe>'s are certainly not the way to go.

 

If you want a more friendly development environment for API's, then I suggest using Wappler as you tool of choice. The following allows you to create the data set

BenPleysier_0-1687568418085.png

where you need to enter the authorisation and define your schema.

 

Wappler, the only real Dreamweaver alternative.

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Explorer ,
Jun 23, 2023 Jun 23, 2023

Copy link to clipboard

Copied

I know nothing about APIs. . I just now learned (thanks to Nancy) how to setup a server-side-includes. . .

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Jun 25, 2023 Jun 25, 2023

Copy link to clipboard

Copied

quote

I know nothing about APIs.

By @jamedlock83

=========

You should learn.  API's are powerful tools based on JavaScript programming -- a fundamental website language.

- https://www.w3schools.com/js/

 

APIs are sets of definitions and protocols that allow software components to talk and interact with each other using a simple set of commands.

https://developer.mozilla.org/en-US/docs/Learn/JavaScript/Client-side_web_APIs/Introduction

 

Nancy O'Shea— Product User, Community Expert & Moderator
Alt-Web Design & Publishing ~ Web : Print : Graphics : Media

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Jun 26, 2023 Jun 26, 2023

Copy link to clipboard

Copied

quote

You should learn.  API's are powerful tools based on JavaScript programming --

By @Nancy OShea

 

When you put it that way, it sounds exclusive... which it isn't... Python, Ruby, C# and PHP, among others, can also deal with APIs.

https://rapidapi.com/blog/how-to-use-an-api-with-php/

https://rapidapi.com/blog/how-to-use-an-api-with-python/

https://rapidapi.com/blog/how-to-use-an-api-with-ruby/

i.e also https://github.com/open-meteo/open-meteo propose SDK for .net, kotlin, Android, Rust, Laravel, Symfony...

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Jun 26, 2023 Jun 26, 2023

Copy link to clipboard

Copied

@B i r n o u 

That's true. Pick your favorite flavor -- vanilla, strawberry, cherry, chocolate or salted caramel...  

 

For non-developers who are new to APIs, JavaScript (vanilla) is the most widely available off the shelf.  IMO, it's the best place to start.

 

Nancy O'Shea— Product User, Community Expert & Moderator
Alt-Web Design & Publishing ~ Web : Print : Graphics : Media

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
LEGEND ,
Jun 26, 2023 Jun 26, 2023

Copy link to clipboard

Copied

quote

 

When you put it that way, it sounds exclusive... which it isn't... Python, Ruby, C# and PHP, among others, can also deal with APIs.

https://rapidapi.com/blog/how-to-use-an-api-with-php/

https://rapidapi.com/blog/how-to-use-an-api-with-python/

https://rapidapi.com/blog/how-to-use-an-api-with-ruby/

i.e also https://github.com/open-meteo/open-meteo propose SDK for .net, kotlin, Android, Rust, Laravel, Symfony...


By @B i r n o u

 

Although they can all connect to APIs and bring back the goodies they can't do much else, unless you like page reloads. If you are dealing with APIs I personally think javascript is an 'ALL IN ONE' workflow, a streamlined no page reload solution.

 

 

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Jun 26, 2023 Jun 26, 2023

Copy link to clipboard

Copied

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

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
LEGEND ,
Jun 26, 2023 Jun 26, 2023

Copy link to clipboard

Copied

quote

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. 

 

 

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Jun 26, 2023 Jun 26, 2023

Copy link to clipboard

Copied

Having used RESTful API's for some time now, I can assure you that there are plenty of ways to communicate with the API as this image shows:

BenPleysier_0-1687818965930.png

The great part is that they all return the data in JSON or XML format as shown:

BenPleysier_1-1687819077761.png

This can all be done on the server, so no exposure to the outside world. I have only used the JSON data format which acts in conjunction with App Connect to provide a seamless user experience.

 

Having the right development environment provides an easy way to incorporate RESTful API's. My tools of choice, Wappler and Postman.

 

 

Wappler, the only real Dreamweaver alternative.

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
LEGEND ,
Jun 27, 2023 Jun 27, 2023

Copy link to clipboard

Copied

How comes you are using php server side and not node.js to pull back the data, I was under the impression that you had totally moved away from using php?

 

But yes, l sometimes use php to even pull data from a local database and return it as json then manipulate it with vanilla javascript rather than using php. It really depends on what lm doing.

 

Everything is available, sometimes it's just about knowing what to use for ease of use and particular situations.

 

 

 

 

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Jun 27, 2023 Jun 27, 2023

Copy link to clipboard

Copied

quote

How comes you are using php server side and not node.js to pull back the data, I was under the impression that you had totally moved away from using php?

By @osgood_

 

I do develop using Node. The example above not only shows PHP but a raft of other languages including JavaScript (Node).

 

quote

But yes, l sometimes use php to even pull data from a local database and return it as json then manipulate it with vanilla javascript rather than using php. It really depends on what lm doing.


By @osgood_


That is an excellent workflow. But why only sometimes?.

Wappler, the only real Dreamweaver alternative.

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
LEGEND ,
Jun 27, 2023 Jun 27, 2023

Copy link to clipboard

Copied

quote
quote

How comes you are using php server side and not node.js to pull back the data, I was under the impression that you had totally moved away from using php?

By @osgood_

 

I do develop using Node. The example above not only shows PHP but a raft of other languages including JavaScript (Node).

 

quote

But yes, l sometimes use php to even pull data from a local database and return it as json then manipulate it with vanilla javascript rather than using php. It really depends on what lm doing.


By @osgood_


That is an excellent workflow. But why only sometimes?.


By @BenPleysier

 

I still find php is quick to set up and get going, that's why l prefer to use it for server side coding. Having said that lm probably much more familiar with vanilla javascript these days as it offer a better front end experience for the user. php is still fine for front end but obviously it requires a page reload for it to do anything worthwhile so l mainly use it these days for querying databases, maybe to get data from an API, form validation, etc

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Jun 27, 2023 Jun 27, 2023

Copy link to clipboard

Copied

quote

I still find php is quick to set up and get going, that's why l prefer to use it for server side coding.


By @osgood_

 

The same reason why I now use Node. If I were using a different development environment, like Dreamweaver, I would also prefer to use PHP. In fact, if the environment was such, I would love to use CFML (ColdFusion)

Wappler, the only real Dreamweaver alternative.

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
LEGEND ,
Jun 28, 2023 Jun 28, 2023

Copy link to clipboard

Copied

That's probably because you are using a deployment of node that is done for you rather than having to manually go through the tedious process of having to gather, import/require all the necessary middleware for it to do anything, thats before you then need to set up the routing and maybe even divide that into several files so it doesn't all become one big overly complex js file etc etc. I don't know how Wappler handles all of that processing but l would not feel comfortable unless l knew what was going on behind the scenes, which l guess is probably not the most important priority for some developers. If node wasn't such a pain in the bottom to initially gather together, file/route manage manually and distribute l would probably be using that. Once you factor in ejs templating it's really not that much more cleaner than distributing php through out the html, in fact there is very little difference, its the initial node set up which l cant get over and adopt.

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Jun 30, 2023 Jun 30, 2023

Copy link to clipboard

Copied

quote

That's probably because you are using a deployment of node that is done for you rather than having to manually go through the tedious process of having to gather, import/require all the necessary middleware for it to do anything, thats before you then need to set up the routing and maybe even divide that into several files so it doesn't all become one big overly complex js file etc etc.


By @osgood_

 

I can't believe that I am saying this, but I agree with you. Wappler is the only reason why I have adopted NodeJS. 

 

quote

 I don't know how Wappler handles all of that processing but l would not feel comfortable unless l knew what was going on behind the scenes, which l guess is probably not the most important priority for some developers.


By @osgood_

 

That is one of the challenges that is easily overcome. The process that Wappler follows is the same as if it were handcoded. The difference is that my Wappler mate writes all of the boring stuff allowing me to keep my mind fixed on what matters.

 

The alternative is to follow a course like this excellent playlist.

 

But hey! For an average website, might as well stay with PHP if that is your forte.

 

 

 

Wappler, the only real Dreamweaver alternative.

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
LEGEND ,
Jun 30, 2023 Jun 30, 2023

Copy link to clipboard

Copied

quote

But hey! For an average website, might as well stay with PHP if that is your forte.

 


By @BenPleysier

 

 

Two lines of thought really, many above a certain age won't unnecessarily get dragged into a 'flavour of the month' workflow. Most gen Z now cut their teeth on frameworks, libraries and mostly javascript, therefore are far more likely to gravitate to a javascript back end solution, without the knowledge of comparing it with another back end solution. Why learn something else when your three quarters of the way there anyway. This stupid debate about which is better is fueled by those who probably only know one solution rather than basing their opinions on actually having explored other options. I don't listen to this nonsense noise any longer it's interesting but mostly based on hot air. I don't think it helps to bring the web development community together though, which is the negative downside of so many variations being available, all of which are capable, in most cases, of producing exactly the same results.

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Jun 25, 2023 Jun 25, 2023

Copy link to clipboard

Copied

quote

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.

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Jul 11, 2023 Jul 11, 2023

Copy link to clipboard

Copied

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

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Explorer ,
Jul 11, 2023 Jul 11, 2023

Copy link to clipboard

Copied

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

https://www.arklahomawx.com

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines