wordpress

There are several reasons for you to learn how to make a website if you are a small business owner who cannot afford a design agency or looking to add a skill set to help you make money.

Let me tell you my stories. Almost a decade ago, building a website took a lot of knowledge (the endless lines of codes that looked like flies, pretty gross!).

The good news is that things have changed today. There are so many intelligent website builders that making a site is like putting together a LEGO set.

Note: You may find this guide helpful if you are a complete beginner. After reading this guide, you’ll be able to create a website in no time. I will keep this article focused, and you will find links to relevant articles that are good to know

Before we proceed, I must tell you that initially or at least before you complete this course, you do not need anything but have a decent computer/laptop where you can practice what I am teaching you and successfully create a site.

You will need to install Xampp on your computer to practice building a site. Especially if you are learning so that you can offer web design and development as a service

If you are a business owner wanting to save on costs, I recommend not buying anything until you have completed your site (at least a basic one).

Read more: How to create a website on XAMPP.

Before we proceed, I must tell you that initially or at least before you complete this course, you do not need anything but have a decent computer/laptop where you can practice what I am teaching you and successfully create a site.

You will need to install XAMPP on your computer to practice building a site, especially if you are learning to offer web design and development as a service or a business owner wanting to save on costs. I recommend not buying anything until you have completed your site (at least a basic one).

Now let’s move to the essential steps.

Two things you need to make site online

To make your website discoverable on the internet, you must have these three things:

  1. Domain name (recurring subscription)
  2. Web hosting (recurring subscription)
  3. Website builder (free CMS)

1. Domain name- What is a domain name?

A domain name is the web address of your site. For example, www.yoursite.com will bring up your website when you type this address into your browser. It has three core components, separated by periods:

  1. The TLD or Top-Level Domain (eg.com,.net,.org etc.)
  2. The second-level domain (SLD), which is the next “level down” (e.g., www.techcrunch.com)
  3. 4. Domain names are precious for the third level domain, which is the next “level down” (e.g., crunchnet.com). They are the address of your website.

Best Practice for Choosing a Domain Name

A domain name is an essential part of online branding. Therefore, when choosing a domain name for your website, keep these simple rules in mind:

  1. “.com” should be the priority.
  2. The KISS principle (Keep it simple and short). The shorter, the better.
  3. Catchy and brandable as it will be easy to remember
  4. Easy to pronounce
  5. Do not use hyphens or numbers

Spend time brainstorming some domain names, list the words you can come up with, and then take a day or two to decide the best. Then, ask your friends and family members, look around for inspiration.

Below is the list of most popular website domain providers

2. Web Hosting

A web hosting company provides a virtual place for your site from where your website is accessible to the world. It is crucial to choose the right one because your site speed can affect user experience and site ranking in search engines.

If your website is not accessible to users or search engines because of the web host’s server, you will lose visitors and, eventually, business.

We recommend you BlueHost. It is cheap and is pretty popular. The lowest price is USD 2.75 per month, including the domain name.

BlueHost home page that shows the offer

3. Website builder

Now that you have the domain name and hosting. I used several free CMS (content management systems) as a beginner, and now I have settled on WordPress and so have 60.8% of website owners.

It is easy to use, has enormous community support, and you can learn everything you need to know in less than 5 minutes. In this tutorial, we are going to create a straightforward website using WordPress. The purpose of this website will be for you to post a simple website to give you a basic understanding of WP.

Install WordPress on your site

There are two ways to install WordPress on your website.

  1. One-click installation
  2. Manual installation

One-click installation

If you have BlueHost, then the process is straightforward. 

Go to the BlueHost pricing plan and choose the hosting plan. Based on the stage you are in right now, the lowest tier is fine. 

After that, you need to choose the domain name you want for your site, which comes free with hosting, or if you’ve already purchased from somewhere else, you can enter it under “Use a domain you own.”

Choose a free domain name from BlueHost

The next step is to fill in the form. (“Package Extras” are optional, and you can exclude them for now). After that, you can make a payment with PayPal or a credit card.

Once your payment is successful, you will see a payment confirmation page. Next, enter the password you want for your BlueHost account in the Create a Password for Your Account. Now, this is where the fun begins—follow this simple step to install WordPress.

  1. Login to the Bluehost control panel. Next, press the My Sites tab from the menu at the left and then click the Create Site option. Bluehost My Site Control Panel Screen
  2. In the next screen click the Start Building button under the WordPress option

Configuring SSL

SSL stands for Secure Socket Layer. It is a standard encryption protocol that encrypts the data sent to your website (including any data entered by your customers) before transmitting it over the Internet. Search engines require that every website has this to rank.

