elementor tutorial

How to Make a WordPress Website with Elementor

Last modified: June 4, 2026

Fiverr freelancers

WordPress is one of the most widely used platforms for building websites — from simple blogs and portfolios to full business sites and online stores. Paired with Elementor, a drag-and-drop page builder, you can design a professional-looking site without writing a single line of code. This guide walks through everything you need to build a WordPress website with Elementor from scratch.

# Name Image
1
Step 1 – Host a Domain
Choose a domain name
More Info
2
Step 2 – Install WordPress
admin tour
More Info
3
Step 3 – Complete the Installation
admin tour
More Info
4
Step 4 – Install Elementor
Elementor Marketplace
More Info
5
Step 5 – Choose a Theme
Step 5 – Choose a Theme
More Info
6
Step 6 – Create a Page
Elementor page builder
More Info
7
Step 7 – Edit Page
elementor tutorial
More Info
8
Step 8 – Publish More Content
Step 8 – Publish More Content
More Info
Show More

* This button will show the rest of the post and open up an offer from a vendor

Step 1 – Host a Domain

Choose a domain name

To build a WordPress website, you first need a web host and a domain name. A web host stores your site files and serves them to visitors; a domain name is your site’s address (like yoursite.com).

Choose a hosting provider that supports one-click WordPress installs — options like Cloudways and most shared hosts handle this by default. When choosing, look for:

  • An SSL certificate included (for HTTPS security)
  • Enough storage for your site files and images
  • Good uptime and page load performance
  • Regular backups either included or available as an add-on

Many hosts include a free domain for the first year. Register and connect your domain during the signup process — your host’s documentation will walk you through it.

Step 2 – Install WordPress

admin tour

Once hosting is set up, install WordPress. Most hosts offer a one-click WordPress installer found in cPanel, Plesk, or a custom dashboard. Look for a “WordPress” option under Applications, Softaculous, or CMS Installer.

Click install, choose your domain, and enter a few basic details:

  • Site title
  • Admin username (avoid using “admin” — it’s a common attack target)
  • Admin email address
  • A strong password

The installer takes about a minute. Once complete, you’ll get your WordPress admin login link — usually yoursite.com/wp-admin. Bookmark this address.

Step 3 – Complete the Installation

admin tour

Log into your WordPress admin at yoursite.com/wp-admin. Before building, take a few minutes to configure the basics.

Go to Settings > General to confirm your site title and admin email are correct. Set your timezone to match your location so post publish dates and scheduled content work properly.

Then go to Settings > Permalinks and select Post name (/blog/my-post-title/). This creates cleaner, more readable URLs that are better for both users and search engines. Click Save Changes.

Finally, remove any default placeholder content: delete the “Hello World” sample post and the “Sample Page” (under Posts and Pages respectively). These placeholder items can make your site look unfinished.

Step 4 – Install Elementor

Elementor Marketplace

Now install Elementor. Go to Plugins > Add New in your WordPress admin and search for “Elementor.” Click Install Now next to Elementor Website Builder (the free version), then Activate.

Elementor is free and covers the majority of use cases for most websites. There is also a premium Pro version that adds the Theme Builder, Popup Builder, WooCommerce design tools, and additional widgets. If you’re new to Elementor, start with the free version and evaluate Pro once you know what extra features you need. Once you decide to upgrade, our guide on how to activate Elementor Pro walks through the exact steps.

After activation, Elementor will prompt you to create an account. This is optional for the free version but required for the template library.

Step 5 – Choose a Theme

Step 5 – Choose a Theme

Your theme controls the overall structure and baseline styling of your site — the header, footer, font defaults, and color palette. Elementor works best with lightweight themes built specifically for page builder compatibility.

Good free options include Hello Elementor (made by Elementor itself), Astra, and OceanWP. These themes have minimal CSS that won’t conflict with your Elementor page designs.

To install a theme, go to Appearance > Themes > Add New and search for your chosen theme. Click Install, then Activate.

When picking any theme, check:

  • When it was last updated (avoid themes that haven’t been updated in over a year)
  • Whether it lists Elementor compatibility
  • Reviews and active installations (higher numbers mean better community testing)

Step 6 – Create a Page

Elementor page builder

Now create your first page. Go to Pages > Add New, give it a title, and click “Edit with Elementor” to open the visual editor.

Elementor’s interface shows your page on the right and a widget panel on the left. If you want a head start, click the folder icon at the top of the canvas to open the Template Library. Browse complete page layouts, import one, then customize it with your own text, images, and brand colors.

Good pages to create first:

  • Home page — your main landing page that introduces your brand
  • About page — who you are and what you offer
  • Contact page — a form and your contact details
  • Services or Products page — what you sell or provide

Start with your home page and build outward from there.

Step 7 – Edit Page

elementor tutorial

With a page open in Elementor, click any element to select it and edit it in the left panel. Drag new widgets from the panel onto your page to add content blocks.

Key things to customize:

  • Text: Click any text block to edit content directly. Use the Style tab to change fonts, sizes, and colors.
  • Images: Click an image widget to swap it out or adjust its size and alignment.
  • Buttons: Update the label, destination link, color, and size of any button.
  • Sections: Right-click any section to duplicate it, move it, or adjust its background color or image.

To add a background image to any section, click the section to select it, then open the Style tab in the left panel. Under Background Type, choose Classic, then click the image field to upload or select your image. This is one of the most effective ways to create a visually distinct hero area or call-to-action section — see our full guide on how to add a background image in Elementor for all the options.

Use the responsive preview controls at the bottom of the editor (desktop, tablet, mobile icons) to check how your page looks on smaller screens and adjust as needed. When you’re done, click Publish to make the page live.

Step 8 – Publish More Content

Step 8 – Publish More Content

Once your core pages are live, keep building. Blog posts are one of the most effective ways to attract visitors through search engines — each post is an opportunity to rank for a keyword and bring new readers to your site.

Go to Posts > Add New to write your first blog post. You can use WordPress’s default block editor or open posts in Elementor for full design control.

Beyond blog posts, consider building:

  • A portfolio or gallery if you’re a creative or agency
  • A WooCommerce shop if you sell physical or digital products
  • A resources or FAQ page that answers common questions in your niche

Aim to publish consistently — even a few posts a month adds up. The more useful, specific content your site has, the more Google has to index and the more traffic you can build over time.

Final Word: How to Make a WordPress Website with Elementor

Building a WordPress website with Elementor is a straightforward process once you know the steps. The setup — hosting, domain, WordPress, and Elementor — takes an hour or two. Designing your pages can take as long as you want, depending on how detailed you want to get.

Once your core pages are live, focus on adding content consistently. Blog posts, service pages, and portfolio work all give search engines more to index and give visitors more reasons to stay. From there, you can refine your design further — customizing section backgrounds, typography, and spacing until the site feels genuinely yours.

You’ll also want to edit your footer in Elementor to replace the default theme footer with your own branding and contact details.

Before you dive into building pages, make sure you have the right theme in place. See our guide on how to add an Elementor theme to WordPress for the top compatible options and how to install them.

Recap:
Save 4 Later
Email liked links to yourself

    Stay Updated with WordPress Insights

    Get the latest WordPress tips, theme reviews, and industry deals delivered to your inbox.