A simple website construction tutorial

For many people, in fact, building a website (not limited to a personal website) can greatly stimulate learning interest, and it can also be a practical way to exercise technical skills by putting into practice and putting together theoretical knowledge that was previously understood and understood. If you can really use it, there may be unexpected gains.

Here, I have organized a tutorial for building a station quickly. Everybody is interested in it and can try it out.

1. Choose the right platform

If you want to quickly build a useful, mobile-friendly, functional website, then you need to choose a platform (also known as CMS

1.1 What is CMS?

CMS Full name Content Management System , which is the content management system.

Looking back in 2004, most of the websites were written using html, css, and even flash. This requires a lot of code to be written, and it takes a lot of time and effort to learn, and it is not easy to grasp.

This is why so far people have found it difficult to create a website from scratch, involving a lot of coding and design skills.

However, this is not the case.

Today, in 2018, using a CMS such as WordPress, anyone can easily create a website.

Simply put, CMS (or other website building platform) is a user-friendly platform for building websites and managing online content.

1.2 The Most Popular Site Construction Platform in 2018

According to recent W3Techs survey results, WordPress is currently the most popular CMS (55%), followed by Joomla (20%) and Drupal (11%).

1.3 Here’s why it’s recommended to use WordPress

WordPress vs. HTML & CSS: Learning HTML from scratch probably takes more than 6 months, not to mention CSS or PHP. Although it is better to master the basics of HTML, if you want to create your own website within a couple of days, then learning HTML from scratch is not a feasible solution.

WordPress vs. Website Builders: Website Builders are usually expensive and limited in functionality. If the site has only one page, Website Builders is fine. If there are many pages, Website Builders is not a good choice.

WordPress vs. Joomla/Drupal: Drupal is a powerful platform for building websites. It is very popular among web developers and experienced programmers, but because of its steep learning, it is not a good choice for beginners. Joomla is also good, but compared to WordPress, it requires website builders to have more programming skills.

1.4 WordPress is highly recommended for beginners

To be honest, this is the easiest platform for building a website. At the same time, it is also very flexible. From small business owners to freelance artists working on art creation and blogging websites, it is suitable for almost anyone.

1.5 Before starting the next step, you need to:

Choose a site platform, I recommend here is WordPress, because it is simple and free. This tutorial uses WordPress as an example to teach you how to build your own website.

So far, you don’t need to download and install anything. Next, follow me step by step.

2. Get domain name and virtual host

Before building WordPress, do two things first:

  • Get domain name (just like yoursitename.com Such a website address)
  • Get a virtual host (a server that provides hosted services that connects your site to the Internet)

WordPress itself is free, but to buy a domain name and web host, you need to spend a little money a month, but fortunately not expensive, may be a cup of coffee money.

Having your own domain name can make the site comparable yourbusiness.my-free-website.com This use of someone else’s domain looks more professional.

Having your own virtual host can guarantee that it won’t hang up suddenly, and it can provide very fast response time.

2.1 How to Obtain a Domain Name and Virtual Host

Alibaba Cloud is recommended for domestic use. Godaddy, Name, Bluehost, etc. can be selected for foreign languages.

The following Bluehost.com For example, explain how to register a domain name and obtain a virtual host.

It’s actually not expensive, and the customer service is better, and currently there are free domain names to choose from, which is worth a try.

Once you have obtained a domain name above, you will also receive a personal email account, such as you@yoursite.com, which looks more professional than your email account registered with a third-party domain name.

Here’s a step-by-step guide on how to apply for a domain name, get a virtual host, configure a website, and more.

2.2 Detailed steps

2.2.1 Login Bluehost.com

2.2.2 Select Website Hosting Plan

Click on get started now enter select your plan page.

For beginners, basic is $2.75/mon, which is basically enough. Plus and prime are relatively expensive, because they provide more features than basic, but for beginners and new websites, they do not use so many functions. So, choose the cheapest basic here.

2.2.3 Take a good domain name

Here are two simple and practical principles:

  • If you are applying for a domain name for your company, then you can use a domain name associated with your company name, such as YourCompanyName.com
  • If you are applying for a domain name for a person, similar YourName.com This will be fine.

Domain names usually end with .com, .org, .net, but there have been many recent extensions like .agency, .pizza.

In the selection of domain names, the author’s suggestion is to try to use .com, .net, .org these common domain names, it is best not to use strangely expanded domain names.

2.2.4 Filling in personal information

After completing the domain name, click next. If the domain name is available, then enter create your account page.

After filling out the personal information in the form, you will receive a confirmation email in your registered email.

2.2.5 Checking Package Information

The default payment period is 3 years, which can also be changed in the Account Plan. The latter charging options are additional services that can be purchased on demand, and the final payment information is carefully checked.

2.2.6 Creating a Password

After filling out the payment information, click Submit and the payment is made.

After paying a good payment, a confirmation email will be sent to your email address, which means that the registration and purchase are successful.

Next, you will be prompted to create a password for your account.

2.3 Before starting the next step, you need to:

Come up with a unique domain name that matches your personal business

Buy a virtual host to host your website

3. Build a website

With a good domain name and web host, you can start building your own website now.

3.1 Install WordPress

The first step is to install WordPress in the virtual host.

There are two ways to install.

3.1.1 One-click installation

The vast majority of web hosting now supports WordPress one-click installations because it greatly simplifies the installation process and saves builders unnecessary manual labor.

After you’ve registered your Bluehost web host, you’ll find the 1-click-installation feature on the personal account management page.

The steps are as follows, and other virtual host providers are generally similar.

  • Account login Bluehost
  • Find the control panel
  • Find the WordPress or Website Icon
  • Select the domain name of the website you want to install
  • Click Install Now. After the installation is complete, you can access your WordPress website.

3.1.2 Manual Installation

If the web hosting does not provide WordPress one-click installation, then you have to install it manually. Manual installation is a bit cumbersome. We will not explain it here.

3.2 Selecting a Theme Template for the Website

After installing WordPress, visit the domain name and you will see a basic page.

Next, you can customize the topics you want. Here is an example.

WordPress offers thousands of professional themes to choose from, and you can customize your website pages based on these themes.

3.3 How to find the desired topic

3.3.1 Login WordPress dashboard

If you do not know how to log in, you can enter it in the browser URL field yoursite.com/wp-admin , Replace yoursite with your own domain name just fine.

WordPress dashboard is like this.

3.3.2 Finding Free Themes

In the WordPress dashboard, there are more than 1500 free themes that can be used. Find Appearance in the side navigation bar and click Themes.

If the theme is not enough to meet your needs, then you can go ThemeForest.net Looking for the above, there are a large number of topics ranging from price to choice.

However, before this, it is recommended that you take a look at the free themes above the WordPress dashboard. Many of them are very professional.

As shown in the figure, the installation theme is very simple and convenient.

You can use keywords to search for the desired topic and find the one that suits you best.

In addition, you should try to use responsive topics, which means that it fits on mobile devices as well.

3.3.3 Installing Themes

Find your favorite theme and click install now to start the installation. It’s very simple.

Explain that changing the theme will not delete your previous website data. You can change the theme frequently and with confidence.

3.4 How to add content and create new pages for a website

After the theme is installed, you can add content to the site. Let’s take a quick look at the basics.

3.4.1 Adding and Editing Pages

Want to add a “Services” page? Or “About Me” page?

  • Find Pages -> Add New in the WordPress Dashboard side toolbar.
  • Next, you will find an interface that is similar to Word. Add the graphic you want and save it.

3.4.2 Adding Pages to the Menu

If you want to link a page to the menu navigation bar, do this:

  • Click the Update button to save all changes to the page.
  • Click Appearance -> Menus on the WordPress Dashboard Side Toolbar
  • Find the page you just created and select it, Add to Menu

3.4.3 Adding and Editing Pushes

If you are a blog type website, you may need to push articles frequently. You can use categories to classify similar articles.

For example, if you want to create a category called blog, then add it to the menu, then start the article push just fine.

What you need to do is:

  • Click Posts -> Categories on the WordPress Dashboard Side Toolbar


  • Click Posts -> Add New to create a new blog feed. After editing the blog, put it in the appropriate category

After creating a category, put it in the menu and you’re OK.

3.5 Customized and Continuous Adjustment

3.5.1 Change the page title and tagline

The page title visually shows visitors how their site is used. It also determines the ranking of your site on the search engine, so make sure that the page title contains the appropriate keywords, and that all pages on the site should be There is a unique title.

Tagline is at the end of the title of each page.

Edit the title and tagline in the Settings -> General location on the WordPress Dashboard sidebar.

3.5.2 Disabling Comments and Comments

Disable page comments

  • When creating a new page, click the Screen Options option in the upper right corner
  • Click Discussion, the Allow Comments check box appears at the bottom
  • Remove the Allow Comments check box.

Disable all page comments

  • Find Settings -> Discussion on the WordPress Dashboard Side Toolbar
  • Remove the check box from Allow people to post comments on new articles

3.5.3 Setting Up Static Pages

Static pages are pages that will not change.

Unlike blog sites, the last published articles/pages tend to be at the top of the list. Static pages are the same for every login and visit, just like the homepage you specify.

Set the static page method:

  • 找到 Settings -> Reading
  • Select A static page

If no static page is set, WordPress will display your latest push on the home page.

3.5.4 Editing Sidebars

Most WordPress themes show the sidebar on the right (sometimes on the left)

If you don’t want the sidebar, or if you want to change the content displayed in the sidebar, you can do this:

  • Find Appearance -> Widgets in WordPress Dashboard
  • Here, you can use drag and drop to make changes to the sidebar

3.6 Installing Plugins for More Features

3.6.1 What is a plugin

The role of plugins is to extend WordPress capabilities and add extra functionality to your website.

Using plug-ins, you avoid the hassle of developing features from scratch and you can quickly build the features you want.

Plugins do almost anything, such as adding photo albums, submitting forms, optimizing websites, opening online stores, etc.

3.6.2 How to Install Plugins

In Plugins -> Add New, search for the plugin you want. There are more than 25,000 free plugins, so you have a lot of options.

Installing the plugin is very simple. Find the plugin you want and click install.

Here is a brief introduction to the three most popular plug-ins.

  • Contact form 7: Using this plug-in, you can easily email the website owner without logging in to a third-party mailbox.
  • Yoast SEO for WordPress: If you want your website to have SEO capabilities, then this plugin is a good choice, and importantly, it is free.
  • Google Analytics: This plugin can effectively count traffic information and visitor behavior.

Congratulations. So far, a pretty good website has gone live.

The article is mainly translated from https://websitesetup.org
First posted to WeChat public number: Red monkey