The good news is that SSL is free, thanks to Let’s Encrypt. To install SSL on your site (only for Bluehost users)

  1. Log in to the control panel
  2. Go to My Sites tab in the side navigation.
  3. Click Manage Site
  4. Go to Security tab on the next screen
  5. Under the section that says Security Certificate, verify your Free SSL Certificate: Let’s Encrypt status. Toggle On.

It may take few hours to install and activate. Once the SSL has been installed you will see a lock icon appear next to your domain name in your web browser address bar,

The lock sign appears after SSL is installed

Manual Installation

If you are creating the site in XAMPP, or somehow there is no option of one-click-install for WordPress with your current hosting provider, follow these steps.

  1. Download WordPress from https://wordpress.org/download/
  2. Please create a new folder on your computer and unzip WordPress in it
  3. Look for a file named wp-config.php and open it.entering database details in the wp config file to install WordPress
  4. Replace the following vaues with the exact information (contact the hosting support if you do not know the details)
    • ‘DB_NAME’, enter the name of the database for the WordPress
    • ‘DB_USER’, enter the MySQL database username
    • ‘DB_PASSWORD’ Emter the MySQL database password enter the mysql database detail in wp-config as shown in the image
  5. Save the wp-config file
  6. Login to the hosting provider’s control panel and look for the FTP option. Alternatively, you can use Filezilla (it is free). Next, check for the IP needed to access the FTP, the username, and the password. (again, check the provider’s knowledge base or ask for support.)Upload wordpress files from FTP
  7. Delete the “index” file if you see any. Upload all the files in the WordPress folder to your server.
  8. The last step is easy go to yourdomain.com/wp-admin/install.php and you would see a page like thisManually install WordPress Welcome screen
  9. Below are the instructions for completing the form.
    • Site Title: The name of your site in our case Crazy Media Design
    • Username: WordPress’ default username is admin. It’s best to change it immediately; otherwise, your site is at risk of hacking
    • Password: Enter a password that is tough to guess. If you are using a password generated by WordPress, save it in a secure location
    • Your email: You can use any generic email id you own. You will receive notification from your website for anything important such as updates, etc.,
    • Search engine visibility: Uncheck the Discourage search engines from indexing this site

WordPress Themes

After installing WordPress on your website, the next step is to build pages, customize the look, and add content. Finally, it’s time to choose a WordPress theme.

In essence, a theme determines the look and feel of your website. 

There are plenty of free and premium themes to choose from when it comes to making your website. The WordPress Theme repository boasts 8803 free themes.

Installing free WordPress theme

To install a free one, go to Appearance>Themes. and click on the Add New Theme.

Click the Add New Theme to add a theme to your website

The next screen is Add Themes. Enter the keyword in the Search themes…. bar to find a suitable theme for your niche.

search for a suitable free theme from the WordPress repository
Search for a suitable free theme from the WordPress repository

Click on the Live Preview button to see what the live version of the theme looks like before adding it to your site. (Recommended)

Use live preview button to view how the theme looks like before adding to your site
Preview theme before adding

In the Details & Preview screen, click Activate to Install after shortlisting the theme of your choice.

Click Activate to install the WP theme
Click Activate to install the WP theme

Premium WordPress themes

While free works fine, I prefer using the premium ones as it saves a lot of time and makes my site stand out (it’s personal preference- the free works just fine 😉 )

If you have not checked out these marketplaces yet, then I recommend that you do. Premium ones offer support, should you need it, and are cheap, in general. Some recommended marketplaces for WP themes are:

  1. ThemeForest
  2. Creative Market
  3. MOJO Marketplace

Now to proceed further, you will need to have a basic understanding of terminologies

Add content and customize your website

Pages vs Posts

I wanted to cover the difference between pages and posts first, as it is essential to understand. I can recall how confused I was as a beginner. Also, before we can start with customization, it makes sense to have some content on the site.

PagesPosts
Static contentDynamic content
Part of the menu (header, footer, or both)It doesn’t typically appear in the menu
Not relevantChronological order meaning the newest post appears on the top
Typically pages are Home, About Us, Contact Us, Terms and Conditions, etc. It is used primarily for informing about the company.A post is for writing about different topics based on what stage your prospective buyer is in.

Regardless of the type of website you want to create, certain pages are essential if you’re going to gain the trust of your customers.

  • Home
  • About Us
  • Contact Us
  • Privacy Policy
  • Terms and conditions

I hope that it clears some air around posts and pages. Now for this tutorial, we are going to use Twenty Twenty-One to create a site. It’s a free template.

Branding

