How to show Weather Forecast in Newspaper theme

by

Are you using the Newspaper theme on your WordPress website and want to use the weather forecast element on your website? Do not worry you are at the right place.

In this tutorial, we will learn to use the weather forecast widget available in the Newspaper theme.

Get NewsPaper theme

So, let’s get started. 

Why use the weather forecast widget in Newspaper theme?

There are many benefits of using the weather widget module on Newspaper theme by tagDiv. As Newspaper theme is designed more from a newspaper/magazine perspective, you would like to add the weather widget as it engages your audience. Adding a weather widget might be helpful for you to increase your audience’s time duration on your website.

Getting the Weather API key

The first step to show the weather forecast on the newspaper theme is to get a weather API key. For that, we need to create an account on OpenWeather.

  • Create an account on Open Weather. You can create your account on OpeanWeather from here
  • Click on API Keys option and there you will see a default API key. You can generate a new API key if you don’t see any
  • Copy the OpenWeather API key from there. You will need this API key later.
OpenWeather API dashboard.
Fig: Getting API key from OpenWeather.

Showing detailed weather forecasts on pages In Newspaper theme

If you want to show a detailed weather forecast widget on your home page or other different pages then this option is best for you.

Newspaper theme weather forecast widget
Fig: Example of detailed weather widget used in the homepage of Newspaper theme.
  • Login to your Newspaper theme powered WordPress website
  • Open the page where you want to show the weather widget. In this example, we are opening our homepage
  • Now click on edit with tagDiv composer from the header section of the homepage
  • From the tagDiv composer click on “Add Element” and search “Weather”
  • Drag the Weather element to your page where you want the weather forecast to be shown
  • Paste the API key in the weather settings of the Weather module
  • On the Location option use your desired location code, you can get your location shortcode from here. This location will be shown to users by default. However, they can change it by clicking on the widget and giving the location access to your website. 
Weather widget dashboard in newspaper theme.
Fig: Adding the weather widget on homepage.

Finally, you have completed the process to show the weather widget on the page of your Newspaper theme powered website.

Showing brief weather forecast on top header in Newspaper theme

If you don’t want a bulky weather forecast widget card and want to show a small brief weather insight instead in your Newspaper theme-powered website then this method is best suited for you. Using this method you can show brief weather stat on the top header of your website.

  • From your WordPress dashboard go to Newspaper >> Theme Panel >> Header
Newspaper theme panel.
Fig: Newspaper theme panel.
  • Scroll down until you reach “Top Bar”
  • From the “Top Bar” option enable “Show Weather”
  • Paste the API Key and add your location.  You can get your desired location shortcode from here.
  • Finally, click on “Save Settings”
Weather API configuration in Newspaper theme panel.
Fig: Weather API configuration in Newspaper theme panel.

Now you should see a brief weather stat on the top header of your website.

Wrapping up

In conclusion, we learned to use the Weather widget module available on the Newspaper theme to show weather on different pages and the top header of our website using OpenWeather API.

If you have any questions regarding the topic you can ask me in the comment section.

Also Read: How to show the last updated date on the Newspaper 11 theme

Leave a Comment