Home Website builders Weebly Tutorial for Beginners | Build Professional Website For FREE

Weebly Tutorial for Beginners | Build Professional Website For FREE

by Stewart Gauld
Last updated on January 16th, 2023
Weebly Tutorial for Beginners | Build A PROFESSIONAL Website For FREE

In this Weebly tutorial for beginners, you’ll learn how to build a professional website for free.

Note: This tutorial is not for individuals who are looking to build an online store. If you would like to create an E-commerce website, feel free to check out this tutorial here:

Related: BEST Website Builder for Online Store


Why Use a Free Website Builder for Small Business?

The internet has transformed the way people shop. And yet, about one-third of small business owners haven’t created their own website, according to SmallBusiness.com.

Consumers do research before making purchases, and having a good website is a key part of that. 

Creating a professional website for your business isn’t just an option anymore. It’s a necessity, to say the least. If you want to show that your business is an established and legitimate business, a professionally built website is essential.


How to Create a Professional Website for FREE?

Now the question emerges – how to create a professional website that costs nothing?

This is where a free website builder like Weebly comes in.

Let’s begin with the first step of this Weebly website builder tutorial:


1. Weebly Sign Up

Weebly Sign Up Head over to Weebly.com and click ‘Create Your Website’.

Add your personal details and select ‘I just need a website in the next step. Here, Weebly will give you the option to pick any of the professional website templates.


2. Choose a Website Theme

Choose a Website Theme Selecting a website theme makes the entire website building process a lot easier, especially for beginners.

Navigate through different categories of the Weebly website themes and select the one that you would like to customize.

Navigate through the theme that you’ve just selected, and ensure that it best represents your business.

Click ‘Start Editing’ to begin the customization process and learn how to use Weebly to create your web pages.


3. Pick a Free Domain Name

Pick a Free Domain Name In the next step, you’ll be asked to register a new domain if you don’t already have an existing one.

Alternatively, you can connect your current domain with Weebly.

However, since we want to create a free professional website, you have to go with the third option – using a subdomain of Weebly.com.

Hence, for this Weebly editor tutorial, we’ll enter ‘stewartsfoodz’ which is currently available (fake business for today’s example). Click ‘Continue’.

Before we start customizing the website pages, we want to dive into the Weebly elements and settings in the next section.


4. Explore Weebly Elements and Settings

At the top bar, you’ll notice the following options:

Explore Weebly Elements and Settings Build

This option has to do with modifying the theme of each of your web pages (more on that later).


This is where you can create new website pages by selecting the type (standard page, blog page, category page, product page, or external page).

To create an ‘About Us’ page, for example, click ‘Standard Page’ and enter the page name.

On your website’s primary menu, you can see all your web pages.

Under ‘Pages’ on the left, you can change the order (using drag-and-drop) in which these pages appear on the primary menu. By using the drag-and-drop again, you can also create subpages.


This is where you can change the overall theme and style of your website..


To make your website more powerful, you can connect certain apps using Weebly. Examples include Site Booster, Shore, Scheduler Pro among others. However, in this Weebly tutorial for beginners, we’re not going to dive into these apps. You can create a professional website for free without them.


Here, you can enter more details like ‘Site Title’ (same as the domain name), site category, and click ‘Save’. Ensure that all details are correct and enable security (SSL).

The second option called ‘SEO’ is for more advanced users who want to rank their website on search engines.

Under ‘Editors’, you can manage a small team of people who are helping you build the website (if needed).

Under ‘Members’, you can enable the first option which would require visitors to register on your website (which would be a great option for a consultancy firm, for instance).

However, since ours is a café, we don’t require people to log in or register. So, you can disable the option for this Weebly editor tutorial.


If you have a blog on your website, this is where you can modify the settings.


If you have any questions about your Weebly account or you require support, you can add your questions here. This would bring up suggested articles that may address those questions.