We will now work on the branding part of the site, such as changing the logo, adding a favicon, colors, etc. Go to Appearance>Customize

Add logo and favicon to your site step 1
Step 1- Add logo and favicon to your website

Click the Site Identity button

Add logo and favicon to your site step 2
Step 2: Click on the Site Identity

You can now fill in the following information:

  1. Logo
  2. Site name
  3. Tagline
  4. Site icon (favicon)

After the logo and favicon have been added, let’s look at the other customization options.

  1. Colors & Dark Mode: You can choose the background color of the website. If you check the Dark Mode Support, it gives the site visitor an option to show a dark background with light text. Learn more about dark mode here Color and Dark Mode in WordPress
  2. Background Image: You can upload an image to replace the background color
  3. Menus: This section allows creating menus. Menu option in the WordPress customizer for site
  4. Widgets: Widget allows adding features to your website in the sidebar and footer (look at the right section of this article) Homepage settings in wordpress
  5. Home page settings: You can choose which page is displayed as the homepage. Make sure you have at least two web pages: one for your homepage and one for your blog. Your blog’s articles will appear in chronological order on the blog page. 
  6. Excerpt Settings: Over here you can choose if you want to show the full post or summary as an excerpt. Leave it the way it is. 
  7. Additional CSS: Additional CSS is for advanced users who have a basic knowledge of CSS. You can override the default CSS code of the theme from here. 

Creating Pages

Finally, it’s time to create pages for your website. Go to Pages>Add New. Currently, Gutenberg is integrated into the default themes that come with WordPress, such as Twenty Twenty-One.

Creating Home page

Add the title to the page here. Then, in the right section, ensure the page option is active. You can add things such as a featured image.

How to create homepage in WordPress
How to create a homepage in WordPress

You can follow the exact process to create other pages on your site.

Creating a contact us page

As many of you would be happy to see a contact form on the Contact Us page, I wanted to create a separate section dedicated to it. Don’t worry; it’s simple.

First of all, you need to have a contact us form. You can see a more detailed guide here. To create a form, you will need to install the free Contact Form plugin (you will also learn how to install plugins in WordPress).

  1. In the left sidebar, go to Plugins>Add NewCreate a contact us page
  2. In the top-right search field, type Contact Form and look for Contact Form 7 Search a plugin to create contact form
  3. Click Install Now>Activate to install it and start using it. Install a plugin for your site
  4. In the left sidebar click Contact>Contact Forms to go to the next step Customizing a contact form
  5. Click on Contact form 1 to open and customize it Customize contact form to add mail id
  6. Let’s leave the first tab, Form, with its default value for now, and move on to the second tab, Mail. Enter the same domain’s email address for the To and From fields. Click on Save Let's leave the first tab, Form, with its default value for now, and move on to the second tab, Mail. Enter the same domain's email address for the To and From fields.
  7. Copy the code (we will need it for embeding the contact form) Embed code of contact form
  8. Create a page called Contact Us. Include the text you want visitors to see on the page. Insert the code you copied into the page. 

Well, it was easy.

Adding a Blog page

Blog page is where all your blog posts are listed chronologically. Create a page called Blog.

The next step is to go to the Settings>Reading>Your homepage displays>A static page select Home from the Homepage and Blog from the Posts page from the drop-down menu.

select homepage and blog from readings menu option

Adding Header Menu

Adding a menu is pretty straightforward and, in my opinion, the easiest. The theme already comes with the header and menu, but we will go through it to avoid confusion.

Create menu in WordPress website
  1. Navigate to the Appearance>Menu.
  2. Click on create a new menu> Menu Name (Under Menu structure)> Give a name that will be easy to recall if you have to make edits. The example below is called the Primary menu or Header menu.
  3. Shows you the list where you will see sections Pages, Posts, Custom Links, Categories.
    • Pages: You will find all the pages you have created on your site under it
    • Posts: All the posts you have created will be under it 
    • Custom Links: You can use this if you want a link to an external page/source here. E.g., if you have a form on, say Google Form, that a customer needs to fill, you can enter the link here.
    • Categories: Categories are for arranging your blog posts. E.g., If you have a travel activity blog, create a post category under Posts>Category. The category you will create will show here.
  4. Drag the pages you created earlier to the Primary menu you created.
  5. Go to the bottom of the screen and under Menu Settings, select Primary menu, and then click Save Menu

Important note

Suppose you want to reap the benefit of your website. In that case, I recommend regularly posting unique and valuable content for your target audience so that you can rank on Google search and drive traffic to your site to generate leads.

Leave a Reply

Your email address will not be published. Required fields are marked *