Using XAMPP for Local WordPress Theme

Development
April 26th, 2009 by Jacob Gube |227 Comments |Stumble It!Delicious

In this tutorial, you’ll learn how to install and configure XAMPP for the desktop.
Once that’s out of the way, we’ll install WordPress so that you can have your very
own professional, light-weight PHP and WordPress development environment.

Introduction
To sum it up in one sentence: XAMPP, which stands for Cross-Platform (X)
Apache, MySQL, PHP and Perl, is a popular, free and open source web server
package that you can use to install a web server onto your desktop.

XAMPP allows you to develop PHP and Perl-based server-side scripting

applications without the need for a remote web server, offering you the
opportunity to work faster, develop stuff more securely, and work on your
apps without an internet connection.

In this tutorial – you’ll see exactly how XAMPP can do splendid things to
your development cycles.
We’re going to use a simple xampple (sorry, I had to get that out of the way,
been thinking about saying that for a long time): we’re going to install XAMPP and
WordPress with some test data to have WordPress right on our desktop.

This tutorial is for Windows Vista, so you’ll have to tweak the steps involved
depending on your operating system. Here’s what you’ll be doing in this tutorial:

Objectives
• Downloading and Installing XAMPP
• Starting up your Apache and MySQL services
• Installing and configuring WordPress locally
• Creating a MySQL database for WordPress
• Creating a MySQL database user for WordPress in phpMyAdmin
• Importing some test data for WordPress using an XML file
This tutorial covers installing XAMPP in Windows Vista, so you’ll have to tweak the
steps a little bit if you’re using a different operating system.

Obtaining XAMPP and choosing a version

1 Obtain a copy of XAMPP for Linux, Windows, or Mac OS X at the apache friends
XAMPP web page.

http://www.apachefriends.org/en/xampp.html

2 Choose the package you want: for normal web development, just go with
the Basic Package.

The Basic Package comes with a host of useful applications, libraries, and
extensions such as phpMyAdmin (which we’ll use to set up WordPress later on)
and eAccelerator(a popular PHP caching application to optimize and improve PHP
script performance). For this tutorial, choose the Installer version.

Download it (Save File) onto your computer.

3 Open up the executable (for Windows users, it’s called xampp-win32-1.7.1-
installer.exe).

The following figure shows the first dialog box; it asks you to select which
language you want to use.

The next dialog you’ll see is the first page of the XAMPP Setup Wizard.
4 Pick a destination for the installation.

Note: XAMPP suggests not to install it in the Program Files folder

(i.e. C:\Program Files\xampp), so just install it in the root of your drive
(C:\xampp)

5 Configure your options in the XAMPP Options dialog box. For this tutorial, just
go with the default installation options.
That’s it for the installation, quick and painless wasn’t it? Let’s fire up Apache and
MySQL.

Starting up your Apache and MySQL services

6 After the installation, you should’ve been presented with an option that asks
you to open the XAMPP Control Panel. If you didn’t get that option, do one of
the following:

Option 1: Navigate to it using the Windows interface

Start > All Programs > Apache Friends > XAMPP > XAMPP Control Panel

Option 2: Open the XAMPP Control Panel directly

If you didn’t select the "Create Shortcut" option in the installation, then navigate
to the XAMPP installation folder and open the file called xampp-control.exe.
7 The XAMPP Control Panel should look like the following figure:

8 Click the Start button beside Apache. If you’re on Windows, you’ll get a
Windows Firewall warning: choose Unblock.
9 If all goes well, you should see the XAMPP Control Panel log updated with
"Apache Started", and "Running" with a green background right beside the
Apache service.

10 Start the MySQL service using the same method as step 8.

Testing to see if it works
11 With your Apache and MySQL services started, open up a web browser and
navigate to localhost using the following path:

http://localhost

12 You should see the following screen:

Congratulations, you now have your very own locally hosted (localhost) web
server!

Depending on your operating system, you’re now the proud owner of

