Portable Wordpress – The ultimate guide to setup Wordpress locally on your computer

WP makes no exception: you’re constantly in danger, hacking-hacking your precious resource, upgrading stable plug-ins to newer, faulty versions, deleting posts, testing and exposing to risks your “official” content.

Although a good backup plan will help keeping your work safe and preventing data loss, it will never avoid site crashes and unpredictable downtimes.

Not to mention your operating speed. Whatever the proximity to your WP host, your work will be slower, sluggish, connection dependant and… remote: if your Internet connection is lost, your working environment becomes unreachable, in a snap!

Last but not least, by previewing your blog directly on your own computer you can debug server-side flow, like server-side includes, form processing, or database-driven pages.

That’s why, once you will get confident with your WP environment, you will be demanding for a safer, faster solution to the problems sketched out, aiming for a proper development environment for your blog: a local copy of your Wordpress install, something that can travel everywhere with you and your computer, why not, on a USB stick.

To achieve this result basically we will need a portable web server and database compatible with Wordpress, namely Apache and MySQL. So the steps we will go through are the following:

• install a web server and database on our computer
• copy the online Wordpress contents locally
• backup and restore Wordpress database contents locally
• configure the new environment

Installing the web and database server using XAMPP

If you’re not familiar with system administration, quickly you’ll realize that it’s not so easy to install an Apache web server and things gets harder if you want to add MySQL, PHP and Perl.

