Most beginners into web design use Content Management Systems like WordPress. This is because of its ease of use, a huge repository of ready-made themes and plugins (most of which can be obtained free), and the fact that it is the most popular Content Management System on the entire web.
Most freshers start by installing the software on their live server and develop the website live online. I want to state here that there are many reasons why you should have a development environment set up on your local drive instead. Yes, you heard me well. It is good to have a development environment on your local drive where you design your website before moving it online.
One major advantage of going this route is that it saves you cost of internet subscription. This is because when you develop on your local drive, you don’t need access to internet connection. So in this article I’m going to walk you through a step by step guide on how to set up a local development environment on your hard drive using XAMMP.
XAMPP is an abbreviation which stands for Apache, MySQL, PHP and Perl. This software allows you to build WordPress (and other Content Management Systems) website offline, on a local web server on your computer. This simple and lightweight cross platform solution works on Windows, Linux, and Mac.There are other local server software where you can run a WordPress installation apart from XAMPP. Some popular examples are MAMP, LocalWP (by Flywheel), InstantWP, and WAMP. My focus here, however, is XAMPP. In my subsequent posts I will write about the other software. So let’s get into installing WordPress locally with XAMPP, right away.
Step 1: Download and Install XAMPP
XAMPP is one of the most popular PHP development environment and it is free and easy to use. When you install it you are actually setting up Apache server distribution (containing MariaDB, PHP, and Perl) on your local drive. A simple google search of the word XAMPP will reveal the website where you can download and install it. You can equally head over to their official website (https://www.apachefriends.org/index.html) where you can download it. Once you are there you should see a page that looks like the screenshot below.
As you can see on the screenshot above, XAMPP is available for different Operating System. In my case I run a Windows Operating system, so I will click the first option. If you are on Linux, you should click the second option while those running Mac should go for the last option.
Once you successfully download it, navigate to the folder where you save your download files, look for the XAMPP installation set up and double click it to start running the installation. Follow the onscreen installation wizard by clicking the next button until the installation begins.
Once the installation begins you should see an interface like the screenshot below.
As you can see on the screenshot, the installation will pop open the Bitnami website. Ignore the website for the time being but do not close the page. You will come back to this page after the installation of XAMPP. It is from this page you are going install WordPress or any other Bitnami module (such as Joomla!, Drupal, OrangHRM, etc.)
Once your installation is complete, the XAMPP control panel should pop open by itself. If it doesn’t, you’d need to locate it from the list of installed programs on your device and click to open it. Once it’s opened, you should see an interface like the screenshot below.
To run the server click on the first three “Start” buttons i.e. for Apache, MySQL and FileZilla.
Step 2: Downloading and Installing WordPress
Once XAMPP is running, go back to the Bitnami page that was opened earlier. There you should see an interface like the screenshot below.
As you can see on the screenshot there are several modules we can install on our local drive using XAMPP. At the time of writing this, there are 15 modules, some can be seen on the screenshot above. Our focus here is WordPress, so we will click on the “Download” link below the WordPress symbol. Note, if you are running a Windows OS, click on Windows, if Linux, click on Linux to download the appropriate one for your operating system.
I’m running a Windows OS, so I will click on Windows. The download should start automatically and a new page opened. If your download does not start automatically you should see a link on the page that pop opened, there you can download it manually, as shown on the screenshot below.
If your download does not run automatically, the link to click is as shown on the screenshot above. Once the download is complete you should see the downloaded file on your task bar (if you are using chrome browser), if not locate it where your download files are saved and begin the installation. Before you begin the installation, ensure XAMPP is running. Once you double click the file a dialogue box will pop up as shown below.
Click on “Run” to continue with the installation. That should take you to the next step where you can select the language. In my case, it’s English (which is selected by default). Click “Next” to continue with the installation. The next step will ask you to select a folder where you want to run the installation. I normally leave the default folder (which is C:\ xampp). Click the “Next” button to proceed. That should take you to the step where you can set your WordPress login details as shown in the screenshot below.
Under the “Login” option, enter a username. It should be in small letters. Next to it, enter your real name (you may enter a nickname, it doesn’t matter). Next enter an email address (this email will serve as the administrative email for the WordPress website you are designing).
If you look at the image above closely, you’d notice that the system is demanding for MySQL password. That’s because I didn’t start the XAMPP server before I start this installation. So, always make sure you start the XAMPP server before you begin your installation. So in my case, I’m going to cancel this installation, start the XAMPP server before starting my installation all over again.
If you already have XAMPP running before you start your installation, the next step is to set your administrative password for the WordPress installation. Enter a password you can remember and proceed to the next step. That should again open a new web page. Ignore the web page and continue with your installation.
Once the installation is successful, click on the “Finish” button that pop up on the installation wizard. That should take you to the frontend of your installed WordPress as shown in the screenshot below.
Looking at the screenshot above, we see that the URL of the website is http://127.0.0.1/wordpress/. To access your admin dashboard you just have to put wp-admin in front of the last slash (/), meaning our admin URL is http://127.0.0.1/wordpress/wp-admin. This should take you to WordPress login page which looks something like the screenshot below.
Enter the username and password you set during installation. That should take you to your admin dashboard which looks something like the screenshot below.
If you land on a page like the screenshot above, then congratulations, you have successfully installed WordPress on your local drive using XAMPP. And this brings us to the end of this tutorial.