a WAMP(Windows users), MAMP (Mac OS X users) or LAMP (badass Linux users)
server right there inside your computer.
Now let’s move onto installing WordPress on your machine. First, we’re going to
set up your WordPress MySQL database and create a MySQL database user for it.
That’s the topic for the next section.

Setting up your MySQL database for WordPress

The easiest way to create a MySQL database using XAMPP would be to use
phpMyAdmin, which comes with the Basic Package that we installed.

13 Navigate to phpMyAdmin through your web browser. The URL is:

http://localhost/phpmyadmin/

14 Create your WordPress database by entering in a name and pressing

the Createbutton.

In this tutorial, we’ll call it wordpress_db. You’ll need to remember this value for
a later step when we configure WordPress.

This is what the following screen will look like:

Creating a WordPress database user
In real-world scenarios, you should never use the default root user because it
has all privileges and you don’t want a simple WordPress bug or vulnerability
taking down your entire MySQL service.

This isn’t necessary if you’re only testing locally, but we’re going to do this right
to promote best practices.

15 Go to phpMyAdmin home by either clicking on the logo on the top left or

clicking on the home icon.

16 Click on the Privileges tab.

17 Click on "Add a New User"

18 For the User name field, type in any name, this tutorial
uses wordpress_user for simplicity. For Host, select Local.

For Password, type in a value, but it’s highly recommended that you use
theGenerate Password button to randomly generate a password for better
security.

Once you hit the Generate Password button, click on Copy button right beside it
to copy it automatically in the Password and Re-type fields.

Important: take a note of the User name and Password you used, we’ll be using
it later on.

Here are the settings used:

19 Set the Global Privileges of wordpress_user. Typically, you should try to

limit the privileges of your database users to a minimum to improve security.

For this example, since it’s a local installation – just check all of them. When you
go into production, pare down the privileges!

Hit the Go button to create the database user.

20 If everything went well, you’ll see a confirmation that you’ve created the user
successfully.

Adding your newly created user to your database

21 In the next screen, in the Database-specific privileges fieldset, in the Add
privileges on the following database field, select wordpress\_db.

This will add wordpress_user as a database user of your wordpress table,

wordpress_db.
22 Check that wordpress_user has been added to the database by entering your
database.

To enter your database, click on wordpress_db in the left-hand navigation.

23 Click the Privilege tab to see all users that have access to your WordPress
database. You should see wordpress_user listed in the Privilege section.
Alright, you’ve just learned how to create a MySQL database user using
phpMyAdmin. Give yourself a pat in the back before moving on!

Installing WordPress on your computer

If you’re not familiar with the process of installing WordPress, you should take a
look at the following guide on the official WordPress.org site first:

• Installing WordPress
This guide will get you up and running with the general process that we’ll be
taking. Please take a moment and read it – I promise, it’ll be quick and painless.

24 Download the latest version of WordPress, save it on your computer.

25 Open your xampp folder. Navigate to the htdocs folder.

If you used the default installation destination, the file path is:

C:\xampp\htdocs

26 Open up the WordPress ZIP file you downloaded. Extract the entire contents in
the htdocs folder.

Configuring WordPress: entering your MySQL database

information
27 Inside the wordpress folder, open wp-config-sample.php file using your
favorite text editor.

Fill in the information with your database information. If you followed along and
used the same values as this tutorial, you can use these values:

/** The name of the database for WordPress */

define('DB_NAME', 'wordpress_db');
/** MySQL database username */
define('DB_USER', 'wordpress_user');
/** MySQL database password */
define('DB_PASSWORD', 'typeyourpasswordhere');
/** MySQL hostname */
define('DB_HOST', 'localhost');

28 Once you’re done with the configuration file, save it as wp-config.php in the
same folder.

Note: You have to save it as wp-config.php and not wp-config-sample.php.

Running the WordPress install script

29 To finish the installation of WordPress, navigate to the install script. Here’s the
file path:

http://localhost/wordpress/wp-admin/install.php

30 If you did everything correctly, you should be greeted by the following screen:

31 Just hit the Install WordPress button, and follow the steps. If this is your
first WordPress installation, read the steps of the installation dialog carefully as
we won’t be covering it here in detail.