However, if you need further assistance with this professional website builder, you can scroll down to the bottom and click ‘Contact us’.

Next to ‘Help’, you’ll find the preview button. This is where you can see how your website appears on mobile and desktop before you publish it.

On the far right, you will find the options to publish your website or upgrade to a paid Weebly plan.


5. Create & Customize Website Pages & Menu

Create & Customize Website Pages & Menu We will now understand how to use Weebly to make a website and we’ll start with the home page. Under ‘Pages’, select ‘Home’. Unlike other website builders like Wix which uses a drag-and-drop editor, the Weebly editor offers a simple grid system.

Each element that you hover your cursor over, is broken up into grids.

Because of this, it’s very difficult to go wrong with the design even if you have no experience. On the left, you will find individual elements that you can simply drag to add to your home page (or another website page).

But before that, we need to create a new section. To do that, grab a section block and move it to the place you desire.

Now, you can add the elements (text, images, videos, buttons, social icons) to this newly created section.

For example, you can drag and drop the image element on the white space. Right-click to upload an image from your system. Similarly, you can add a second image and place it to the left or right of the first image. That’s going to break the section into two areas.

You can grab a text element and place it between the two images.

Double-click on the pre-existing text to edit it. Go through the text editor to customize the text the way you like.

In the same manner, you can edit the pre-existing sections on the home page using this free website builder. On the top left, you can see your website’s name.

You can turn it off, change the text, or upload your business logo. Watch this Canva tutorial, to create a logo if you don’t have one. Apart from that, you can edit the buttons and change the text, style, position, link, and spacing.

Using the same method, you can link text to another page or website. Below the images that we added earlier, you can drag and drop a button element and link it to another web page – ‘Contact us’  for example.

At the bottom of the home page, you can add social icons. Click on this section and manage your icons like Facebook, Instagram, LinkedIn, and Twitter, etc.

Moreover, you can edit the background of each section. You can also move or delete it.

To delete any element, you can just click the ‘x’ sign visible on each element.

If you click ‘Show all elements’ on the left, you’ll find more elements like a slide show, map, embed code, RSVP form, etc. For example, you can add a Google Map, double click on it, and change the address if you like.

Similarly, you can drag and drop a contact form and a checklist below any of the fields in the contact form. You can customize each of these fields using this free website builder. Under ‘Form Options’, you can add a form name, confirmation message, and a business email.

To stop spam, you can turn on Google Captcha.

Also, read: Canva Free Logo Maker


6. Check Responsiveness and Publish Your Website

Check Responsiveness and Publish Your Website You need to check the responsiveness of your website before you hit ‘Publish’. Head over to the preview button again and select ‘Mobile’.

Mobile responsiveness is vital since most of your traffic is probably going to come from mobile devices.

By selecting ‘Desktop’, you can check the responsiveness of your website for desktops.

Once you’re satisfied with all your web pages, you are ready to go live!

Hit ‘Publish’ and you will be again given the option to choose your website domain.

We’re happy with our subdomain, so we’ll click ‘Continue’. People can now find your website and contact you through it.

Remember to copy your URL and send it to potential people, add it to your social media channels, and share it via email and other social media platforms.

You have now learned how to use Weebly to make a website for free!

Also, read: PROS & CONS of Website Builders


Weebly Tutorial for Beginners (Video Tutorial)

Irrespective of the industry your business operates in, a website helps you reach potentially millions of customers out there online.

But being an entrepreneur or small business owner with zero coding skills and limited time and resources can be intimidating.

Instead of hoping to get by without a website, use a free website builder like Weebly which should at least give you a place to start. When you do have the resources, you can always upgrade to a paid plan and hire a developer to manage the website for you.

Until then, you can leverage this Weebly tutorial for beginners to build a free website for your business.

We have a video tutorial that will also take you through the process of using Weebly to build your AWESOME new website. Enjoy!

YouTube video

You may also like

Leave a Comment

9 − 7 =