Uploaded by Komal Shujaat

Fahad-A.-Cheema-Ultimate-Guide-to-make-a-Website-on-WordPress

advertisement
WordPress 101: The Ultimate Guide
to make a Website on WordPress
A Complete Beginners Guide That Requires No Coding,
No Hosting, No Domain
Fahad A. Cheema
fahadacheema.com
Page 1
Who Am I?
I’m a Personal Growth Writer and a UI/UX Consultant
currently residing in Bremen, Germany.
I have been designing and developing websites for 3 years,
starting from small projects to working with big
organizations like M
​ itsubishi​ and the ​National Center for
Big Data and Cloud Computing (NCBC) Pakistan​.
If you want to send me a message you can email me at
hello@fahadacheema.com​ or DM me on I​ nstagram
Table of Contents
● Introduction
● Section 1: Local Environment Setup
○ Install WampServer (Windows Users)
○ Install XAMPP (Mac Users)
○ Installing WordPress
● Section 2 – Inside WordPress
○ Install Themes
○ Add Website Content (Posts, Pages, Menus/Navigation)
○ Install Plugins
● Section 3 – Deployment
○ Configuration
○ Transfer Website
● Conclusion
● Full Video Course
Page 2
Introduction
So you come up with an idea to start your own online business, start a blog, have your online
brand, or simply create a portfolio for your next job application but if you’ve never built a
website before, you’re probably feeling a little overwhelmed.
You’ll think of hiring a professional developer and they’ll quote you such premium prices that
will probably make you drop your entire idea (I have been on both sides of the picture).
Well, I have good news for you​ — this comprehensive guide will walk you through everything
you need to know in order to set up your first WordPress site. And you know what? Even if
you don’t have a geeky bone in your body, by the time you finish completing all the steps in
this guide, you’ll have your very own website up and running.
Now I know there are tons of guides and courses out there that offer similar information but
here’s why this is different and why you should take this:
●
Unlike most guides out there, y
​ ou don’t need to invest in any hosting or domain​ to
get started on creating your first website. That will be the very last step when your
website is complete and ready to go live. Before that, a computer with an internet
connection is enough for you to follow this guide and if you’re reading this, then
obviously that’s covered.
●
I value your time and that is why I won’t be wasting it by telling you what WordPress
is and why you should use it for your website but let’s just say that out of hundreds of
frameworks out there to create a website, chances are you might have only heard of
WordPress because it’s that popular. ​WordPress runs 36% of all websites​. Yes, you’re
reading this right, that’s all websites and that’s all you need to know.
●
You don’t want to consume 8 hours of content just to make a very simple website
that requires maybe only 10% of that content. In this guide, I’m not going to be
teaching you WordPress but rather the skill of making a website on WordPress by
only focusing on the critical elements.
Let’s get started
Section 1 - Local Environment Setup
Remember when I said earlier that you don’t need to invest in any hosting or domain to start
creating your website? Well, I wasn’t kidding and this is the part where you’ll understand why.
Page 3
The hosting you buy online is a server that hosts your website files and since that server is
going to be connected to your domain e.g w
​ ww.example.com​, whenever someone enters the
URL ​www.example.com​, the browser starts displaying the files that are hosted on that server.
In this section, I’ll tell you how you can set up the same server on your local machine that will
allow you to create not just one but as many WordPress websites as you want. The only
difference is that this server is not going to be connected to any domain and is only going to
be accessible on your computer.
You see, it’s always a good practice to first create your website on your local machine and
once everything is finished, you can upload it to your hosting so that it’s accessible for
everyone else to see.
To achieve all of this, you have to install WampServer if you’re a Windows user or XAMPP if
you’re a Mac user.
Install WampServer (Windows Users)
1. Download and install ​Visual C++ Redistributable for Visual Studio 2012 Update 4
(Choose 64-bit or 32-bit based on your operating system)
Note: ​When installing if it shows three options of repair, uninstall and close instead
of install, that means it’s already installed on your system and you can skip it.
2. Download and Install WampServer (​32-bit​ and ​64-bit​)
Remember a couple of things during installation.
Don’t change the destination folder of the installation because everything else I tell
going forward will rely on that.
During the ‘​ Select Components’​ part of the installation, check all the unchecked
boxes.
At the end of the installation, two popups will show up asking to change your default
browser and text editor. Don’t change them and click on ‘​ No’​ for both the popups.
3. Once the installation has finished, you will see the WampServer icon on your desktop.
To start the WampServer, click on that icon and you’ll see a small red icon show up in
the minimize tray at the bottom right of the screen. Wait for that icon to turn green
and if it does, that means everything is working perfectly and you’re good to go!
Page 4
Another way to test if it’s working is to open your browser and type ‘​ localhost’​ in the
address bar. If a page like this shows up then you’re on the right track.
Install XAMPP (Mac Users)
1. Download and Install ​XAMPP
2. Once the installation has finished, launching the application will open up a control
panel for XAMPP. In the ​‘Manage Servers’ t​ ab make sure that both the Apache Web
Server and the MySQL Database are running. If not, start those services and wait for
them to say ‘​ Running’​.
3. Open your browser and type ‘localhost’ in the address bar. If you see a XAMPP
landing page show up, then you’re good to go!
Note:​ Just to make sure you don't run into any other problems when working with WordPress
please make sure to change the XAMPP folder permissions on macOS.
For that do the following:
Page 5
●
●
●
●
●
●
●
●
●
●
●
Open applications folder
Locate XAMPP folder
Right-click, get info
In the pop-up window locate the 'sharing & permission' section
Click the 'locked' padlock symbol
Enter admin password
Change 'Everyone' permissions to read & write
In the get info window still, select the 'cog' icon' drop-down option at the very bottom
and select 'Apply to enclosed items' this will adjust the permission across all
sub-folders
as well.
Re-lock the padlock symbol
Close the 'Get Info' window
Installing WordPress
Now that we’re done setting up a server on our local machine, the next logical step is to
create your first WordPress website on that server. ​Make sure your server is running in the
background before you start.
Before going forward, there are some PHP settings you should change. Left-click on the
Wamp icon and go to ​‘PHP > PHP Settings’​. In that change the following:
●
●
●
●
●
●
max_execution_time: 300
max_input_time: 300
max_input_vars: 10000
memory_limit: 1G
post_max_size: 256M
upload_max_filesize: 256M
Remember​ the post_max_size value should be the same as the upload_max_size.
If you’re using XAMPP on Mac, you’ll find the PHP Settings in ‘​ /private/etc/php.ini’​. Open the
file in an editor and search for these keywords mentioned above to change their value.
Note:​ The process that follows can be replicated to create as many WordPress websites as
you want.
1. Download the WordPress files from its o
​ fficial website​ and save it wherever you want
on your computer.
2. Extract the zip file to get a folder called ‘​ wordpress’​.
3. Windows Users: ​Go to your ‘​ C:/wamp64/www directory’​ and create a new folder
‘myfirstwebsite’​.
Page 6
Mac Users: ​Go to ​‘Applications/XAMPP/htdocs’​ directory and create a new folder
‘myfirstwebsite’
4. Copy the contents of the ‘​ wordpress’​ folder into ​‘myfirstwebsite’​.
5. Open your browser and in the address bar, type ‘​ localhost/phpmyadmin’​. This will
open the login screen to your MySQL Server. Type ‘root’ as the username and for the
password leave it blank and in the server choice, make sure to select ‘MySQL’.
Once you’re logged in, at the very left you’ll see a list of databases already created on
the server. Now, we need to create a database for our website that will store all of its
information. For that, click on the link that says ‘​ New’​ at the top of the database list.
In the field where it says ​‘Database name’​, type ​‘myfirstwebsite’​ and click on create.
Note: ​At the top of your screen, right next to the PHPMyAdmin logo, you’ll see a text
saying ‘​Server: MySQL:330x’​. The value of x can vary but just remember this value.
We’ll be needing it going forward.
6. Open your browser and in the address bar, type ‘​ localhost/myfirstwebsite’​ and you’ll
see the WordPress setup wizard on your screen. Just follow the wizard because it’s
pretty straightforward except for two steps.
Database connection details
Database Name: myfirstwebsite
Username: root
Password: Leave this blank like we did when logging in the MySQL server
Database Host: localhost:3308 or localhost:3306 depending on your value in
PHPMyAdmin
Table Prefix: wp_
Website Information
Site Title: My First Website (you can always change it afterward)
Username: This is going to be the username to login to your WordPress website once
it’s installed so set it accordingly.
Password: Same goes for the password
Your Email: Enter your email address here which will be set as the admin email
address
Finally, click ​‘Install WordPress’​ and in a few seconds, you will have your WordPress
website up and running. Once you get the success message, login to your website’s
Page 7
dashboard using the credentials you set. To see the actual website and what it looks
like, click on the home icon at the top.
Note: ​Whenever you want to visit your website, just type ‘​ localhost/myfirstwebsite’​ in
your browser’s address bar. If you’re not logged in and want to visit your website’s
dashboard, type ​‘localhost/myfirstwebsite/admin’​ or
‘localhost/myfirstwebsite/wp-admin’​ in the address bar.
Section 2 - Inside WordPress
Congratulations! The hard part is done. You have finally created your first ever WordPress
website but this is not the end of it. You have the base created and now let’s build upon that
to take your website to the next level.
Install Themes
WordPress already comes with a default theme that looks rather plain. Sure, you can keep it,
but your website visitors may not be so impressed. A custom WordPress theme, whether it’s
paid​ or f​ ree​, will make your website more appealing as well as ensure that it looks
professional.
There are literally thousands of themes out there to choose from but in this guide, we’ll only
be focusing on the free themes and how to install them. Whether it’s an e-commerce site,
portfolio, blog, or niche business, there’s a theme that will work for your specific needs.
These themes contain a multitude of layouts, formatting styles, colors, fonts, and other
visual options that help you customize your website.
Note:​ In my v​ ideo course​, ​I provide a premium theme worth $60​ for free to my students that
has prebuilt demos you can choose from and makes the whole process of customizing your
website even easier.
To find a theme that works best for you, head to your admin dashboard. Click ​‘Appearance >
Themes’ ​and then ​‘Add New’​. This will open a page containing a list of all the free themes you
can browse from.
Page 8
Once you discover the perfect theme, simply ‘​ Install’​ it to begin customizing it. Each theme
has different steps required of you during the customization process, so be sure to follow
them closely. Each theme’s website (often mentioned in the theme details) has helpful
documentation as you work through the customization process.
If you still cannot find any information, click ​‘Appearance > Customize’​ in your admin
dashboard and that often contains all the customization options you have for that particular
theme.
If you've purchased a theme from a third party like ThemeForest, you can use Upload Theme
to add it to your site. Remember to upload the .zip file you get from the third party theme.
Add Website Content
With your theme now installed, you can customize your site’s physical appearance but what
about the content of your website? In this section, we’ll cover how to manage your website
pages, create new blog posts, and add menu items.
●
Pages
To create a new page, navigate to the ​‘Pages’​ tab in the WordPress dashboard, and
click on ‘​ Add New’​.
Type the title of the page i.e Home, About, etc, and below that is the area where you
will add the contents of that page. If you’re using the latest ‘​ TwentyTwenty’​ theme of
WordPress, the interface will look something like this
Page 9
This is the default WordPress editor called ‘​ Gutenberg’​ and if you click on the ​‘plus
icon’​ you will see a list of blocks you can add to the page. Although the list has all the
basic blocks one would need to make a decent page, you can expand the list even
further by installing plugins on your website which we’ll come to later. Some
examples would include A
​ dvanced Gutenberg​ and ​Gutenberg Blocks – Ultimate
Addons for Gutenberg​.
When your page is ready, click publish and a URL will be generated where it will then
be visible. One thing to note, however, is that to actually make your page accessible,
you will have to add it to your menu or navigation bar. We’re going to cover that later.
If you want to set one of the pages as the homepage of your website, go to ‘​ Settings
> Reading’​ in your WordPress dashboard and change the ‘​ Homepage Display’​ to a
static page
Important Tip
To make the process of page creation even easier, you can use plugins like
Elementor​, B
​ eaver Builder​, ​Divi Builder​, and ​WPBakery Page Builder​. These are visual
drag-and-drop page builders with an extensive block library of their own so you will
be able to see the changes you make in real-time.
Note: ​In my v​ ideo course​, ​I provide a premium theme worth $60​ for free to my
students that has prebuilt demos you can choose from. These demos contain some
amazing page templates that you can import as it is and then modify instead of
creating pages from scratch.
Page 10
●
Posts
To create a new blog post, navigate to the ​‘Posts’​ tab in the WordPress dashboard,
and click on ‘​ Add New’​.
You’ll then see an interface that’s nearly identical to the one you used to create your
first page. There’s no need to reproduce the steps here on how to create a new blog
post since the process is the same as what you’d do with pages.
You can use a block on your page to display all the blog posts on your website for the
users to read.
●
Menus/Navigation
If you don’t know, a menu or navigation bar is what we see at the top of the website
or even in the footer containing links to the different pages of the website. It’s a guide
for the users to find their way around your website. After all, you don’t want them to
get lost, right?
To create a menu or assign pages to an existing one, go to ​‘Appearance > Menus’​ in
your WordPress dashboard. From this page, either select a menu or create a new
one, and then from the widget on the left start adding the pages you want to that
menu. Once it’s finalized, you can save it.
If you go to ‘​ Manage Locations’​, you can assign a menu to the relevant theme
location e.g top menu, mobile menu, footer menu, etc. You can also use one menu
for multiple locations.
Page 11
Install Plugins
Consider plugins to be extensions/addons that allow you to add certain functionality to your
WordPress site. There are plugins for just about everything, such as setting up an online
shop, adding a contact form or social media, creating a photo gallery, and even tracking who
visits your blog.
To add a new plugin, navigate to the ​‘Plugins’​ tab in the WordPress dashboard, and click on
‘Add New’​.
Just like themes, there are ​thousands of plugins​ you can browse from. If you already know
the name of the plugin you want, you can search for that directly or if you have no idea then
you can search based on the functionality you want to add e.g newsletter, popups,
eCommerce, etc.
if you’ve purchased a plugin from a third party, you can use Upload Plugin to add it to your
site. Just like themes, here too you have to upload the .zip file in your third party plugin
folder.
Once you’ve found the plugin you want, simply click ​‘Install’​ and then ‘​ Activate’​.
For most plugins, once it has been activated, you’ll see a separate tab for it on the left
sidebar in your WordPress dashboard which will take you to the settings of the plugin.
However, if there is no separate tab, simply navigate over to ​‘Plugins > Installed Plugins’​. The
plugins listed in blue are active; the ones in white are not. Each of them will include a
Settings, Deactivate, and Edit button.
Page 12
Important Tip
If you decide you don’t want to use a certain plugin anymore, deactivate and remove it from
your site. You should only install plugins that you plan to use. Leaving unused plugins on
your site not only slows down your site but can also have security implications.
Note: I​ n my v​ ideo course​, ​I provide a premium theme worth $60​ for free to my students that
has prebuilt demos you can choose from. This theme also comes with some amazing
premium plugins like W
​ PBakery Page Builder​ which makes the whole page customization
process a piece of cake.
Section 3 - Deployment
We’re almost at the end of the line now. Let’s say your website is finally complete and you’re
ready to take it online to share it with the rest of the world. For that, you’ll need to buy a
hosting and a domain.
Do note​, you don’t need hosting to create a website but you need one to take it online. There
is no other way around it.
There are hundreds of hosting providers out there to buy your hosting from and frankly,
whichever one you find affordable, just go with that. I’m not going to give any referral links
here to promote a particular hosting.
Here’s what you have to look for when buying a hosting. Make sure you’re buying a
Linux-based Shared Hosting​ plan. Some providers like ​Bluehost​, ​GoDaddy​, etc also provide
hosting plans specifically made for WordPress websites and if you have that option, that’s
even better.
Configuration
When it comes to the domain name, my suggestion is to always buy it from the same
provider as the hosting because that will reduce the number of steps you’ll need to set up
everything before going live. Most hosting providers also give ‘​ Free Domain Name For 1 Year’
which makes it even more affordable.
In case, you have a domain from one provider and hosting from another one, you’ll have to
connect them together. Here’s how
●
When you buy hosting you’ll get the details of your server on your email. In those
details, you’ll find information about the nameservers as well as the credentials to
your CPanel account. ​Note down the nameservers because we’ll be needing that.
They will consist of two values like​ ns1.example.com​ and ​ns2.example.com​.
In case you don’t see the nameservers information in the email, log in to your CPanel
account and Click the ​‘Server Information’​ link in the General Information section.
Page 13
You will then see your Server Name listed along with additional information about
your server.
In this example, your nameserver values will be ​ns1.ecbiz182.com​ and
ns2.ecbiz182.com​.
●
Log in to your provider account where you have purchased your domain from. Once
you go to your domain settings, you’ll see an option to change your domain’s
nameservers. In that replace the existing values with your own hosting’s nameserver
values. Once you save these changes, it will say that the propagation will take 24-48
hours but don’t worry it usually doesn’t take that long and will be done in an hour or
two.
●
Come back to your CPanel account and search for the ​‘Addon Domains’ o
​ ption. In
that, add your domain name e
​ xample.com ​and you’re done. Once the propagation is
Page 14
finished, upon visiting the URL, you’ll either see a dummy landing page by your
hosting or a list of files in your website folder on the hosting. If you do, that means
your domain is finally pointing to your hosting and you’re good to go. J
​ ust keep
checking every now and then because sometimes the propagation can take even
longer.
Before we continue, change your PHP settings on your hosting just like we did on our local
machine. In your CPanel account look for ​‘PHP Settings’​. The exact wording might vary from
hosting to hosting but if you just search PHP in your Cpanel settings you'll find it. If not then
just google how to change PHP settings in your hosting and you'll find a link that will guide
you to the correct page.
Once you're in your PHP settings change the following values to these:
●
●
●
●
●
●
max_execution_time: 6000
max_input_time: 6000
max_input_vars: 20000 or whatever the maximum value your hosting allows you to
set it at if it is as a dropdown option. If it's a free text field then just write 20000
memory_limit: 2048M
post_max_size: 1024M or 1G
upload_max_filesize: 1024M or 1G
Remember​ the post_max_size value should be the same as the upload_max_size.
Transfer Website
Transferring a website from your local machine to the hosting might seem like a
complicated task but I’m going to make it the easiest thing for you in this entire process.
We’re going to use a plugin called ​All-in-One WP Migration​ and as the name suggests this is
a one-stop solution to the entire thing.
●
Install and activate the All-in-One Wp Migration plugin on your local website. Once
you activate it, go to ​‘All-in-One Wp Migration > Export’​ and export your website into a
file
Page 15
After the export is complete, you’ll get the file with the extension ‘.wpress’
●
Install a fresh copy of WordPress on your hosting using the CPanel account. CPanel
has a WordPress installer which will easily guide you through the installation. If you
still want, you can follow this g
​ uide​. Install the All-in-One WP Migration plugin on this
website as well.
●
Now all you have to do is go to ‘All-in-One WP Migration > Import’ and upload the
‘.wpress’ file you exported from your local website. It will take a couple of minutes
before the import is completed and once it’s done, visit the URL of your website and
voilà! The transfer is complete. Easy, isn’t it?
Page 16
What if the import gets stuck?
Yes, sometimes during the import it tends to get stuck and no matter how long you wait, the
progress doesn’t go further than a certain percentage. What do you do then? Don’t worry, I
got you covered.
In that case, here’s what you should do
●
Cancel the import. Then deactivate and remove the All-in-One WP Migration plugin
from your live website.
●
Go to your CPanel account and in the File Manager go to the root directory of your
WordPress website. From there go to ‘​ wp-content/ai1wm-backups’​ folder and upload
the ‘.wpress’ file into that folder.
●
Then go to your live website and install the f​ ollowing version​ of the All-in-One WP
Migration Plugin. How you will do that? Go to ​‘Plugins > Add New > Upload Plugin’​ and
upload the zip file.
●
Finally, go to ‘​ All-in-One WP Migration > Backups’​ where you will see the ‘.wpress’ file
you just uploaded. ‘Restore’ that file and that will start the import process. This will
skip the upload process of the file which is where the import tends to get stuck so
now you won’t have any problems going forward.
Congratulations!
Now you know how to make a WordPress website from scratch on your local machine and
once it’s complete, how to deploy it to hosting so that it’s live and accessible for everyone
else to see. Nice work!
In the above Ultimate Guide to Make a Website on WordPress, I have broken down my
experience of making websites for almost 3 years into small nuggets so you can learn it
quickly and easily.
I don’t believe that one needs to know each and everything about WordPress to make an
amazing website. You just need to learn the skill of it. Now, I have played my part and
covered all the basics you need to know but now it’s your turn to experiment with the
information you have and take your skill to the next level.
I know initially, you might not make some great websites you can be proud of. You’ll
probably make stupid mistakes, learn from them but eventually, there will come a time when
you would have made so many mistakes that you’ll become a master of this skill. All you
have to do is to not feel bad about making them in the first place.
Page 17
Full Video Course
This guide is from my full course, T
​ he Smart Guide to Make a Website on WordPress from
Scratch​, in which I provide a p
​ remium theme worth $60 for free​, 1 hour of videos taking you
through the entire step by step process, and techniques to help you create a website in a
smart way ​without reinventing the wheel​.
10K+ students have already gained value from this course. Don’t believe me? See for
yourself
Join The Course Here
Download