Luckily, we all do have some saints looking after us: Apache Friends (http://www.apachefriends.org/) have developed XAMPP, a free portable and complete solution, easy-to-use package/distribution containing Apache, MySQL, PHP and Perl. XAMPP is very easy to install and to use; just download, extract and start configuring, as explaind later.

At the time of this article, four versions of XAMPP exist

• a version for Linux systems (tested for Ubuntu, SuSE, RedHat, Mandrake and Debian);
• a version for Windows 98, NT, 2000, 2003, XP and Vista;
• a beta version for Solaris SPARC (developed and tested under Solaris 8);
• and a beta version for Mac OS X.

In this article we will be exploring the install for Windows (VISTA).
This version contains: Apache, MySQL, PHP + PEAR, Perl, mod_php, mod_perl, mod_ssl, OpenSSL, phpMyAdmin, Webalizer, Mercury Mail Transport System for Win32 and NetWare Systems v3.32, Ming, JpGraph, FileZilla FTP Server, mcrypt, eAccelerator, SQLite, and WEB-DAV + mod_auth_mysql.

As in this tutorial we will stick for a Windows VISTA install, if you’re running on a different platform, adjust the instructions accordingly.

For greater stability it is suggested to install XAMPP outside of the canonical “Program Files” folder; again, in my case it’s no problem at all: I always keep ALL my software outside of that folder, allowing my disk being tidy and letting me know exactly what I have installed. For example, the software “root” on the computers I use, is the “C:\myprogs\” folder.

The next setup screen will give us the opportunity to select other XAMPP options, particularly details about running XAMPP’s apps as Services. I advise not to do so, at least in this setup phase, as this environment seems to be a little delicate to tune and without XAMPP running on services it’s easier to stop/start the apps within the Windows Task Manager if anything goes wrong.

As a last step launch your browser and point to http://localhost/; if no conflicts occurred, the XAMPP main page will be loaded.

At this point, you will have a personal web server (Apache) and MySQL database server running on your computer!

Make an offline copy of Wordpress

Next, we will be making a backup copy of the Wordpress install on our computer. There are many ways to do so, depending on the tools you wish to use, I will explain using cPanel (widespread nowadays on many Internet Service Providers) but you can achieve the same result also using a generic FTP utility: the goal is to make an exact copy of your online Wordpress folders and files, onto your computer.

Now let’s build the copy of our online content: using our browser we will login onto the ISP hosting our WP blog and within Cpanel, we will launch the file manager applet

then we’ll navigate to the folder containing the wordpress install,select the “select all” checker and then click onto the “Compress” icon

a list of the content being compressed will be shown, select “Zip archive” and press the “Compress” button

Once done, select the zipped archive and click onto the “Download” icon: when prompted where to save the file, navigate to the newly created folder (example: “c:\myprogs\xampp\htdocs\wordpress”) and save the zipped file; uncompress using your favourite ZIP utility the whole pot, keeping the original folder structure.

Backing up and restoring the database

Now we need to create a backup of the online database holding the Wordpress tables; we will achieve this using phpMyAdmin tool.

Back to your preferred browser, launch phpMyadmin within your Internet\cPanel online account and select the database holding your WP install, then select the “Export” tab.

Before restoring the database, we need to create a database using phpAdmin, this time on the local computer: in your browser, point to http://localhost/phpmyadmin/ and in the MySQL Localhost frame go for “create new database”; type in the name of your local database and select “utf8_unicode_ci” both for the database and the connection collation, then press the “Create” button.

You should see the following:

If you’ve done it right, you should see something like:

Edit local Wordpress configuration

The last step is to modify Wordpress’ local configuration file, editing wp-config.php in your previously created local folder, changing the following settings, accordingly:

Finally, open your browser and point to http://localhost/wordpress, you’re done!

Advanced topics – part 1

Running XAMPP services

Now that you’re up and running you may want to let start Apache and Mysql server automatically: just tick the corresponding checkbox into XAMPP’s control panel, enabling loading the apps above as services; remember to stop Apache & MySQL before doing so, otherwise an error will be issued.

Enable cUrl

Just in case your wordpress install needs cURL extension, with your favorite editor load the php.ini file located in the xampp\php folder; therefore, search for

and uncomment it (remove the leading “;”).
Stop & start Apache.

Using virtual hosts

There are many reasons why you could choose to apply for virtual hosts, on your freshly installed local Wordpress web server, for example, you could have multiple blogs/sites running on the same computer or you could have chosen (like I did) to alter Wordpress folder location out of the xampp\htdocs folder (see Moving Wordpress local folder to a better place); more: you simply wish to avoid conflicts with absolute/relative paths in your WP webpages… it looks like WP doesn’t like much relative paths particularly with images.

Whatever the reason, here’s how to enable a virtual host on your XAMPP configuration:
As a first step, edit the file httpd-vhosts.conf located in xampp\apache\conf\extra folder;
Code at the end of the file, the following directives:

Remember to replace the C:\MyProgs\Development with your current path to XAMPP folder. Save and exit.

The first <virtualhost *> directive helps keeping accessible default web contents on local web server, namely XAMPP’s home page or the phpMyAdmin home page (localhost);

The second one, instructs Apache, by means of the ServerName & Documentroot directives, what is the name of the virtual host (example: wplocal) and what folder to look for the virtual host’s contents, while the Directory directive gives the proper security settings to the folder, otherwise inaccessible (Allow from all)

To accomplish our goal, we need to instruct our DNS client on our computer to look for the newly created host name.

Edit the hosts file located into the c:\windows\system32\drivers\etc folder and look for the statement:

add the following statement on a new line:

Now the hosts file should look something like:

Save and exit.

Stop Apache from XAMPP’s control panel, then just to make sure no DNS conflicts occur, we shall clear the computer DNS client cache: open a command prompt window and type “ipconfig /flushdns” and press enter, then start again Apache.

Load your browser and check out everything is running smoothly, typing:
http://localhost (to access XAMPP home page) and http://localhost/phpmyadmin/ (phpMyAdmin) and finally http://wplocal to gain access to Wordpress home page.
That’s it!

Advanced topics – part 2

Moving Wordpress local folder to a better place

As I hate it, I do all my best to avoid having programs & data mixed together; however XAMPP installs by default the document root into it’s folder, namely in c:\xampp\htdocs …… ROAR!
If you’re a tidy-maniac as I am, and wish to keep your Wordpress files into your documents folder, head on!

Stop Apache from XAMPP’s control panel and move your Wordpress folder into it’s new location, for example in your Documents folder. Check out the underlying path of the new folder location (example: c:\users\chen\documents\biz\projects\wordpress);

at this point, we need to enable virtual hosts, following the instructions described in the previous chapter, but before saving the httpd-vhosts.conf file, code in the DocumentRoot and Directory directives, the path to the new location:

Save and exit, then restart Apache. You’re done.

Allowing custom permalinks to work properly – part 1

Unfortunately some XAMPP versions do not enable mod_rewrite by default, that is if you choose (like I do) to use custom permalinks in WP’s config you’ll have troubles navigating outside of your home page, falling into a 404 error. To enable custom permalinks you’ll need to instruct Apache to allow WordPress to write the .htaccess file needed to create pretty permalinks.

Stop Apache from XAMPP’s control panel, and edit the file httpd.conf located in the xampp\apache\conf folder; look for the line

Remove the hash sign (#) from the line.

Next, within the same file mentioned above, search for all instances of

and change it to

Despite many sites on the Internet are advising to leave the first occurrence to None, (that one in the default folder) I have found that only replacing all the occurrences, makes custom permalinks work.

Save and exit, then restart Apache form XAMPP control panel.

Allowing custom permalinks to work properly – part 2

If somehow the example above shouldn’t work, checkout if the .htaccess file located in the root of your Wordpress install, holds the proper settings.

Adjust settings accordingly. The example above does not takes in account if some WP plug-ins (like WP super cache) have modified the .htaccess file, so pay attention!

Troubleshooting

Trapping Apache errors

It happened to me that mysteriously in the very first installation & tweaking stage I couldn’t start the Apache server from XAMPP control panel.

There is an error.log file in the xampp\apache\logs folder but that wouldn’t help much.
An easy way to understand what’s happening behind the scene is to run Apache from the command prompt.

Open a command window (start menu, in the search box type CMD and click onto cmd.exe)

Navigate to the xampp\apache\bin folder (for example, type from the command prompt “cd c:\myprogs\development\xampp\apache\bin” and press enter); once in the proper folder, type apache and press enter.
Track down any displayed error and behave accordingly; common errors are syntax errors or wrong values in apache configuration file, httpd.conf, located into the \xampp\apache\conf folder.

Tweak your configuration and keep launching Apache from command line, until you get it to work. When done, exit the command line window and run Apache from XAMPP’s control panel, as usual.

Fixing port conflicts
One of the common reasons preventing Apache to work properly is that another application running on your computer is already using TCP port 80, like Skype does.
In this case you have two choices, the first one is to change the port used by the conflicting application, the second is to modify Apache’s listening port.

If you stick for the first solution, start the game googling for the utility TCPView for Windows (by Mark Russinovich), download and start the utility (you can also start the app. from the web); once running sort the list by clicking on the “LOCAL ADDRESS” column and find the 0.0.0.0:80 value; right click with mouse on the found row and select “Process properties”; a dialog box will pop up showing the name and the path of the application using port 80.
Tweak the conflicting application accordingly.
When done, start Apache.

If you rather wish to leave the conflicting application to use TCP port 80, then you will need to instruct Apache to “listen” on another port number.

To achieve this, edit the httpd.conf file located in the xampp\apache\conf folder for Apache, and find the following string:

Change the port number to something different like 8080, you can still use TCPView to checkout unused ports, before editing.

Now find the statement

and change the port accordingly, obviously using the same port chosen in the previous step. Save, exit and restart Apache.

The only problem with this solution is that instead of typing in the regular like http://localhost/ from your browser, from now on you’ll have to type in http://localhost:8080/

The infamous memory allocation error

On particularly large databases you may be hit by a common error like:
“Fatal error: Allowed memory size of 100663296 bytes exhausted (tried to allocate …….. bytes) in c:\myProgs\development\xampp\phpmyadmin\libraries\import.lib.php on line 269”

If that is the case, increase the memory limit in your php.ini file located into the xampp\php folder; edit the file above and search the memory_limit string coding a bigger value like

Save and exit, then restart Apache within the XAMPP control panel.

Firewall woes

Make sure your firewall is set to allow incoming connections to PHP, Apache and MySQL, otherwise you may get struggling wondering why something is not working properly, while the answer is right there under your nose!

Final thoughts

From now on, keep in mind that you will have to manage two copies of your Wordpress work, the local one for development purposes and the “release” online version; remember to make regular backups of both. Also notice that the synchronizing process will be critical, due to the nature of Wordpress environment: while it will be quite easy to automate scripts or use tools to synchronize the Wordpress folders, you will need to manually tweak & synch plug-ins and database contents, until a completely automated sync solution will be available. Sooner or later someone will exploit a plug-in that does the job smoothly.

What I warmly suggest in the meanwhile, is to use a website development tool that has built-in local and remote update/synchronizing capabilities. I’m currently testing Adobe DreamWeaver, and it looks like it has the features to do the job.

Have fun at the speed of light with your new Wordpress local copy!