How to make a WordPress Website in 99 minutes

Jun 3, 2014 · 9 min read · hostgator plugins web design web development wordpress website  ·
Share on:

Update 2021

So the content on this page needs to be refreshed to reflect modern web development. The steps to register the domain name and build the site may not work as shown in the video. I plan to refresh the content on this page.

--

This is a Step-by-Step tutorial on how to make a wordpress website. By the end of this article you will have made a fully fledged wordpress website with a Home, About Me, Contact Us and a Blog page. You will learn how to choose a hosting provider, select a domain name, install wordpress on your website, upload your photos/videos and configure your website.

Time taken to complete this task: 99 – 140 minutes

Prerequisites: None

There are 2 ways to complete this tutorial. First way is to watch the YouTube video of the tutorial. The second way is to complete this tutorial in parts. Apart from a massive 144 minute YouTube video, I have divided the same video into 10 parts so you can consume the content step-by-step. All of these videos are embedded on this page along with useful text descriptions and the occasional screenshot to clear things up. I leave this choice upto you. The meat of the learning is in watching the videos. I have deliberately explained every menial thing that I do while creating the website so you can latch onto the thought process and methodology of creating websites.

The FULL video tutorial:

The learning road map

The respective time stamp range is provided next to the task.

Register a domain name & get hosting: 0:00 – 15:33
cPanel & Installing WordPress: 15:36 – 22:25
Install a WordPress Theme, Create Homepage: 22:27 – 32:07
Adding Logos: 32:11 – 40:17
Customize Slider/Adding Pages/Image Galleries/Embed YouTube Videos: 40:21 – 1:01:47
Adding Blogposts & Portfolio Items: 1:01:50 – 1:25:01
Adding Icon Menu/Finishing up the Homepage: 1:25:08 – 1:33:30
Adding Contact form/Embed Google Maps/Install Facebook Plugin/configuring the sidebar: 1:33:36 – 1:51:40
Adding a Multilevel Menu: 1:51:45 – 1:56:20
Add Login Page/Configuring the footer/Add a Favicon/Conclusion: 1:56:24 – 2:21:43

Download this wordpress theme

Virtue WordPress Theme: http://www.kadencethemes.com/product/virtue-free-theme/

For those of you who want to watch the video in parts and follow along with some text and screenshots, proceed ahead:

Introduction

You will never learn what you are about to read in any university or high school. Computer science courses in university focus on teaching you how to program websites. You learn HTML, CSS, JavaScript and PHP/Python. Most websites in the world use these technologies, so these are useful skills to learn. But in college you have only one semester to learn all this. This means that all the focus is on learning how to code. You practice your web development skills on the university machines which take care of storing your webpages on a server. They provide you with a nifty little tool to edit and upload  your code on the cloud and all you have to do is refresh the page to see the changes you have made.

All this is fine but this is only half the picture.  It is only when you come to the industry or when you want to launch a real world website when questions like..

“ok, how do i register a .com website?”

or

“ok.what is server hosting and how do i get it?”

..come to mind. This is VITAL real world information which is left out of university education. Mainly because you need a credit card to register a domain name, ie, a “.com” website and most 18 year old university students do not have credit cards.

Registering a domain name, getting hosting, configuring the DNS, migrating code and managing databases are essential tasks that need to be performed when you want to make a website. Fortunately, these are simple to learn and it takes less than a day to get familiar with these technologies. A week if you don’t know the difference between DNS and HTTP.

You will learn all this as we go over the steps leading to creating your own website.

Having your own website adds tremendous professional pedigree to your online profile. Surely, “yourname.com” sounds better than “yourname.wordpress.com” or “yourname.blogspot.freedomain.mycoolfreesite.com”. :p

Read on to find out how to make your very own website on a domain name of your choice.

Choosing a hosting provider

or “How to choose a web host for my website?”

or “Where will my website live?”

First off, who exactly is a web host. A web host or hosting provider is a server (usually a bunch of servers) which store all the files and databases which constitute your website. A server is just a technical term for an industrial computer whose purpose is to interact with other computers by responding to their requests for data. For example, Facebook stores all the data (profile pics, wall posts, albums, sharing preferences etc) associated with a profile on its servers. Whenever you click on your profile button, your browser sends a request to the facebook server where your profile information is stored asking for your profile page. Upon receiving this request, the FB server responds to your browser by sending it your profile page with all the data (like first post, profile info etc) and your browser formats the appearance and presents it to you. Facebook owns thousands of such servers which it places in the same room and calls it a “data center”.

