Elementor is a great tool for create a website with WordPress. It comes with a visual editor that provides live editing experience. There are lots of design elements offered by Elementor (called widgets) that you can use on your pages. You can decorate each element to make it more convincing. You can add effects, set the borders, set the size, etc. Elementor also comes with a style option to add a shadow to an element.

In this article, we'll show you how to use this feature to add a drop shadow to an element.

Read also: How to install Elementor on WordPress

The style option to add a shadow itself is available on both versions of Elementor. However, not all widgets have this styling option. The Form widget is one of the widgets that does not come with this styling option.

If you want to add a shadow to a widget which does not have the option to add a shadow, you can foil it by adding a shadow to a column belonging to the associated widget.

Here is an example :

Adding a shadow to a button widget in Elementor

First, add a widget to the edit box as usual. You can also edit an existing widget if you are already on the edit box.

Then go to the tab Style from the settings panel and open the option Shadow of the box.

add drop shadow

Set the color, vertical position, horizontal position, blur level, and spread level. In the option Position, you can set the position of the shadow (outline / insert).

See also: How to open a video in a lightbox with Elementor

To create a drop shadow, you can set the vertical value to 1 or more. The horizontal value will determine the horizontal position of the shadow. If you set the horizontal position to -1 or less, the shadow will be on the left. Conversely, if you set the horizontal position to 1 or more, the shadow will be on the right. To make the shadow brighter, you can lower the blur level.

Here. You can publish or update your page after you have finished editing it.

Get Elementor Pro Now!

Discover also some premium WordPress plugins  

You can use other WordPress plugins to give a modern appearance and to optimize the handling of your blog or website.

We offer you here some premium WordPress plugins that will help you do that.

1. Gravity Forms Rating FieldStar Rating Field

Easily add a star rating form (or thumbs up, hearts, smiley faces, etc.) with the WordPress Plugin Gravity Forms.Gravity forms star rating field wordpress plugins collect user reviews

Choose from 14 different rating styles and set configuration options for your rating field. So if you are already using the WordPress Plugin Gravity Forms, you will need to consider using Gravity Forms Star Rating FieldStar Rating Field.

See also our 10 WordPress plugins to hide premium content on your blog

Its features include: customization and display of the current note on mouseover, display of help on tooltip and more.

Download | Demo | Web hosting

2. Algori Emojis

Le WordPress Plugin Algori Emojis makes it easy to add beautiful emojis to your website. Give your words personality and wow your website visitors with thousands of amazing emojis.Algori emojis for wordpress gutenberg

If you are not very good at emoji and do not have much knowledge about what each emoji represents, then Algori Emojis is the perfect plugin for you because it will teach you exactly what each emoji means.

Discover 5 intellectual property laws that every blogger needs to know

This emoji plugin shows you emoticons, stickers, smileys, as well as their names and definitions, so you always know what you add to your words to better express your emotions and ideas.

Download | Demo | Web hosting

3. Automatic Download

Automatic Download is a WordPress plugin that allows you to attach any file to your posts (including custom types) and pages. Automatic download

Once your visitors open these posts / pages in their browser, the file will automatically download. This is a really cool feature for all digital content download websites.

Read also our 8 WordPress plugins to create a mega menu on your blog

Its main features are: the ability to download content as soon as the page or article opens, the configuration of a delay before the start of the download, the integration of a media library, the support for custom types of posts, multilingual support and others.

Download | Demo | Web hosting

Recommended Resources

Find out about other recommended resources to help you build and manage your website.

Conclusion

Here ! That's it for this tutorial. We hope it helps you add drop shadow in Elementor. Do not hesitate to share with your friends on your favorite social networks

However, you will also be able to consult our resources, if you need more elements to carry out your projects of creation of Internet sites, by consulting our guide on the WordPress blog creation.

If you have suggestions or remarks, leave them in our section Comments.

...