Develop WordPress Themes Offline with XAMPP

I have been developing on the internet for some time now and I have owned multiple sites online. These sites all had their own custom design developed by me. I was constantly copying/pasting files to the site being developed and the time it took bothered me.

It bothered me that bad that I decided to search for an alternative. The alternative was called XAMPP and it has the possibility to run your development space offline, on your own computer. You would have your own “webserver” that runs MySQL and PHP, which means you can install WordPress too. That sounded awesome for me!

Installing your offline “webserver”

The program XAMPP was the perfect solution to all my developing adventures. That’s why I would recommend this program for anyone interested in developing WordPress themes. Let’s install XAMPP.

You should download the latest version from the original site. I run a Windows computer, so I’ve downloaded the Windows version. I guess it doesn’t differ much between other operating systems.

The installation progress shouldn’t be to hard, it is just a normal setup.

Starting your offline “webserver”

Once you’ve installed this program, you have to start the program. You can do that by running the XAMPP.exe file.

To make your webserver run, you have to start the Apache and the MySql modules. PHP has no apart module because it is included in the Apache module. We need to run these particular services to make WordPress work.

xampp

Navigating to Localhost

When you have started these modules, you have started your offline webserver. This means you can navigate to the contents of your webserver from this point. The URL you have to visit is http://localhost/.

You should get redirected to the XAMPP web-based control panel. In this control panel you can find links to Status, PHPMyAdmin, phpinfo() and other services. A services that is of interest of us is PHPMyAdmin.

PHPMyAdmin and MySQL

We need to create a new database to install WordPress to PHPMyAdmin offers that service. Fortunately, all you need to do is “create a new database” and you are done. In the online versions you need to make users and passwords, but on your localhost, things can stay simple.

If you, for example, have made a database called ‘blog’ you need to remember the following information when installing WordPress:

Database: blog
User: blog
Password: (no password)
Server: localhost

xampp-2

Installing WordPress

Finally, we are ready to install WordPress as we have set up our database and offline connection. First things first, download the most recent version from WordPress.org. From now on, things are the same as your online version.

You have to extract the WordPress files to these folder: /XAMPP/htdocs. Remember to use the database information I have given you before.

Once WordPress is Installed

After you have installed you are ready to go. You can now develop WordPress themes with the ease of a webserver but it doesn’t cost you much time to constantly upload more recent versions of certain files to see changes.

Now you can just save your files and you see your changes right away. This greatly improves your productivity when developing WordPress themes. It defenitely did for me.

Liked this post? Subscribe, or Share and Enjoy:
  • Digg
  • del.icio.us
  • Blogosphere News
  • Design Float
  • DZone
  • StumbleUpon

This article is written by:

Name: Stefan Vervoort

URL: http://www.divitodesign.com

Description: I am a 18-year-old webdesigner and blogger from Waalwijk, the Netherlands. I also blog at WPTOY and work at DivitoMedia.

32 Responses

  1. Mike says:

    Mamp is the best solution for Mac users. Even easier than using the version of Apache that ships with OSX.

  2. Sumesh says:

    Perhaps the only step I don’t exactly like is adding the database and configuring the wpconfig file [I got the config working, though].

    Stumbled :)

  3. Yes, that’s the part I don’t like doing as well! :P

    Thanks for the stumble! :)

  4. Markus Nordin says:

    WAMP is nice for Windows users as well, haven’t tried XAMPP but that seems like a good alternative.

    http://www.wampserver.com/en/

  5. Tertius says:

    Great tutorial.

    I use Linux myself and have it just installed as packages. And if I’m developing on windows I just emulate linux.

  6. Justin says:

    Thank you for this information. Have been using XMAPP and it has worked out well.

  7. Buch says:

    I am using WampServer and tbh i think it is more customizeable than this ;)

  8. garaj kap?s? says:

    i have problems with XAMMP when editin .htaccess files.

    But i prefer that WAMP server. I think it s better then XAMMP

  9. [...] original here: Develop Wordpress Themes Offline with XAMPP » DivitoDesign This entry was posted on Sunday, November 9th, 2008 and is filed under Wordpress News. You can [...]

  10. its a usefull tool, however getting it to work is the hardest part, just takes some fidling but well worth it.

  11. [...] Develop Wordpress Themes Offline with XAMPP [...]

  12. jamie says:

    Nice tutorial. But you should have included steps for setting up the database. I have never used phpMyAdmin to setup the database before. I have always used fantastico to setup wordpress. So Now I am going to have to spend time to figure it out.

  13. Jamie – All you need to do is “creating a new database” and install Wordpress to that database. This is explained in the tutorial, but let me know if that doesn’t work.

  14. Geezer says:

    I’m lost. I should put all the Wordpress files directly into XAMPP/htdocs, not make a ‘blog’ folder and put them in that?
    If I do this, then what? How do I access the Wordpress?

    • Geezer – When you are browsing your folder you have XAMPP installed (on a Windows computer that should be something like C:/XAMPP/), you need to browse to /XAMPP/htdocs. When you browse to http://localhost/, you will see exactly what is in the htdocs folder. So, it would be possible to upload the whole contents of Wordpress to that map, but you could also make a folder called “wordpress”, or “blog”. You can simply visit that part of XAMPP via http://localhost/wordpress/ or http://localhost/blog.

      Do you understand? :)

  15. Geezer says:

    I keep getting “Error establishing a database connection” when trying to access http://localhost/blog/wp-admin/install.php, and http://localhost/blog just gives a “cannot display the page”.

  16. Geezer says:

    Nevermind, I got it. The datbase wasn’t configured correctly.

  17. Great article. I try to check back often for the updates here. It’s hard to find information about setting up an offline webserver. Thanks again.

  18. dramaqueen says:

    thanks. it helped.

  19. Wordpress themes are getting popular now a days. this is really a great article. We would certainly expect such articles from you.

  20. Shyamal says:

    Thanks buddy… much appreciated!!

  21. Naina Susen says:

    Hey guys, this really works you know i was struggled a lot to set up apache with php, really it saved lot of my time.

    -Naina

  22. Jme says:

    I’ve installed XAMPP on 2 systems, on a Vista Premium 64bit and the other Windows XP, and have the same result. The XAMPP site works fine, and a simple test site with just one file containing the phpinfo() function works as well. However, my primary site doesn’t load up right. Instead, I get a dialogue box saying “You have chosen to open index.php which is a PHP script”, and requires me to select the program to use. If I choose firefox.exe, it just starts over again. Any suggestions?

    Thanks

    • Did you load “http://localhost/” instead of C:/path/to/xampp/. It gives you an error then, but if you load it via Localhost, it should really load via the local apache server.

  23. [...] developing on a Windows machine, try installing Wordpress using XAMPP, a nifty program that bundles Apache and MySQL together in an easy install. (Note: XAMPP is [...]

  24. [...] developing on a Windows machine, try installing Wordpress using XAMPP, a nifty program that bundles Apache and MySQL together in an easy install. (Note: XAMPP is [...]

  25. Hassan says:

    Hey, Mine says Error establishing Datebase connection and i am putting in all the info?

  26. wasim says:

    very useful, but change username to “root” as its the default username that is set.