A web host or hosting provider also owns many such servers in a data center where it stores website data for thousands of websites. If you want to have a website, you HAVE to rent space at some web host. Alternatively, you could convert your computer into a server and save on hosting fees but when you turn your computer off, your website also shuts down. Inconvenient.

Fortunately for us, there are plenty of web hosts. Some good, some awful. Based on my experience, the best web hosts are the ones with excellent customer service. You don’t want to pay for a cheap host and then have to cluelessly run around trying to figure out how to add a subdomain and do the most basic of website maintenance tasks (or worse when you accidentally break your website and need an expert to revert to your old site).

One web hosting provider which provides excellent customer service at a cheap price is Hostgator. These guys have been around for a long time. They have a 24×7 LiveChat service manned by web engineers who patiently solve even the most ridiculous of requests. From database maintenance to website recovery to simple tasks like spoonfeeding you the process of creating an email account are carried out by these blessed customer service reps at Hostgator. I have registered  tens of domain names with Hostgator and introduced many clients to them. In the past 4 years or so, there hasn’t been a single downtime issue.

If you are serious about having your own website, then you must get hosting. Go to the Hostgator website and move on to the next Step to learn how to purchase hosting and create a domain name.

Part 1/10: Register a Domain Name & Get Hosting

After completing this section you will have registered a domain name and acquired hosting with Hostgator.

See the video of Part 1/10 here:

IMPORTANT NOTE: Your domain may take 24-48hours to fully propagate across the web. This means that if your website does not open, just clear your browser history and cache and keep refreshing the page. Either you page may not open or you will get a message from Hostgator saying that it will take 24-48 hours for your domain name to propagate across all the DNS servers around the web. Since this is a new domain, all the name servers have to be notified of a new website and have to update their directories accordingly. This is carried out automatically by Hostgator, so feel free to move on to the next section where you will install wordpress on your website and create a Home page, add a blog post, upload a photo/video and create many boilerplate pages like Contact us etc.

 

Part 2/10: Installing WordPress on your website

After completing this section you will get acquainted with cPanel and will install wordpress on your website through one-click QuickInstall. You will then proceed to login to your wordpress website, take a short tour of the dashboard and change your password See the video here:

PART 3/10: Install a new WordPress Theme & Create a Homepage

After completing this section you will have installed a new theme and created you first page – the Homepage!

See the video here:

PART 4/10: Add a logo to your website

After completing this section you will have added your own logo to the website and will learn how to upload images to your wordpress.

See the Video here:

PART 5/10: Add Slider, Create Pages, Add Images/Image Galleries & Embed YouTube Videos

After completing this section you will have:

  • added a customized slider to the homepage
  • added 3 pages
  • added images to your pages
  • added an image gallery to your page
  • embedded a video from youtube to your page

See the video here:

PART 6/10: Adding Blog posts & Portfolio pages of your creative work

After completing this section you will have:

  • added blog posts with image sliders to your website
  • created portfolio pages to display your projects, creative work etc

See the video here:

PART 7/10: Adding Icon Menu & completing the Homepage

After completing this section you will have:

  • added icon menus to the homepage to display features related to the website you are making
  • completed customizing the homepage to include blogposts, portfolio slideshow and an icon menu

See the video here:

PART 8/10: Contact forms, Embed google maps to your page, add a Facebook ‘Like’ box & configure the sidebar

After completing this section you will have:

  • added a contact form to your contact us page.
  • embedded a google map to your page to display your address.
  • install the Facebook plugin and add a ‘Like’ box to your facebook page on your sidebar
  • create and customize your sidebar

See the video here:

PART 9/10: Add a multi-level menu

After completing this section you will have:

  • added a multi-level menu to your website.

See the video here:

PART 10/10: Customize footer area, add a favicon & a login page

After completing this section you will have:

  • customized the look and placement of the main menu.
  • added a ‘login’ page to your website using the ‘Theme My Login’ plugin for wordpress
  • customized the footer area of the website
  • added a favicon to your website

See the video here:

comments powered by Disqus