Installing WordPress on XAMPP

This tutorial is a follow-on to Setting up a Local Development Environment (XAMPP Edition), and in following with the spirit of that tutorial we will first create a new virtual host, then create a Database (DB) User and associated DB, and finally install and set-up WordPress. If you have not installed XAMPP on then we recommend you follow the referenced tutorial before continuing on with the steps below.

Follow along with my video tutorial and get a few bonus tips along the way!

Step 1: Create Virtual Host(s)

Before we create our virtual host definition in the Apache Configuration file, we are going to create our directory structure and copy the core WordPress files.

First, locate our sites folder and create a new sub-folder for the new site: in our example we will create ‘widget-developer’ within the ‘c:/sites/’ directory and then inside of this folder create the following sub-folders: ‘public_html’, ‘logs’, and ‘ssl’. [you can also create a ‘tmp’ or ‘temp’ sub-folder as well for future use for the virtual host to use for temp storage instead of the Windows Temp folder].

Directory Structure for our Virtual Host
Virtual Host Directory Structure

Second, download WordPress and extract the contents of the zip file into the ‘public_html’ folder. By default, the ZIP folder contains a top-level folder named ‘wordpress’, so if this folder is created within public_html you will need to ‘move’ all the files and folders up one level.

Public HTML folder with WordPress Files
Extracted WordPress Download in ‘public_html’

Third, now lets open our ‘httpd-vhost.conf’ file (c:\xampp\apache\conf\extra\httpd-vhosts.conf) and define our new virtual host. [if using self-siged SSL, edit the ‘httpd-ssl.conf’ and create a virtual host definition there as well].

# Allow Apache to read from our SITES folders
<Directory "c:/sites/*/public_html">
  AllowOverride all
  Options FollowSymLinks Includes
  Require all granted
<Directory>
<VirtualHost *:80>
  ServerAdmin {enter your email address here}
  DocumentRoot "c:/sites/widget-developer/public_html/"
  ServerName widget-developer.local
  ServerAlias www.widget-developer.local
  ErrorLog "c:/sites/widget-developer/logs/error.log"
  CustomLog "c:/sites/widget-developer/logs/access.log"
</VirtualHost>

Finally, let’s syntax check our Apache configuration and restart the Apache service.

Open a command prompt and enter the following commands, and as long as the response says ‘Syntax OK’ your are clear to restart the Apache Service.

cd \xampp\apache\bin
httpd -t

One additional requirement is to make a ‘HOSTS’ file entry for our virtual host so that our browser knows where to send requests for the URL. Open notepad as administrator, then select ‘File -> Open’ and navigate to ‘C:\windows\system32\drivers\etc’, choose ‘All” under file types and then select the ‘hosts’ file and click ‘open’

127.0.0.1    widget-developer.local www.widget-developer.local

Step 2: Create Database User and Database

The first step here is to access the phpMyAdmin web interface and select the ‘User Accounts’ from the admin bar and then click the ‘Add User Account’ at the bottom of the screen.

phpMyAdmin Admin Bar
phpMyAdmin New User Account

On the ‘Add user account’ screen, within the ‘Login Information’ field set enter a username and password (or choose ‘generate password’ and make sure you record these for later use. Within the ‘Database for user account’ field set, check the ‘Grant all privileges on wildcard name’ box. Then scroll to the bottom and click the ‘Go’ button.

Create New Database User

Lastly, lets create a new database. We do this by choosing ‘Databases’ on the admin bar, and then enter a database name in the appropriate field using the format {username}_wp (i.e. widgetdev_wp) and click the ‘Create’ button. [I use the ‘_wp’ do identify the database as a WordPress database, but you can use anything you want instead].

Create New Database

Note: all of these steps could have been done using the mysql command line interface

mysql -u root -p
CREATE USER 'widgetdev'@'localhost' IDENTIFIED BY 'widgetdevpassword'
CREATE DATABASE IF NOT EXISTS widgetdev_wp
GRANT ALL ON widgetdev_%.* TO 'widgetdev'@'localhost'
FLUSH PRIVILEGES

Note 2: You could choose to skip this step and simply use the default ‘root’ user for step three, however this is not recommended.

Step 3: Install WordPress

Since we have already copied the core WP files, all we really need to do is access you server using the domain we used during step 1 and we should be auto-redirected to the ‘Installation’ screen.

WordPress Installer: Select Language

First, choose your language then click ‘Continue’. On the next screen enter the site and database detailes we have accumulated (Database Name, Database UserName, and Database User Password) and then click the ‘Install’ button.

WordPress Installer: Required Details

You will be notified that the site is created with additional instructions to login using a ‘username’ and ‘password’ you created earlier with a button titled ‘Login’

WordPress Installer: Success

After logging into the WordPress Admin Panel, you can begin configuring your site (which we will cover in a follow-on tutorial).

Summary

In this tutorial, we walked through how to create a Virtual Host on our local XAMPP installation, create a Database and Database User Account and Finally installed WordPress onto our newly created Virtual Host. Primarily the use of virtual hosts is to segregate each domain and provide an added layer of security (typically by using suexec and mod-cgi to ensure that each process is run by the appropriate user).


If you found this article helpful, we hope you will share it and provide feedback using the comments form below…

Leave a Reply

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