meteoblue delivers high-quality local or worldwide weather information for any point on land or sea in the world. For the general public, meteoblue offers a free high-resolution weather forecast that can be used in a Source iFrame Block.
- Go to the meteoblue homepage here and scroll down to the Widgets section along the left side of the page:
- The following steps are the same for all the widgets, but for this example, "Widget Day" will be the one used. After clicking "Widget Day", enter the desired location at the top of the page. In this example, Boston, MA:
- On the main page are the configuration settings available you can include or exclude in the final weather display. Check and uncheck based on your desired outcome. Results are shown in the live preview. The example above uses the following options (it is recommended for this widget to use "no background: bright text" as it will be overlayed on the SAM gray background.
- As the settings are configured, the embed code is being created on the fly in the box below the settings:
- The full HTML code is seen here. The text highlighted in orange show which portion of the embed code to use in the Source iFrame Block:<iframe src="https://www.meteoblue.com/en/weather/widget/daily/boston_united-states-of-america_4930956?geoloc=fixed&days=7&tempunit=FAHRENHEIT&windunit=MILE_PER_HOUR&precipunit=INCH&coloured=coloured&pictoicon=0&pictoicon=1&maxtemperature=0&maxtemperature=1&mintemperature=0&mintemperature=1&windspeed=0&windspeed=1&windgust=0&winddirection=0&winddirection=1&uv=0&humidity=0&precipitation=0&precipitation=1&precipitationprobability=0&precipitationprobability=1&spot=0&pressure=0&layout=dark" frameborder="0" scrolling="NO" allowtransparency="true" sandbox="allow-same-origin allow-scripts allow-popups allow-popups-to-escape-sandbox" style="width: 378px; height: 420px"></iframe><div><!-- DO NOT REMOVE THIS LINK --><a href="https://www.meteoblue.com/en/weather/week/boston_united-states-of-america_4930956?utm_source=weather_widget&utm_medium=linkus&utm_content=daily&utm_campaign=Weather%2BWidget" target="_blank">meteoblue</a></div>
- Add an iFrame Block to the SAM, and enter the highlighted link into the URL field. The weather day widget will now display in the block.
When published, the widget stays updated to the current conditions whenever a user opens the SAM.
Comments
0 comments
Please sign in to leave a comment.