You need everything to create a WordPress page or website that looks great. The platform’s page builder is available 24/7, but you won’t be able to edit the site as often as you would like due to its size and location.
Third-party plugins for web design can be used to solve problems you might have with WordPress. One of the most popular is Elementor. Elementor aims to aid you in creating websites in a uniquely easy way – and when we say it’s a breeze to work with, we do mean it. No coding required!
Are you a believer that Elementor is the right page builder? Are you still undecided? To answer your curiosities, we’re deeply diving into everything it offers.
Here’s a Pinky1472 video review for those who like a visual experience. You can still read our article to get an overview of Elementor.
Elementor in a Nutshell: What Is It About? How To Make Shapes In Elementor
Elementor is a WordPress website builder plugin. It’s best known for its visual and intuitive drag-and-drop editor that allows you to use a wide range of design assets and blocks and see what your page will look like to visitors in real-time.
Elementor’s interface is similar to popular website builders such as Squarespace or Wix. You can either choose a pre-made template or build a custom-made WordPress website. This unique platform has one advantage: all the tools that you need to create a website are at your fingertips.
What Does It Have to Offer?
Elementor is a WordPress plugin that lives up to its reputation. It offers a clean and simple interface that allows you to quickly navigate through all it has.
- Elementor offers a wider range of attractive and dynamic themes than the standard, plain themes that are often included with WordPress’ in-house themes.
- To edit your pages and posts, you have a completely separate interface that allows for interaction. There’s no single sign of bulkiness associated with WordPress’s similar editor – everything is built to be silky smooth on your end.
- You can keep your current theme, even if it’s from WordPress – Elementor can deal with all WordPress themes as long as they’re compatible with version 5.0 of the platform or higher. You can use the plugin to refine your dull-looking theme into a more eye-catching one.
- All the editing for your pages and sites is done from the front end. You’ll see your work as soon as your customers or visitors see it. This remarkable feature allows you to better understand what design elements keep customers coming back for more.
Elementor as a whole makes it simple to create a stunning page. The interface of Elementor is so simple and packed with useful tools, even people with more advanced knowledge in web design, can use it without any difficulty. This, in turn, has solidified the website builder to be an ideal choice for folks lacking resources or working as a one- or three-man team.
Numerous similar web design plugins might offer working people a pleasant drag-and-drop experience as well as a few useful tools. Elementor’s standards are not met by all plugins. With that being said, Elementor has gained a positive reputation among many WordPress users – more than three million of them have had the plugin installed on their accounts.
What makes this interesting web design platform stand out from all the rest? What else does it have that others usually don’t? We will soon find out as we look deeper into Elementor’s features, beginning with its impressive list.
Meet Elementor’s Features
Fully-packed Template Library
Elementor’s library of more than 150 templates is perfect for those who are new to web design, or have some knowledge but don’t have the time. All of them make the site-building experience easy on your end, as they help turn your ideas into a product that can catch anyone’s attention immediately.
Two categories are available for the platform’s templates:
- Pages – Full-length templates which require very little customization
- Blocks are templates that can be used to create pages for specific and individual parts. Examples of blocks include portfolios, pricing tables, FAQs, portfolios, and more.
If you wish to expand beyond Elementor’s in-house template selection, you may find them from tons of third-party sources all over the internet and import them onto the platform under the My Templates tab.
Massive Widget Selection
Elementor has a lot more than just a wide range of templates. The plugin is also rich in widget choices. Widgets are smaller, more contained elements that house a wide range of content.
With a whopping total of 60+ widgets, you gain lots of insight into how you want to structure your website as well as the flexibility of doing so. Some of those include text-related elements such as headings and the inner section, media files like images and videos, buttons, icons, and website sidebars. Elementor also offers testimonials, star ratings and gallery widgets as well as map widgets powered Google Maps.
You may add as many as you want to your page. To expand your selection, you can also import templates from third-party sources.
Convenient Drag-and-drop Editing
Elementor’s user interface is the most notable feature. It has been best-known for its drag-and-drop capabilities, allowing users to build and edit pages as freely as possible. Simply drag whatever widget you like best from the left sidebar, and drop it into your workspace. You can also adjust the layout of the page by moving it to another location.
Elementor also offers right-click support, which allows users to make minor edits without having to look at the sidebar. This is something that a few WordPress web design plugins don’t offer.
You will find a section called Navigation View that provides a complete list of content, arranged according to Elementor’s page layout. We’ll talk more about that later.
The editing interface also includes a Finder tool that will help you navigate quickly between pages and content elements.
Fine-tuned Control over Your Elements
For a basic WordPress page-building plugin, Elementor is surely stuffed with many design options that anyone can enjoy hassle-free. Elementor understands that every detail is important when creating a website that stands out. It allows you to modify and fix any design elements in the site you are building.
You can make necessary changes to your site’s content blocks and widgets, images, text, and text. You can also change the font, sizing, and color of your text content and headings.
Those are some of the basic editing tools you can explore in Elementor. The plugin also has more advanced options to let you tweak specific adjustments to your content elements. Widget positioning within columns, setting exact margins and padding in numbers, animation effects, and custom CSS settings are part of the plugin’s line of next-level customization options.
Optional Features for Your Mobile-Friendly Page
Elementor templates are all mobile-friendly by default. However, you might be curious if you can make some adjustments to your template to suit your needs. The platform allows you to customize your website to look better on tablets and smartphones, just like everything else.
Just click the Switch view icon along the sidebar, and you’ll be greeted with three viewing options, each for the desktop, tablet, and mobile phone. You can choose from any one of the three viewing options to edit or omit widgets.
An opportunity to look back at the changes you’ve made
Sometimes a few ‘undo’ actions may not be enough to fix a huge design mistake. You might have encountered similar occurrences if you tried editing on any design platform.
Elementor’s Revision History tool is a great help in this situation. With it, you can revert to any of the previous versions of the page you’re editing without sacrificing the rest of your design elements.
Pricing
The Elementor plugin is offered completely for free, letting you take full advantage of all its core web design features and elements needed to create a good-looking site or page. Elementor Pro, however, has more additions and upgrades that are miles ahead of the previous version, some of which may interest you in trying one.
Elementor Pro will allow you to explore a wider range of themes, templates and design blocks, as well as custom CSS and advanced programming capabilities. You can also create forms and pop-ups in the platform’s editing interface, integrate with WooCommerce, and use the theme builder.
Elementor Pro offers four subscription options, each tailored to different individuals or groups. The plan also offers a website builder and hosting plans for advanced site management. All tiers are paid annually and share the same premium features; the only two factors that set each other apart are the number of website activations and customer support response time.
Elementor Pro Plans
- Essential Plan – $49/year. 1 Pro Website Activation. 24/7 Customer Support
- Expert Plan – $199/year. 25 Pro Website Activations. 24/7 Customer Support
- Studio Plan – $299 in the first year, then $499/year after; 100 pro website activations, VIP customer support in under 30 minutes
- Agency Plan – $999/year. 1000 Pro Website Activations. VIP Customer Support in Less Than 30 Minutes.
Elementor Cloud Website Building + Hosting is $99 per year. You get all the features of an Elementor Pro plan, but with amazing hosting and CMS capabilities. You get a remarkable range of design assets, templates, and editing capacities, and your website is fully protected with Google Cloud Platform integration, SSL, and robust website management.
Elementor Free vs. Elementor Pro
Now comes the complicated part: Is the free WordPress plugin version still suitable for your needs, or do you think the Pro version has such a big advantage that it makes you want to try it instead?
The free plugin version is a good option if you don’t want to add any extra features to your website or landing page. Elementor Free has many features that are already impressive in retrospect. Its core tools are just as dynamic as those of other web design platforms, which offer the same level or more delivery. It is so dynamic that business teams can use the free version. How To Make Shapes In Elementor
Elementor Free allows you to:
- Create optimized mobile-friendly versions of your site and page
- Check out the version history of your website.
- You can use fully customizable themes and pre-made templates.
- You can add or modify website blocks as you wish.
Elementor Pro might be the right choice if you need to license multiple websites. It offers a lot more value than the free version. This means that you have more options and more features to help you get the most out of your software. These include:
- An expanding list of over 300 themes and 100+ premium block templates;
- Global widgets that allow you to use and edit the same widget across multiple pages without having to edit it individually;
- A front-end form builder and a pop-up editor if you want more ways to attract potential customers;
- Integrations with WooCommerce are available, with templates blocks and widgets to help you create an online storefront.
- You can create your own theme using the Theme Builder feature. How To Make Shapes In Elementor
Elementor Pro should not be considered the only way to grow the WordPress plugin if you don’t want to license multiple websites. Elementor Free, as mentioned above, is sustainable enough for most users. However, there are many flexible themes and templates that can be integrated into Elementor. Astra is a notable example.
Elementor: How does it work?
To get the Elementor plugin to start, the first thing you will need to do is install and activate it in WordPress. Once you’ve installed it, there’s a settings panel that you can visit if you wish – you may opt to modify whatever you want to see while you do the editing. You can also go to WordPress’s pages section.
From there, you will notice the Edit with Elementor button placed conveniently along the bar above the canvas. As soon as you click on the button, you will be redirected to builder interface. The image below perfectly illustrates what it looks like. How To Make Shapes In Elementor
Based on the picture, here are a couple of things that you should expect as you explore the interface:
- The canvas or workroom. It’s a huge part of the interface that takes up most of the screen.
- The widgets area. It is located on the left side, next to the canvas. It contains lots of content as well as design elements that can be used.
- Settings. Symbolized by three small horizontal lines, it is where you get to access a wide range of colors, fonts, and other design assets.
- The Open Elementor Widgets button. Essentially considered a form of the menu button, it allows you to return to the widgets list – nine little squares represent this.
- The Global Settings button. It is represented by the cogwheel icon and takes you to the more advanced settings.
- The Revision History button. Displayed as a clock icon, it allows you to take a look at the history of previous versions of your page or website.
- Switch View. This small monitor icon lets you convert the desktop version of your page into tablet-friendly and mobile-friendly iterations. This icon can be used to edit the content you wish your customers to see on their smartphones.
- Preview your changes. Once you click the tiny eye icon, you’re given a full look at the changes you’ve made to your page before you’re ready to publish it.
- The Publish/Update button. Once this shaped button goes green, that’s when you’re ready to publish. If it’s grey, it means your page is updating – this time, unlike when it’s green, you can’t click it. How To Make Shapes In Elementor
Structure Hierarchy
Before you can begin building, it is important to understand the structure hierarchy Elementor uses. If you’re especially new to website design, this similar framework has been abided by many experienced creators and other basic web design platforms.
In Elementor, your primary goal is to create a page. A page is where it usually contains a series of sections and the columns that come after that.
On the one hand, a section is a row that you can customize with plenty of design elements, such as background, colors, sizing, and more.
On the other hand, the columns are located within a specific section. These, in turn, are where the widgets or content elements are placed. Each widget can be customized and sized separately.
To recap, this is how Elementor’s structure hierarchy plays out:
Page > Section > Column > Widget/Content element
Designing a Page
Let’s create a page now that we have an understanding of the skeletal structure. Click the Edit with Elementor link in WordPress’ page design interface. Soon you’ll see a plus (+), highlighted in red violet. Click on it to add a section. How To Make Shapes In Elementor
Next, you will need to choose the structure for your section. You can choose to have one column or several columns depending on the type of content that you want. From there, you may populate those columns with content elements. Simply drag any widget from the interface’s widget area and drop it onto them, be it a heading or an image. You can even adjust or rearrange them and sections and columns within the page.
Now is the time for fine tuning the details and making the page more attractive. There are three main editing tabs to explore: Content, Style, and Advanced.
Designing a pre-existing or pre-made themed page is much easier than doing so from scratch. Most of the time, you would only need to make slight adjustments in between sections, columns, or even widgets – unless you need to add a new design element. Elementor’s drag and drop functions make it much easier to refine some changes than coding.
The disadvantages: What else is missing?
We don’t mean to mislead you, Elementor is certain to be one of the best WordPress web design tools. However, nothing in this world is always perfect. While there are many things that we love about it, there are a few that some of you may find inconvenient:
- Sometimes the editing interface can be a little slow. It’s speedy, swift, and ultimately convenient, but it does so well, too fast to the point where it freezes altogether. To get it working again, refresh it and reopen it.
- Though most of Elementor’s features are offered for free, there are a few that may appear essential but are only limited to Elementor Pro, which may be a bit discouraging for some. You can’t set sitewide styles with the free version. Instead, you are limited to only a few pages at a time. How To Make Shapes In Elementor
- Some editing refinements may not go exactly as you wish them to. On the one hand, if you add custom styling to certain links, you may end up with the default typography and font color. You may also have trouble finding the margin value if the alignment of your design elements is not correct.
Who Should Use Elementor?
Elementor has a wealth of expert-level features and tools. The free version includes these, as well as additional useful upgrades for any Elementor Pro plan. It is also easier to use than most other WordPress web design plugins.
With that being said, it’s no wonder why many individuals like Elementor as a whole – it’s both a popular DIY solution for folks who may not have on-hand expertise with web design and a quick, feature-rich platform for a wide range of businesses.
However, there are some specific users we have in mind that will find Elementor to be a more suited choice. These are:
- Casual internet users. Bloggers and hobby website runners, in particular, will enjoy the wide, customizable benefits gladly offered by Elementor.
- Digital marketing professionals. Design tools aside, most of Elementor’s features are built to be marketing-ready – from the seamless integrations to thousands of platforms using Zapier to the pop-up and e-commerce widgets.
- Site builders. If creating websites for a handful of clients is your day job, then Elementor is a great stepping stone to get you to where you want to be. How To Make Shapes In Elementor
Alternatives to Elementor
Elementor may have some advantages over other web design plugins, but that doesn’t make it the best choice.
Many WordPress web design plugins offer similar functionality to Elementor. Some may only offer a few. We all know by now that WordPress’s in-house web design feature is not everyone’s cup of tea – that’s why the plugins were created in the first place, to make the experience much better by the mile.
There are currently two other top WordPress web builders plugins that are comparable to Elementor in terms if features: Divi builder By Elegant Themes and Beaver Builder. Divi is able to edit your website directly from the front-end interface, just like your clients. However, despite giving off a very similar edge, it somehow doesn’t include a free option. Beaver Builder is a more straightforward plugin than the others, but it packs as many design tools as you need into one platform. These tools are enough to make a website look great.
Other noteworthy web design plugin alternatives to Elementor include SeedProd and the SiteOrigin Page Builder.
Final Verdict: Is Elementor Worth Trying?
Answering the question is yes. If you’re searching for a top-notch drag-and-drop page-building instrument for WordPress that’s stuffed with professional-grade design tools and features, with most of those core features offered for free, look no further than Elementor. How To Make Shapes In Elementor
There’s no question as to why people keep coming back to this impressive plugin to create pages and websites. We believe that Elementor stands out from most web design plugins because it allows individuals of all skill levels to build whatever they wish with no major obstacles in the way. Elementor isn’t like other web design plugins that require you to upgrade to a higher plan, or to purchase a paid license. This ensures there is enough space for everyone.
Here’s some advice before we let you explore Elementor for yourself: if your job involves running multiple websites and creating them for clients, we recommend you try Elementor Pro. Otherwise, the free plugin for WordPress will work just as fine!
FAQ How To Make Shapes In Elementor
Can I export or upload my templates to Elementor
Yes, Elementor can import your templates. You can create a new template using the Theme Builder. Additionally, you can import your personal themes to the website builder via the Templates tab.
In a similar function, you can export your templates to be used on other WordPress sites – a handy function if you work for multiple clients as a website-building professional.
What types of pages can I create using Elementor?
With Elementor, you can create homepages, landing pages, landing pages, about pages, or any mixed-interest pages under the sun.
Elementor Pro subscribers can create websites, and even online shops.
Does Elementor slow down my website?
Elementor won’t slow down your website to the point where it will take as many seconds as possible to load. A website built with this plugin might take two seconds longer than one built from WordPress’s built in website builder. Both are still faster than the Beaver Builder version.
The reason why WordPress websites that are made using plugins take longer may derive from multiple factors: poor hosting, large media files, slow themes, and too many plugins at work.