We’ve written about Elementor, the popular WordPress page builder before, because it’s been a game-changer for web designers and developers alike. While many are familiar with its drag-and-drop interface, there’s a whole load of hidden features waiting to be explored.
Luckily for you, we’re going to unveil five of our favourite features that will make you rethink the way you use Elementor. Whether you’re a seasoned pro or just starting out, these Elementor features will help inspire your creativity and make building beautiful websites easier.
Reuse custom elements with Global Widget
The first feature we’d like to talk about is one of the handiest ones that we use across many of the websites we build, Global Widget. This feature is incredibly useful for web designers and developers because it lets you create a widget (like a section, column, or even an individual element) and then save it as a global widget to use across many pages. This means you can style something exactly how you’d like it, then simply open up your Templates folder on any other page, and drop it straight in!
Here’s how it works:
- First, design your widget within Elementor. This can include any combination of elements, content, and styling that you want to reuse across multiple pages or even on your entire website.
- Once you’re satisfied with the design, you have the option to save it as a global widget. To do this, click on the widget you want to save, and in the Elementor settings panel, click on the folder icon labelled “Save as Global.”
- You can give your global widget a name to help you identify it later.
- To use your global widget on different pages, you can simply drag and drop it from the Elementor library onto the new page. Any changes you make to this global widget will be reflected on all instances of it across your site.
- If you want to customise a specific instance of a global widget without affecting the others, you can unlink it. This allows you to make unique changes to a particular instance while keeping the global widget’s design consistent across the site.
The beauty of global widgets is that any change you make to the global widget is reflected across all instances of that widget throughout your website. For example, if you have a global widget that’s a header, and you decide to change the font style or logo in that header, it will automatically update on every page where that global widget is used. This feature ensures consistency in design and can save you a lot of time!
Keep things moving with Motion Effects
Next on our list is Elementor’s Motion Effects feature, a powerful tool that allows you to add animations and interactive effects to your web page elements without having to write a single line of code. These effects make your website more visually engaging, helping to capture your visitors’ attention and create a memorable user experience.
What can you expect from Motion Effects? Here’s a quick overview:
Entrance animations
Create entrance animations for individual elements, making them appear in an exciting way when they come into view on the screen. There’s a range of animations to choose from, including fade, slide, zoom, and more. You can control the animation’s duration, delay, and direction to create a unique and eye-catching effect!
Hover animations
This feature allows you to add animation effects to elements when a user hovers their mouse over them. These animations can range from simple transitions to more complex effects like rotation, scaling, or colour changes.
Scroll animations
Create animations that trigger as the user scrolls down the page; this can be particularly useful for storytelling or guiding users’ attention to important content you’d like to highlight. You can set animations to start at a specific scroll point and control the animation’s duration and intensity.
Sticky effects
Elementor also allows you to make elements “sticky,” which means they stay visible on the screen as the user scrolls. You can set elements to become sticky at a certain scroll position and unstick them at another position. This is great for creating fixed headers, sidebars, or other elements that need to be visible for better navigation.
Mouse-track effect
This next feature lets you add a parallax effect to an element based on the user’s mouse movement. For example, you can make background images or sections move subtly in response to the mouse’s position, which adds depth and interactivity to your website.
Background parallax
Elementor allows you to add parallax effects to section backgrounds, creating an illusion of movement as the user scrolls. You can even control the speed and direction of the parallax effect.
Custom cursor
You can replace the default mouse cursor with a custom cursor to create a unique and branded experience. This feature is excellent for enhancing the overall aesthetics of your website and bringing even more of your brand’s identity.
Promote your brand with Pop-Ups
Elementor allows you to create beautiful pop-ups using its dedicated Popup Builder feature, designed to help you convert visitors to leads (and even leads into customers!). Pop-ups are also a powerful tool for promoting special offers, particularly useful as we approach the run up to Black Friday, and Christmas!
One useful feature of Elementor’s Pop-Up Builder is that it offers advanced targeting and trigger options, meaning you can specify precise conditions for when and where your pop-ups should appear so that they reach the right audience at the right time. Trigger options include time delays, scroll triggers, click triggers, exit-intent triggers, and page load triggers.
And if you’ve chosen to go Pro, Elementor’s Pro version includes A/B testing capabilities for your pop-ups. This allows you to test different versions of your pop-up to see which one performs better in terms of user engagement and conversion rates.
Finally, with Elementor’s built-in analytics, you can monitor the performance of your pop-ups; track views, conversions, and other relevant metrics to assess the effectiveness of your pop-up campaigns.
Navigate from A to B, faster with Finder
Elementor’s Finder isn’t the most groundbreaking of features; it’s a search bar essentially. But why is this great? Why would a simple search bar make the list of our 5-favourite features?
Because building websites is guaranteed to have your Chrome crashing from the 30,000 tabs you have open. Imagine if you could avoid this by simply navigating around the backend of your website from an easy search bar? Well as Elementor says, “Introducing Finder, a handy search window that lets you go from anywhere, to anywhere. Reach any Elementor page or setting page from wherever you like on your site.”
Here’s why we love Finder:
Quick and easy navigation
Elementor’s Finder allows you to search for pages or posts in your WordPress site efficiently. By typing in keywords or the name of the page you’re looking for, Finder quickly shows you a list of relevant results.
Instantly edit the pages you’re hunting for
Once you’ve found the page or post you want to edit, you can click on it directly from the search results. This feature eliminates the need to hunt back through your WordPress dashboard to find that ‘Edit with Elementor’ link for a specific page.
Accessible through keyboard shortcuts
Elementor’s Finder can be accessed using a keyboard shortcut (and who doesn’t love a keyboard shortcut?!) making it even faster to use. By pressing a predefined key combination (usually Ctrl + / or Cmd + /), the Finder search bar will appear, allowing you to start your search instantly.
Find more than just pages
While it’s mainly used for finding and editing pages and posts, Elementor’s Finder can also be used to locate other content and settings within the WordPress admin area. This improves the efficiency of managing your site by simplifying the navigation process.
Show your recently edited items
Finder also displays a list of recently edited pages or posts, making it easy to find the content you’ve worked on recently.
https://elementor.com/blog/introducing-finder/
Dynamic content, without the code
We’re ending this list of our five favourite Elementor features on a doozy! Elementor’s Dynamic Content is a powerful tool that allows you to create and display content that automatically updates based on various dynamic sources, such as custom fields, user data, current date and time, and more.
This feature is particularly handy for designing dynamic, data-driven websites without the need for extensive coding, giving you the ability to design websites populated with relevant content from your CMS.
Elementor’s Dynamic Content Elements
Elementor offers a range of Dynamic Content elements that you can use to dynamically populate content on your pages. These include:
- Post Title: Dynamically display the title of the current or specific post or page.
- Post Content: Display the content of the current or specific post or page.
- Post Excerpt: Show an excerpt from a post.
- Featured Image: Display the featured image of a post.
- Custom Field: Retrieve and display custom field values associated with the current post or page.
- Author Name: Show the name of the post author.
- Current Date/Time: Display the current date and time, which can be useful for event listings or dynamic time-sensitive content.
- User Data: Show information about the currently logged-in user, such as their username, email, or profile picture.
Dynamic conditions to display what you want, where you want
You can set conditions to control when and where dynamic content appears on your website. For example, you can choose to display content based on user roles, page templates, post categories, or specific triggers.
Integrate with WordPress’ custom fields
Dynamic Content can work with custom fields, which are additional data points you can associate with posts and pages in WordPress. This allows you to add custom data and display it dynamically using Elementor.
Integrate with WordPress’ advanced custom fields
If you’re using Advanced Custom Fields (ACF), Elementor provides a Repeater Field widget, allowing you to create dynamic layouts that repeat specific content elements, such as testimonials, team members, or product listings.
Dynamic linking for dynamic websites
You can use Dynamic Content to create dynamic links. For instance, you can create a button with a link that dynamically changes based on the post being viewed (e.g. you could opt for ‘Register now!’ for users that don’t have an account, and ‘View more content!’ for users who do)
Personalise your website with different content for different users
Dynamic Content elements allow you to personalise content for logged-in users. You can greet users by name, display their user-specific data, or create personalised calls to action.
Elementor websites from Milk & Tweed
We could talk about how much we love Elementor until our cows come home, but we’ll leave this at our five-fave-features otherwise we could be here all day. If you want to learn more about it, why not check out our article Elementor vs Elementor Pro to discover what Elementor is , the differences between Elementor and Elementor Pro, plus more key features and benefits!
Here at Milk and Tweed, we know what it takes to design and build a good website, and Elementor is perfect if you’re looking to have a hand in updating things after the site has gone live. Why not find out more about our Website services, and get in touch to find out how much we can help you make the most out of your online presence.