How to Create & Develop Pages on WordPress 5.x

WordPress is a platform powering a major part of the internet. The CMS has grown from humble beginnings into a giant and continues to grow.

For the uninitiated, however, having a WordPress site poses some challenges.

The first challenge is how to customize the site according to preferences.

It’s a tough job if you go about doing it yourself without knowledge of code.

To make the development experience easier for you, we’ve developed a short guide on how you can develop a WordPress website.

 

How to Develop Pages on WordPress

So, without any delays, let’s begin:

 

Accessing WordPress

Once you’ve installed WordPress, type the URL of your site on the browser.

Without a doubt, it looks very good from the outset but a little less personal. WordPress uses a default theme when you first install it.

As of this writing, the default theme is titled “Twenty-Twenty” which can be changed for a better theme or personalized according to your preferences.

To access the backend of your website, you can type in the URL of your website followed by a “/wp-admin”.

For example: Yoursite.com/wp-admin

You will now be redirected to the WordPress admin screen.

Type in your credentials that you made in the setup process to access your WordPress website.

Go to Appearance > Themes. There you will see a list of themes installed on your website.

Now, if you have a premium or third-party theme, you can click on Add New to upload its zip file.

If you don’t have it you can search for the theme of your choice.

For customization, you can either use the WordPress Customizer or the Gutenberg block editor.

However, you will be limited in the level of customizations you can perform.

In this article, we’ll be using the Elementor Page Builder plugin to customize the page.

 

Installing Elementor

From your WordPress dashboard, visit the Plugins section and from the search box type in Elementor.

The search results will give out a variety of plugins related to Elementor.

The one you need to download is from Elementor.com. Download, install, and activate the plugin.

Once you’ve done that, it’s time we move on the next section.

 

Creating a WordPress Page with Elementor

Go to Pages > Add New and create a page titled Home.

Because of Elementor, you will see a button below the editor that reads Edit with Elementor.

Click on it to fire up Elementor.

To get the most of Elementor, you should remove the default layout to ensure you start building from scratch.

To do that, you need to go to the Hamburger icon located at the top-left of the page, click on it and visit settings.

From there, you will see a section called template.

Click on the drop-down and select Page Builder Full-Width.

This will remove the default layout of the page and leave you with an almost blank page.

Now, you can customize the theme according to your own preferences by adding a new section.

For the sake of convenience, however, you can use a template from pre-existing themes.

If you have a premium theme like the Deep Theme, you can perform customizations to it as well.

Overall, the use of templates makes the development processes for non-techies a lot easier.

Once you’ve selected a template, you just have to click on insert and upload the template on to Elementor.

You can edit almost everything within the template.

From reducing opacity, buttons, changing the content, colors, font, and more.

With Elementor, you can customize just about anything.

Tweak around with the functions provided by the builder until you’ve reached the right layout for your website.

In addition to that, you can also create and customize a contact us and about section for your site.

Afterwards, you can create a navigation menu and add a link to them on your site. Here’s how you can do that.

 

Creating “About Us” Page

The process is similar to how you will create any page on WordPress.

From your WordPress dashboard, visit Pages > Add New and title the page as “About Us” page.

Now, click on the “Edit with Elementor” button to start editing.

At this point, you’ll see a pretty bland page.

Now you can add the title of About Us at the very top of the page or below and image depending on your requirement.

Once you’ve done that, you need to select a layout where you can add the About Us content relevant to your website.

Now, you can add further customizations to the content but for now, it’s enough to make your site good.

 

Creating a “Contact Us” Page

Contact pages lie at the heart of the website experience.

How else can you enable your users to reach out to you? From retargeting and outreach, there are plenty of benefits of having a contact us page.

With Elementor, you can add a contact us page with ease.

First of all, you need to create a new page by going to Pages > Add New and name it as “Contact” or “Contact Us”.

Don’t click on the Edit with Elementor button just yet. For a contact page, you need a contact form.

To add a form to your website, you need to have a plugin like WP-Forms that lets you create forms. Once you’ve downloaded WP-Forms, it’s time you create a form.

When you’re done, save it, go back to your contact page and click on the Edit with Elementor button. What you will essentially see is an empty page.

Now, you can play around with it by adding styles, Google maps, changing fonts, and all.

Once you’ve done everything, it’s time you move on to integrate the Contact Form using the Add Widget.

You can even further customize the layout of your form to make it stand out with your site.

Now that we’ve developed three basic pages, it’s time we create a menu and organize it on Elementor.

 

Adding a Menu to WordPress

This part is relatively easy.

All you have to do is visit Appearance > Widgets and create a menu from there.

Once you’ve done that, start adding the pages you created to the menu.

When you’re done, save your changes, and then go back to Elementor.

If you’ve created a primary menu, Elementor will pick it up and you will have a header navigation detailing all your website pages.

 

WooCommerce and Elementor

If you have an eCommerce store on WordPress, you can customize it using Elementor as well.

Similar to how we edited the website above, we can edit a WooCommerce website with ease.

In addition to editing it with Elementor, you can even add wholesale functionality to WooCommerce using an all-in-one solution like B2BWoo eCommerce Plugin.

 

Conclusion

So, you’ve reached the end of this article.

We hope that this basic guide gave you the starting point to developing a WordPress website without needing any code.

We could have talked more, but for the sake of convenience, we feel that this information would be sufficient to not overwhelm the user.