How to Use Media Control to Add Different Types of Media?

Updated on May 29, 2023
Table of Contents

If you’re looking to add different types of media to your Elementor website, the Media control is an excellent option to use. This control allows users to add images, videos, and SVGs directly within your custom Elementor widget. 

To check the complete feature overview documentation of The WDesignKit Widget Builder, click here.

Requirement  – This feature is a part of The WDesignKit, make sure it’s installed & activated to enjoy all its powers.

To add a media control, in the Widget Builder, search and add Media control in the Layout.

By default, it supports image only, but from the Media Types section, you can add video and svg types as well.

Note: Don’t use Video and Image or Svg type together. 

Now, to use the Media control, you have to add the relevant HTML tag in the editor. 

For Image and Svg type, you have to add the img tag with src like this <img src=””>, then place the cursor between the double quotes and click on the unique name to add the image URL.

The code should look something like this – 

<img src="{{media_2u5tz224}}">

Now, for the Video type, you have to add the video tag with the source tag, then in the src add the media control unique name.

So the code should look something like this –

<video width="100%" controls>
  <source src="{{media_2u5tz224}}" >
</video>
widget builder media control

Now, based on the media type selected and HtML tag added you’ll be able to add image, svg or video.

Also, check How to Use Gallery Control to Create a Gallery Field.

Related Docs