Today, you will learn how to add SVG image files on Elementor-built pages with the help of Inline SVG widget.
Please, note that this widget is a part of JetElements plugin, so first of all, you need to install this powerful Elementor add-on. After the process is completed, just open your WordPress Elementor website and proceed with the step-by-step instructions below.
- Type in “SVG” in the search line on the Elements Panel.
- After that, grab the widget and drop it on a new section on the right.
- Then you will see simple content settings on the left.
- Click on the empty space to add your SVG file - just upload it from the opened Insert Media library.
- To make it clickable, add the URL in the field under SVG.
- Then go to the Style section. Here you can enable using custom width and scale the image.
- If you toggle the Use Aspect Ratio option to “no” you’ll be able to change the width and the height manually.
- And if you want to retain the original aspect ratio of the SVG file, simply toggle this option to “yes”. In this case, you will move this image only up and down and the original aspect ratio still stays the same. Only the size of the entire image will be changed.
- The next option will allow you to use custom colors for your image. Please note that it depends on the type of SVG file you have and the number of colors.
- However, in the screenshot above, you can see that you can set one color to the entire SVG image.
- If you’ve got a logo that has only one color this option will bring a really interesting effect to your page.
- The other option you’ll see is Remove Inline CSS. It allows deleting inline styles in the loaded SVG.
- Also, in this block of settings you can set the alignment: left, center, or right.
Elementor Page Builder is quite a universal tool. With its help, you can do literally everything from creating animation and blog posts to even displaying SVG image files. If you are a real fan of Elementor content editor, then this offer will impress you. Recently, TemplateMonster has launched a brand new subscription service called ONE. This is the first service including a full product range from plugins and extensions to different kind of templates and graphics.
Pay $19 per month and get the entire set of elements for website building at a single pack. An added bonus: you are not limited to use them for as many projects as you need. Besides, we are glad to offer a 5% discount on subscription for all MonsterPost readers. Just apply promo code BecomeThe1 while proceeding to checkout.
Congratulations! You’ve added an SVG image to your page with the help of JetElements plugin. If you have questions about any other widgets from this plugin, just write them down below in the comments.
Top 5 Elementor Themes
|Template Name||Theme Provider||Template Category||Price|
|BuildWall - Construction Company Multipurpose WordPress Theme||ZEMEZjet||Construction Company Templates||$69|
|Chantalle - Multipurpose Woman Fashion Elementor WordPress Theme||ZEMEZjet||Fashion Templates||$75|
|BeClinic - Multipurpose Medical WordPress Theme||ZEMEZjet||Psychologist Templates||$75|
|JohnnyGo - Multipurpose Home Services WordPress Theme||ZEMEZjet||Home Remodeling Templates||$75|
|24.Storycle - Multipurpose News Portal Elementor WordPress Theme||ZEMEZ||News Portal Templates||$75|