Testing to see if your WordPress installation works

32 Navigate to the home page of your WordPress installation. The file path is:
http://localhost/wordpress/

If everything went well, you should see the default WordPress home page:

Important: take a note of the auto-generated password or else you won’t be

able to log into WordPress.

WordPress local installation completed!

Woot, you just installed WordPress on your computer! No more FTP’ing or live
web development! You can now test your themes or test site updates before
going live.

At this stage, you can log into the WordPress administration section:

http://localhost/wordpress/wp-admin

Alternatively, you can continue in the tutorial (because we’re not done yet).

Next, we’re going to import some test data which you should do when you’re
developing WordPress themes to be released to the public.

Importing WordPress test data

33 Download the WordPress XML file from the official WordPress.org site. You can
get it through the Theme Development Checklist (which is a great guide by the
way), under the Theme Unit Test section.
Here's the direct download link:

http://svn.automattic.com/wpcom-themes/test-data.2008-12-22.xml

34 Log into the WordPress administration section:

http://localhost/wordpress/wp-admin

35 In the WordPress admin section, go to Tools > Import (using the sidebar
navigation on version 2.7).
36 In the Import page, click on WordPress.

37 Browse to the XML file we downloaded (test-data.xxxx-xx-xx.xml).

Hit the Upload file and Import button.

38 Assign the authors of the post. The XML file created a testing author
named Noel Jackson for you.
If you don't want to assign the test posts to Noel Jackson, use the or map to
existing field and select the author you want. For this tutorial, assign it
to admin.

Click the Submit button.

39 You'll be presented with a log of all the changes made by the import process.
Examine it if you want to see exactly what happened.

40 Check to see if the import went according to plan. Easiest way is to go to the
home page of your WordPress installation (http://localhost/wordpress).

41 In the home page, you'll see that there's now content for your WordPress
installation. This way you can easily check and test your theme for public release.
You're done, you professional PHP/WordPress developer!
Now you can develop WordPress themes and test changes locally on your
computer, just like the pro's, not only speeding up your development cycles, but
also being able to securely test updates to your existing themes.

Where to go from here

Here are things you should try and do to explore XAMPP:

Try to install a free WordPress theme

Go to the WordPress Themes section for themes you'd like to try out.
Alternatively, check out our lists of free WordPress themes: Excellent Free
WordPress Themes andBeautiful Free WordPress Themes.

Create a new site

Create a folder under the xampp > htdocs and put some test PHP scripts in it. As
you can see, you don't need a web server anymore, you have a fully-featured
MySQL and PHP server right there in your computer. Go develop some cool web
applications!

Explore additional XAMPP add-ons

There are a good number of XAMPP add-ons for you to extend your local web
server. Check them out and install the ones you need. Go to either
the Windows, Linux, orMac OS X download pages to see a list of add-ons you can
install.

Summary
In this tutorial, you just learned how easy it is to install XAMPP to the desktop so
that you can have your very own PHP web development testing server. More
specifically, this is what we did together:

• Installed XAMPP
• Started the Apache and MySQL Services
• Created a MySQL database
• Created a MySQL database user
• Installed and configured WordPress
• Imported some test data
Further resources
• Install Wordpress On Your Mac Using MAMP on Free Mac Blog.
• Installing XAMPP on Linux called Install XAMPP for easy, integrated
development.
• Learn more about XAMPP in the apache friends xampp home page.
• Discover phpMyAdmin and how to use it in the phpMyAdmin official site.
Report a bug or provide some feedback, why don't you?
Feel free to provide feedback and ask questions (lots of them!) in the
comments. Mistakes happen - so please let us know if we made a mistake or
you see an error.

Related content
• 30 Excellent WordPress Video Tutorials
• Cheat Sheets for Front-end Web Developers
• 6 Tips to Help You Get the Most Out of Google Docs
• 30 Useful Open Source Apps for Web Designers
• 10 Promising Content Management Systems
• Related categories: Tutorials, Web Development, WordPress