To enhance your user experience, Elementor delivers new capabilities such as mobile control over background graphics, a safe mode for debugging, and more.
Elementor has always taken pride in its ability to design for mobile devices. For Elementor users, getting the background picture location precisely right was still a problem. As a web developer, you might often encounter this problem: You want to show the dog's face, but only show its tail on mobile.
Elementor's Responsive Background Image controls allow you to create background images that adapt to the size and resolution of any device.
Responsive Background Image Controls
The latest Elementor version gives customers comprehensive control over desktop, tablet, and mobile backdrop image controls. Background image controls are included in this control (image, position, attachment, repeat, and size).
Create Amazing Websites
With the best free page builder Elementor
Start NowFor the first time ever, you may customize the position of individual devices. Choose 'center-top' for mobile devices and 'center-center' for desktops to ensure that the image is shown uniformly across all platforms. For each device, you can choose a different size. As for mobile, select "contain" for desktop and "cover."
We're sure many people would like this new function because this was a major issue for many people.
Elementor brings in the ability to set fully distinct pictures for each individual device. The first additional responsive controls came in the form of device-specific size and location. With adjustable size and position, it allows you to take a step further and gives you an even more flexible design experience.
Custom Background Image Size & Position
Previously, there were just three options for setting the size of the background image: auto, cover, or contain. Similar to 'Top Left', you could only specify general background image placements.
The size and position of the background are now two new custom controls that will be available in the future.
Custom background-position lets you select the exact X- and Y-axis coordinates of the background image. As a result, you now have the ability to precisely align the backdrop of your page.
Custom backdrop sizes are also possible. Set the width of your backdrop image to a precise value in pixels.
For responsive design, these settings—specifically the custom background-size and position—are critical. For desktop, tablet, and mobile platforms, use these custom settings to establish a specific focus on the image's main focal point.
Responsive Border Controls
Additionally, you can now customize the border-radius and width for each device separately, in addition to backdrop images.
Column borders can be used in a variety of ways, such as when a row of links is divided by a column border. It is unnecessary on mobile because the row is no longer inline and each link is placed in a row of its own.
Taking away the mobile layout's border is a no-brainer in this circumstance. A new dynamic boundaries feature makes it simple to accomplish.
There are no more "orphaned borders" on mobile devices!
Safe Mode For Troubleshooting Issues
Elementor is committed to providing a smooth, bug-free experience for all customers. There are tens of thousands of plugins and themes to choose from, and there are an infinite number of ways to make them work with each other. Regardless of whether or not Elementor is involved, these combinations are bound to lead to strife.
Elementor is always looking for ways to make things easier for our users by reducing friction in their work processes.
When people can't open the editor, it's a common problem. Many names have been given to this problem: I get a blank screen, I can't edit, and my computer gets stuck loading…
Safe Mode is the answer!
When Windows first came out, it included a safe mode feature that could be used to troubleshoot various issues. Elementor developed a similar solution on its own.
Whenever you encounter a page that refuses to load, you'll be able to activate 'Safe Mode' by clicking a button.
Elementor and WordPress are protected in "Safe Mode" from any themes or plugins that might be causing problems.
Over 80% of loading issues can be temporarily fixed in Safe Mode.
When you enter Safe Mode, does everything load correctly?
This suggests that either your theme or one of your plugins is at blame for the mistake. Go ahead and deactivate them one by one in order to identify the perpetrator.
I've turned on Safe Mode, but it still won't load.
This suggests you should explore elsewhere for a solution, and it's most likely a custom-code or hosting-related problem.
"Will Safe Mode Affect My Website?"
Visitors to your website won't notice a difference if they use safe mode. All of your installed plugins and themes will be displayed on your site, and your visitors will be able to utilize them just like they normally would.
Plugins and themes are not activated throughout the Elementor editor loading process.
Users of Elementor will greatly benefit from Safe Mode in terms of a more stable, seamless, and error-free experience.
Read More Tag & Widget
WordPress's read more tag was one of the first things elementor got as a feature request.
This was a simple request, but the page builder finally got around to implementing it.
When you use the tag "Read more" in your blog post, the archive's post display will chop off the rest of the text. With this, your content teaser may now be shown right on your main blog page for everybody to see.
In the text editor widget or as a separate widget, you can now quickly add the read more tag. It's even easier to display an excerpt on your archive page with Elementor's new 'Read More' widget, which can be inserted between two text editor widgets and stops exactly where you choose.
In order to avoid any confusion, this widget is only applicable to regular WordPress archive pages that utilize 'the content' in their content. Elementor archive templates are unaffected.
Final Words
Elementor is one of the vastly developed WordPress page builders. With new features, it's becoming more and more powerful every time. With this plugin, you can literally explore a huge ocean of designing and decoration for your website. Hope you will become beneficial from this post. Visit more elementor tutorials and share them with your friends.
