how to use elementor

How to Build a Beautiful Blog with Elementor

Are you thinking about starting a blog and sharing amazing articles with other people? Even though almost everyone has a blog today, finding a really good one that delivers the right combination of sexy design and engaging content isn’t that easy.

In fact, the number of blogs in the U.S. is expected to reach 31.7 million in 2020, which means that you can find lots of blogs on almost every topic. That’s great for readers, obviously, but for bloggers, this means one thing: Unbelievable competition.

On top of that, user experience (UX) also plays a critical role in their success. A blog should have professional, responsive design in order to be appealing for the visitors and provide them with the best reading and browsing experience. Moreover, Google pays attention to design, too, as it requires websites to be mobile-friendly and fast.

That’s why using WordPress website builders has become a popular approach for building beautiful blogs. In this article, we’re going to use Elementor, an easy-to-use WordPress blog builder and the Blog Kit, a free theme by WP Charms.

Let’s make a user-friendly, responsible, and customizable blog now, shall we?

Why Blog Kit?

I selected Blog Kit theme for this tutorial because it’s lightweight, clean, simple, and responsible. Besides, it’s optimized for speed and has a 95 percent GTMetrix PageSpeed Score, which means that meet Google’s requirements of speed and responsiveness. And it’s compatible with Elementor.
That’s a good start.

1. Install the Free Blog Kit Theme

Let’s start by installing the selected free theme. It’s available on WordPress.org as well as on WP Champs. According to WordPress.org, it gets updated pretty often and enjoys an impressive number of downloads, which is another good sign for us here.

Source: WordPress.org

2. Download and Install Elementor

Downloading the blog builder from the official website takes a few seconds. Add the Elementor plugin to your WordPress website and start editing your blog.

3. Start Designing Your Blog

Click on the “Edit with Elementor” button and you’ll land on the builder’s dashboard that looks like this.

 

On the left side of the screen, you’ll discover various editing tools called widgets. These allow you to add elements to your page, including buttons, headings, images, text, and others. You can start working with a widget by dragging it to the assigned place, which is really easy and fast.

Since images are the heaviest element in terms of size, make sure to compress your visuals with a tool like PNG Compressor to avoid undermining your blog’s speed.

Feel free to browse all of the elements and widgets to find more useful features.

To select a pre-made design section for a page, click on the Plus button in the middle and you’ll see your options. As you can see in the image below, there are twelve options available, which is more than enough.

In case you want to go with a template from the Elementor library, close the window with Structures and click on the second button with a folder on it. Now you can choose from a vast collection of pre-designed templates of pages, so take a look and select the one that you think is best for your blog.

Now that you’ve made a selection, import it, and you can start editing to make it unique and resemble your style and vision.

Since every element on the template – a text box, a button, an image, you name it – is easily customizable and replaceable, you can change and improve certain elements of the template or revise it completely.

In other words, Elementor gives you all the creative freedom you need to create blog pages that resemble your unique vision. Live preview is also available, letting you see how your work looks when it’s published.

Pay close attention to text blocks, because they can look just fine without a lot of text, but when you actually start filling them with content, things may look a little bit different. Also, keep in mind that the visual appeal of the text – subheadings, small sections – are the best for readers. To comply with this requirement (by the way, Google recommends this format as well), beginner bloggers often use editing and proofreading tools like Trust My Paper.

To make sure that your work also looks great on a mobile screen, you can click on Responsive Mode button at the left bottom corner of the dashboard (shown in the above image) and check out a preview on smartphones and tablets.

Page Preview on Mobile

So, as you can see, the tool’s drag-and-drop features allow doing all the design work without any coding skills. Remember, none of the changes are live until you click on Publish, so feel free to let your creativity take over.

4. Tweak Elementor-Compatible Themes

We’ve selected Blog Kit theme for a reason: it’s completely compatible with Elementor, so you can edit it in any way you want to make it yours.

By importing it into the tool, you can enjoy the same functionality and customize the theme by adding your own images, choosing different colors, layout, menu items, and text, and check out how the pages look at mobile devices.

Choosing menu items in Elementor.

Choosing an existing theme can help you to speed up the design process by providing you with a layout draft as well as other design ideas.

A complete guide to theme customization with Elementor is available on the official blog. You can also check out the selection of all themes that you can tweak here.

Time to Design a Blog!

Whether you want to create a blog from scratch or change a good-looking theme to make an appealing design, Elementor can be a useful tool for that. To complete a design project, you don’t have to have any coding skills, because every design element is easily customizable with drag-and-drop features.

So, getting your blog up and running will be quick, so you can start thinking about how to write your content and outperform that serious competition that we’ve talked about in the beginning. Happy blogging!

Pin It on Pinterest