Join 20000+ Happy Users Who Use Location Weather to Show Weather Forecasts

The Location Weather Blog

the featured image for the blog How to Add an Advanced Weather Forecast in Elementor 

How to Add an Advanced Weather Forecast in Elementor 

by

in

Do you want to add an advanced weather forecast in Elementor with complete customization control and professional design flexibility? 

In this blog, I’ll show you how to add a detailed, elegant weather forecast to your WordPress site with Elementor in minutes– no coding required, just ready patterns and easy customization for outstanding results.   

What you will get: 

  • Advanced Weather Data 
  • 60+ Ready Weather Patterns
  • Full Freedom in Customization

Let’s get in. 

4 Simple Steps to Add an Elegant Weather Forecast in Elementor 

Step 1: Get Location Weather 

Best weather plugin list by Hubspot

Location Weather is the No. #1 weather forecast solution for WordPress with the highest active installations, reviews, and rating in its category. It has been featured on the world’s top platforms, including WPBeginner, WP Engine, WPMU DEV, Elegant Themes, and HubSpot.

Users love Location Weather for its robust features, easy customizations, and fast support. 

Key Features: 

  • 23+ Fully customizable weather templates 
  • 60+ Ready weather patterns 
  • Complete customization & design flexibility 
  • Detailed Forecast up to 16 days & 96 hours 
  • AQI, Historical weather data, Astronomy data, weather map, etc.
  • Weather for a specific location, visitors’ location, or any searched locations.
  • Location-based weather terms & switching options 
  • Auto-changing background based on weather conditions 
  • Image, video, or custom color backgrounds 
  • Stunning effects and animations

Let’s Install Location Weather.  

Step 2: Get a Free Weather API 

We need a Weather API to display the weather forecast. Let’s follow the simple steps below to get a free or paid weather API. 

steps to add a weather API key
  1. First, click Location Weather available in your WordPress admin sidebar. 
  2. Click Settings of Location Weather 
  3. Navigate to the Weather API Key
  4. Click Get your API key. It will take you to OpenWeather’s signup page. Sign up with your email, create and copy the API, and paste it in the OpenWeather API Key field. 
  5. You can add an API key from the Weather API as well. The process is almost the same. 
  6. Finally, hit the Save Changes button.

Step 3: Add a New Weather Template 

Follow the simple steps below to add a Weather Template.

Steps to add a new weather template
  1. First, navigate to Location Weather available in your WordPress admin sidebar.
  2. Click Saved Templates.
  3. Click Add New.
steps to import a ready pattern
  1. Click the Weather Pattern Library.
  2. You can find your desired pattern through the rich list.
  3. Hit the Import button to import your favorite weather pattern.
steps to customize weather forecast in Elementor
  1. First, give your weather forecast template a name. I named it Weather for Elementor.
  2. Click the element you want to customize and find the customization panel in the right sidebar. For example, I clicked the location icon in the top left and changed it to my business location, Dubai, AE.
  3. You also find a Style tab in many panels to navigate to the customization options. I changed the image by navigating to Horizontal Templates→ Style→ Change Image.
  4. When your customizations are done, hit the Publish button.

Step 4: Publish Your Weather Template in Elementor

Follow the simple steps below to publish the Weather Template in Elementor.

copy the weather template shortcode
  1. Get back to the Saved Templates tab.
  2. Copy the template shortcode you have just created. Go to where you want to publish the weather forecast template in the Elementor editor and paste the shortcode. Update the page and see the changes.

Here is how my weather forecast looks.

Weather forecast in Elementor example

However, you can make your weather forecast far better with your creative power and Location Weather’s robust features.

Therefore, don’t allow your visitors go anywhere else to check the weather before purchasing or booking. Statistics show that only 2% of visitors come back to a website.

Let’s add an advanced weather forecast to your Elementor site now to stop losing customers and boost conversion.