How to Use XAMPP

How to Use XAMPP to Set Up a Local WordPress Site (In 3 Steps)

Last Updated on: June 18th, 2018

Will Morris

Setting up a locally-hosted environment is a crucial step in any WordPress development project. Doing this enables you to safely test your site’s features and functionality, on a site that’s completely private.

In this article, we’ll explore how to use XAMPP to set up a local web server for developing and testing your WordPress site. This involves three steps:

1. Install XAMPP.
2. Run XAMPP and configure your environment.
3. Download and run WordPress.

We’ll also discuss some best practices for experimenting with code and testing WordPress using XAMPP. Finally, we’ll cover how to use XAMPP with a WordPress multisite installation. Let’s dive in!

Why You Might Need a Local WordPress Site

A locally-hosted WordPress site is one that is only accessible by people on your network (that is, there are no live components). As such, this type of site can serve as a safe environment, in which new features and troubleshooting methods can be tested.

Local websites are perfect for performing the following types of tasks:

• Creating new themes and plugins: When using a local site, you don’t need to worry about any of the issues you might encounter when developing on a live WordPress site.
• Website staging: You can create a copy of a live website, which can then be used for testing purposes.
• Site debugging and troubleshooting: Working under the hood of your live site in order to resolve bugs or other issues may lead to bigger problems (and, potentially, costly downtime). By creating a local WordPress site, you can try out various solutions, and easily restore previous versions of your site should you make any mistakes.     

For these reasons, creating a locally-hosted WordPress site is highly recommended for just about any development project. First, however, you’ll need a tool that will make the process of setting up a locally-hosted site quick and easy.

An Introduction to XAMPP

A few crucial ingredients are needed if you want to install WordPress locally. These consist of web server software (such as Apache), programming languages like Perl and PHP, and the database management software – MySQL. Installing each of these elements separately, however, is time-consuming and difficult.

XAMPP (an acronym for cross (x)-platform, Apache, MySQL, PHP, and Perl) enables you to install all these elements quickly and easily. You can then use XAMPP to set up the environment required to run WordPress on a local machine. There, you can test plugins, experiment with themes and coding, and carry out other development activities safely.

XAMPP is free and open-source software, backed-up by a sizable support community. It’s also extremely lightweight, and all the elements required to set up a local web server are contained within a single extractable file. What’s more, learning how to use XAMPP is relatively straightforward, as we’ll discuss in the following XAMPP tutorial.

How to Use XAMPP to Set Up a Local WordPress Site (In 3 Steps)

In the following steps, we’ll walk you through how to use XAMPP and install WordPress on it. For this tutorial, we will be covering the steps for the Mac version of the software. However, XAMPP can also be set up and run relatively easily on both Windows and Linux devices, using a similar process.

Step 1: Install XAMPP

First of all, you’ll need to go to the Apache Friends website, and select the relevant download link on the homepage:

Next, drag XAMPP into your Applications folder:

Once the initial loading sequence is completed, XAMPP will be installed on your system. This part of the setup process doesn’t require much on your end.

It should be mentioned that if you are running XAMPP on Windows, and another program on your machine is using ports 80 or 443, you may encounter a port error. For example, the World Wide Web Publishing Service program commonly uses port 80 and may cause a conflict with XAMPP.

To resolve this, you’ll need to stop that service from running by doing the following things:

1. Navigate to the Windows Start menu, and type in services.msc.
2. In the Services window, locate World Wide Web Publishing Service.
3. Right click on it, and select the Stop button.
4. Restart XAMPP. The port error will be resolved if World Wide Web Publishing Service was the culprit.

If this doesn’t resolve the issue, it may be caused by your Windows firewall. To forcibly unlock your ports, you will need to set up a new firewall rule:

1. Open up Windows Firewall and navigate to Advanced Settings.
2. Go to Inbound > New Rule.
3. Go to Port > TCP. You’ll have to type 80,443 in the field labelled Specific Ports, then click on Next.
4. Select Allow the Connection, then click on Next again.
5. Make sure all listed options are checked and continue to the next page.
6. In the Name field, type in a memorable name (such as host1) and select Finish.
7. You’ll now need to repeat steps 1 to 6, changing the name again (i.e. to host2) to clear the port.
8. Restart your computer. Ports 80 and 443 should now be unblocked and open locally.

Once XAMPP is installed, you’ll be all set to start running XAMPP.

Step 2: Run XAMPP and Configure Your Environment

Now, open up the XAMPP application and hit the Start button. You should see a green light in the upper right-hand corner of the display:

Next, navigate to the Services tab. You will need to ensure that the status of both the Apache and MySQL stack services are running (i.e. that they have a green light). This will ensure that your database management and server software elements are in place for your local environment. For now, you can ignore ProFTPD (which is a configurable File Transfer Protocol server).

If MySQL or Apache are not running (if they display a red light), simply select them and hitStart:

Then, switch over to the Network tab. Here, you can define the port forwarding rules between your host machine and your stack. Select the localhost option you wish to work on, and then hit the Enable button. In this example, we will be using localhost:8080:

You will now be able to access your localhost, and start using XAMPP as a server environment. To do this, open up your preferred web browser, and type in your localhost name (which in our case would be localhost:8080). This will bring up the XAMPP dashboard. Once there, select the phpMyAdmin button in the top right-hand corner of the page:

You’ll then need to create a database for your WordPress installation. To do this, select theDatabase tab, type in a name for your database (in our case, we’ll simply go with WordPress), ensure the next drop-down menu is set to Collation, and then hit Create:

After that, you’ll be ready to learn how to install WordPress on XAMPP.

Step 3: Download and Run WordPress

At this point, you’ll need to go to WordPress.org and download the latest version of WordPress:

Open up the WordPress folder on your machine, and locate the wp-sample-config.php file:

Open this file in your preferred text editor (such as TextEdit). You’ll need to locate this line of text:

• define('DB_NAME', 'database_name_here');

Replace database_name_here with whatever you named your database in the last step. Then, look for these two lines:

• define('DB_USER', 'username_here');
• define('DB_PASSWORD', 'password_here');

You’ll need to replace username_here with root, and delete password_here entirely. The resulting text should look like this:

Once you’ve done that, save the file as wp-config.php. You’ll need to ensure that it is placed in the htdocs subfolder within the XAMPP folder. You’ll also need to paste your WordPress install folder into htdocs as well.

Finally, navigate to http://localhost/wp/ in your browser. Once there, follow the standard WordPress installation procedure. When that’s all done, you’ll have a locally-hosted WordPress site ready to go!

How to Set Up WordPress Multisite on XAMPP

Now that you know how to use XAMPP for a single WordPress installation, you may want to use it to create a multisite network. This enables you to create a network of websites that are all managed from a single WordPress installation. There are a lot of applications for a multisite installation. For instance, it presents a useful way to test how your newly-developed themes and/or plugins will function on a variety of sites.

To get started, you’ll need to open up your wp-config.php file in a text editor again. You’ll then need to add the following lines of code at the bottom, right above the line * That’s all, stop editing! Happy blogging. *:

• define('WP_DEBUG', false);
• define('WP_ALLOW_MULTISITE', true);

After you’ve ensured that Apache and MySQL are still running on XAMPP, log in to your localhost site. Then, navigate to Tools > Network Setup:

Once you’ve entered a network title, select Install. You will be prompted to edit your wp-config.php and .htaccess files.

Open up your wp-config.php file once more. You’ll need to add the following code beneath the lines you added previously:

• define('MULTISITE', true);
• define('SUBDOMAIN_INSTALL', false);
• define('DOMAIN_CURRENT_SITE', 'localhost');
• define('PATH_CURRENT_SITE', '/');
• define('SITE_ID_CURRENT_SITE', 1);
• define('BLOG_ID_CURRENT_SITE', 1);

Next, you’ll need to open up (or create) your .htaccess file in the same directory as your wp-config.php file. Then, replace all the existing lines in that file with the following snippet:

• # BEGIN WordPress
• RewriteEngine On
• RewriteBase /
• RewriteRule ^index\.php$ - [L]
•  
• # add a trailing slash to /wp-admin
• RewriteRule ^([_0-9a-zA-Z-]+/)?wp-admin$ $1wp-admin/ [R=301,L]
•  
• RewriteCond %{REQUEST_FILENAME} -f [OR]
• RewriteCond %{REQUEST_FILENAME} -d
• RewriteRule ^ - [L]
• RewriteRule ^([_0-9a-zA-Z-]+/)?(wp-(content|admin|includes).*) $2 [L]
• RewriteRule ^([_0-9a-zA-Z-]+/)?(.*\.php)$ $2 [L]
• RewriteRule . index.php [L]
•  
• # END WordPress

Save the file and close it. Now, you should be able to access individual sites in your dashboard when you log in to your local WordPress installation.

What to Do With Your Local WordPress Installation

Once you know how to use XAMPP and have a local WordPress site to experiment on, what you do next will largely depend on the kind of development project you’re embarking on. To get you started, WordPress.org offers a great beginner’s guide on how to test drive WordPress.

If you’re interested in theme development, you may want to see our guide on how to develop a WordPress theme, or check out such sites as Theme Shaper. Using your local environment, you can safely edit your files to experiment with new themes and their associated functionality.

If you want to learn how to use XAMPP and WordPress together to test your coding knowledge and gain more PHP experience, there are a number of helpful guides for that as well. BitDegree and Code Academy both offer an excellent variety of tutorials that cover PHP and HTML fundamentals, plus much more.

While using your local WordPress installation for development, you’ll also want to have resources at hand for troubleshooting and honing your skills. Stack Exchange is a thriving online forum where you can pose questions to the WordPress development community, as well as gain invaluable insights. Finally, you’ll probably want to become a regular on theWordPress.org support forum.

Conclusion

As we have seen, XAMPP is a powerful and versatile solution for setting up a local web server. It presents a perfect way to create an environment for basic WordPress coding, experimenting with multisite settings, tweaking themes, and much more. Though it is not the only tool that you can use. A great alternative is setting up WordPress using Docker.

Do you have any questions about how to use XAMPP or your new local WordPress site? Let us know in the comments section below!