Table Of Contents

How to Use Elementor Weather Widget

If you’re thinking about inserting a weather update feature on your website, you can go for our Elementor Weather Widget. You might meet some issues a bit. Nothing to worry about. The documentation below will take you on the right path.

Let’s move on.

To Insert Widget

Inserting Elementor Weather Widget

Inserting the widget is just a matter of dragging and dropping. As you see in the screenshot above, drag the widget weather inside your page.

Content Tab

Using the content tab, you’ll be able to make a layout of a particular part of a website. And in this regard, some handy sections in the tab will assist you a lot in designing the Elementor Weather Widget.

Now, I’m going to show the sections of the Content Tab and how they work behind the widget.

Weather Key Generation

Google weather widget API

The widget work with the response of Key. So, you’ve to generate the weather key first. And to do that, go to the WordPress Dashboard > Element Pack > API Settings > WeatherStack Key > and paste your key in the field there.

If you don’t have a weather key. Visit the link and make accounts(Free/ Premium). When the Account is complete, you will be provided Key and copy that.


Elementor Weather Widget weather settings

If you generate a weather key following the process above, you will be able to work in this section. This section will let you set Layout(Simple, Today, Tiny), Units(Metric, Imperial), and Location.

In addition, here, you may work with a few switcher buttons to manipulate the feature of the weather widget for android. Mostly, the Round Number switcher button will help you to get a round number(29), not a fraction(29.40) number.

Style Tab

Now, let’s work with the Style Tab. The tab will easily have you style the web content (text, image, video, etc.) of the page you require to design the Elementor Weather Widget. 

Styling with the Style tab in Elementor will always give you a fantastic experience.

Let’s have a look.


In fact, nothing more is in this section except adding color to content like Text, Icon, etc. Mostly, the more you can do from here is to set Border Style and adjust the List Space.

Just, go to the Style tab > Weather. See the screenshot above.

Video Assist

At the end of this documentation, I hope you’ve noticed what is Weather Widget and how it works for you. Watch the video inserted above. If you want to discover what more is possible to do using this one, you can visit the demo page.

Enjoy New Year 2022 with a 35% Discount on all Products! Check Here


Don’t worry we hate spam and we promise you will get only quality news and offer from us.

© Copyright 2021 All Rights Reserved by BdThemes