PHP (WordPress) development using Eclipse and XAMPP
As can be determined from my other posts, I'm a Java Developer by trade and Eclipse is my editor of choice. Now I have gone to the darkside now and then for some good out of the box software, such as WordPress, which as you may know is written in PHP. The main reason I chose WordPress was because of it's great community, it's focus on best practices, and the huge number of plug-ins enabling any blog functionality you could imagine, this mix just doesn't seem to be present in an Open source Java-based blog software package. So to the point, I want to be able to develop my WordPress themes, and any other PHP projects for that matter, in the same manner I develop Java applications - In my favorite IDE, which is loaded with features we won't discuss here, with the ability to test the changes locally before I promote them to production. Using the Presentation tab in the WordPress admin console is not an optimal solution or a good development practice. Now these instructions aren't for the faint of heart and I will assume that you most likely have some sort of programming background, or general cognitive skills and that you can get by without a bunch of pretty pictures and click this, click that, click ok, hopefully you've installed shit before. These instructions are geared towards Windows, nobody's perfect, but all the software used here is available for Linux, you may just have to do a little work to make that jump.
List of installs, you can stop here if you don't need me
XAMPP Lite 1.6.5
JDK 1.6
Eclipse 3.3
PHPEclipse 1.1.8
WordPress
MySQL GUI Tools
What you need to install, the must have tools
- Download and install the latest JDK, if you never ever plan to do Java development you can get by with just the JRE
- Download and install Eclipse 3.3 the link that says Eclipse IDE for Java EE Developers, it's not really an install, it's a zip file. Unzip it to the root of your c: or d: or whatever makes you happy, we'll assume c: and you'll end up with something like c:\eclipse.
- Download PHPEclipse and unzip it to the eclipse directory, ex. c:\eclipse.
- Download and install Xampplite, this is a zip also, treat it like eclipse and unzip it to the root of your c: or d: or whatever, the directory will be something like c:\xampplite.
- Download and install MySQL Gui Tools, this is actually an installer, you can let it install to the default location with the default settings, especially if your lazy like me. This one could be considered optional if you just prefer to PHPMyEclipse that's included with XAMPP.
Setup your project in Eclipse
- Open Eclipse, you may need to dig in to the c:\eclipse directory or wherever you unzipped it and create a shortcut of eclipse.exe. Choose a directory when prompted to store your workspace, I typically use c:\web, we'll assume you did too, it's important to remember where your workspace is for later configuration.
- Go to Window -> Preferences -> PHPeclipse Web Development -> PHP External Tools -> XAMPP
Make sure the XAMPP Start and Stop lines point to where you unzipped XAMPP earlier
I just had to change the xampp directory to xampplite. - Open the PHP Perspective by going to Window -> Open Perspective -> Other -> PHP
Right click in Navigator New PHP Project, give the project a name that makes sense, this is where your code is gonna go - You can leave Eclipse open, we'll come back to it to set up your project.
XAMPPLite and Host Entry Configuration
- UrlRewrite is disabled by default in XAMPPLite, if you're going to use pretty url's for your permalinks in wordpress or any type of SEO friendly urls that will involve rewriting you'll need to enable it. To enable go to c:\xampplite\apache\conf\ and open httpd.conf with your favorite text editor, uncomment the line LoadModule rewrite_module modules/mod_rewrite.so by removing the # sign at the beginning of the line.
- The next thing you'll need to figure out for yourself is what you're planning to use as the url to access your individual projects locally. I use a scheme like local with my site name, for example http://localgreatwebguy. You don't have to do this, but I have more than one project and I only want to do this configuration thing once and focus on the more important things like writing code and xampp is gonna need it to get things straight and give you the flexibility you need.
- Now that you've picked out your name you need to set up a host entry for it, in windows you'll open the file c:\winnt\system32\drivers\etc\hosts with notepad (special note for Vista you'll need to open notepad as an Administrator, to do this right click the Notepad in your program list and choose Run as administrator), depending on your installation some windows flavors may have their system32 folder in c:\windows, I'm sure you'll find it. With the file open add an entry at end of 127.0.0.1 line, after a tab with the name you chose for your application ex. 127.0.0.1 localhost localgreatwebguy.
- Now we need to set up a virtual host in apache, open c:\xampplite\apache\conf\extra\httpd-vhosts.conf with your text editor again, there's an example already in the file, we're gonna modify it to look something like this:
NameVirtualHost *:80
ServerName localhost DocumentRoot "D:/xampplite/htdocs" Options Indexes FollowSymLinks Includes ExecCGI Order allow,deny Allow from all ServerName localgreatwebguy ServerAlias localgreatwebguy DocumentRoot "d:/web/greatwebguy" ServerAdmin webguy@greatwebguy.com Options Indexes FollowSymLinks Includes ExecCGI AllowOverride All Order allow,deny Allow from all Some things to note in the above VirtualHost configuration, the first virtual host is to keep the XAMPP console in tact. which offers PHPMySqlAdmin and some other tools. The second VirtualHost is the setup for your project, the ServerName and ServerAlias should match what you set up in your host file. The DocumentRoot and the Directory should match where your project is stored by eclipse, which is a combination of the directory you chose as a workspace and the name you gave the project you created. You can also get away without specifying the ServerName and changing the Directory to just "/", it works both ways I just rather be verbose about it.
Start XAMPP in your workspace
- You're to the point where you can run XAMPP and you can start configuring MySQL and drop some code into this project. First things first, close everything but Eclipse, make sure you saved everything and you didn't fat finger your VirtualHost configuration, host entry, or project name, it's key that they match. Switch to the PHP Perspective, if you're not already there in Eclipse
- Start up XAMPP with the icon in the top left of your Eclipse environment.
- You should be able to open a browser and go to http://localhost to see if XAMPP started properly.
Regular PHP Projects
Start creating PHP files in the Navigator and checking them to see if they run at your local url, you're on your way, you can also create databases to run locally in XAMPP, which you'll see we do below for WordPress.
New WordPress users
- Download and unzip WordPress, you'll need to pick a directory to unzip it to first because it's packaged with a path of wordpress. Once it's unzipped open the wordpress directory and drag and drop the contents directly to the project in the Eclipse navigator, the files will copy into the project.
- You'll need to create a new wordpress database, you can either do this by opening the SQL Administrator that was installed with the GUI tools, I prefer this method for level of control, or the quick and dirty, go to http://localhost/phpmyadmin/ and create the user and database from there. In PHPAdmin click Privledges -> Add a new User, give the user a name and password and place the radio in Create database with same name and grant all privileges then click GO (like I said, quick and dirty).
- If you decided to use MySQL Administrator you'll need to login to localhost with a username of root and a blank password, you'll need to create a Schema under Catalogs first, then create a user and give the user priveledges under User Administration, you'll get a service error when you login, but you can ignore that.
- Now that you've created your database, you need to configure wordpress. In Eclipse, in the root of your project, you'll need to first rename wp-config-sample.php to just be wp-config.php. After this is done open wp-config.php and fill in the database, username and password you set up in MySQL.
- Now go to your local url, ex. http://localgreatwebguy and follow the prompts for the wordpress set up, now you're on your way.
Existing wordpress install
- I don't want to go into too much detail here, so here's the gist of it. Back up your remote wordpress database, restore it to XAMPP using the MySQL Administrator tool, you'll need to duplicate the user you use for your remote wordpress database in User Administration locally.
- Download your existing site and copy it to the project you setup above in Eclipse, you're wp-config should be straight if you had localhost specified for your database, otherwise change it to localhost.
- Open the MySQL Query Browser (also can be done with PHPMySQLAdmin) and run the following update to change the home and siteurl to your local url, you won't be able to get to your site without doing this.
update wp_options set option_value='http://localgreatwebguy' where option_name in ('siteurl','home')You'll replace option_value with your local site url, that you've specified everywhere else in the configuration.
- You should be able to access your blog locally now and do any theme development you desire.
Now that you're all setup to develop your own WordPress theme locally check out this article on Deziner Folio to get started writing your first WordPress theme. This is also a nice sandbox to test plugins before you install them on your production site, if you break it locally you have some time to react and fix it before you take it live. Enjoy!!
January 9th, 2008 - 04:43
You further shorten the steps by using Easy Eclipse see http://www.easyeclipse.org/site/distributions/
January 9th, 2008 - 08:53
Thanks for the feedback Tarique, believe it or not I had not heard of Easy Eclipse, or else I would have included it, looks like a nice little package. Someone just needs to get them to package up xampplite with it and we could just shorten the whole thing to configuration.
January 9th, 2008 - 09:15
Just a note, somebody recently pointed me towards PDT, PHP Development Tools, as a preferred platform. I think you could probably use xampplite with this also, they recommend the zend debugger. I like having mysql and everything together, plus the installation seemed relatively simple once you’ve done it with PHPEclipse, but who am I to say I’m a Java Developer
January 22nd, 2008 - 17:21
Excellent article but I was wondering what do you use or do for debugging purposes using the set-up you described above?
January 22nd, 2008 - 18:46
BandK, Thanks, that’s probably a good point I don’t write a whole lot of PHP other than developing out my own themes for WordPress, so I don’t have a lot of need for a debugger other than modify and refresh
You could use the Zend Debugger with PDT, instead of XAMPPLite. I like the XAMPPLite setup purely because it includes Apache and MySQL and will even support the Permalink Urls.
January 23rd, 2008 - 04:02
Great article… I am developing with Drupal and I am using XAMPP & not XAMPPLite, but this all mostly worked.
The only problem I’m having is that it’s giving me this error:
[warn] _default_ VirtualHost overlap on port 80, the first has precedence
As a result both localhost and the site I’ve defined point me to XAMPP htdocs folder..
Any pointers? Thank you MUCH.
January 23rd, 2008 - 10:11
Greg, Thanks, make sure you’re not missing the NameVirtualHost line above your VirtualHost configs, also make sure you gave a separate servername for each virtual host.
October 6th, 2008 - 02:07
how do i change the xampp logo…
February 8th, 2009 - 15:50
Hey, thanks a lot. This HOWTO helped me a lot to set up a project for designing offline.
I think it’s been pretty in depth overall but it could have been a bit more extensive in the last part about setting up an existing WordPress installation.
Thanks again for your efforts!
March 14th, 2012 - 22:56
still can’t figure this out…. what was the trick with setting up your existing wordpress install within this config file?
March 24th, 2009 - 04:13
Thanks for the great tutorial! I started using PHPEclipse instead of PDT because of this and so far I think PDT is not that good and PHPEclipse is much more slick. Maybe PDT has more features, but you can’t get a black background without seriously screwing up the rest of the colors! Deal breaker!
April 20th, 2009 - 09:04
Hey. thanks for that tutorial. I was looking for same stuff. cuz i wanted to start running a clean wordpess project with CMS and ecommerce stuff. NOOOOW… to make everything reallyyy clear is the way to use a SCM (Subversion) and make a build via ftp on the hosting server… if there is a howto on that it would be great. thankx!
June 10th, 2009 - 17:18
Hi,
Thanks for the tutorial. I created a new project called MyFirstPHP and in that created test.php. But when I run the php file http://localhost/test I am getting the error:
Object not found!
The requested URL was not found on this server. If you entered the URL manually please check your spelling and try again.
Please help me.
June 10th, 2009 - 17:41
Ok the problem is solved. I changed my workspace as xampp/htdocs
Thanks
October 14th, 2009 - 10:00
Hello,
Thanks for the pointers. The VirtualHost entries didn’t work for me until I changed the directory line:
After that, it was fine.. Now I’m off to try and get subversion working within Eclipse
Cheers,
Eoan
October 14th, 2009 - 10:34
@eoan Check out Subclipse, works well with SVN
October 15th, 2009 - 04:19
Hi Webguy,
I setup Subclipse yesterday, a bit tricky getting it to work with svn+ssh, (works with password, but not liking keys ) this is working fine using TortoiseSVN. I’ll keep trying with that.
I’ve a setup question for you, and perhaps it’ll be helpful to you to:
You copied wordpress into the Eclipse project. I was hoping to be able to make use of the wordpress subversion repository, rather than copying all the wordpress files into my own svn repository. At the moment, I have to export wordpress from the SVN rep and copy the files into the project, then I have to make sure these files are ignored when I am doing a commit for my own project.
What I have just now is:
Eclipse Project created, into which I checked out my own SVN repository:
C:/eclipse/workspace/website
at this level I have the wp-config.php and index.php files, and a wp-content directory for the site. The wp-config.php file has been modified to change the location of the WordPress Content as follows:
/**
* Change the location of the wordpress content directory.
*/
define( 'WP_CONTENT_DIR', $_SERVER['DOCUMENT_ROOT'] . '/wp-content' );
define( 'WP_CONTENT_URL', 'http://localwebsite/wp-content');
Then for wordpress relocation, I have modified the index.php file
/** Loads the WordPress Environment and Template */
require('./wordpress/wp-blog-header.php');
So I end up with
C:/eclipse/workspace/website/wp-content
C:/eclipse/workspace/website/index.php
C:/eclipse/workspace/website/wp-config.php
C:/eclipse/workspace/website/wordpress
This isn’t ideal, as it’ll ask me to add this to my svn repository. What would be better is for Eclipse to allow me to have a dependency on a wordpress project.
I will most likely try and relocate wordpress so that it’s outwith my svn repository.
Perhaps I should be writing some sort of build script that exports the wordpress repository as required, then when I want a new version I can modify the build script and rebuild the project.
Cheers,
Eoan
October 15th, 2009 - 09:45
Hi,
Just to let you know, I managed to do this using svn externals.
I’m a clearcase user normally, new to Subversion.
http://codex.wordpress.org/User:Hakre/define_SVN_externals
I defined a property at the project level directory,
svn:externals
wordpress http://core.svn.wordpress.org/tags/2.8.4
then an svn update pulls wordpress into my repository.
Cheers,
Eoan
October 15th, 2009 - 09:48
That sounds useful, going to have to check that out.
Thanks
December 11th, 2009 - 23:19
Thank you! I used codex’s tips for installing my existing site but I kept having problems ‘connecting’ to my imported dbase. Your tip #3 to open the MySQL Query Browser and update the wp_options table solved it. Worked like a charm!
April 7th, 2010 - 11:55
Hello,
im using eclipse php Galileo but i can’t integrate neither xampp server nor wamp server i tried to install them but when i try to add it from eclipse it does not exist there.Thank you for your help i am really lost…
August 9th, 2010 - 21:18
Why do people have such a hard time remembering the name PHPMyAdmin? I see people misspell it or use a completely different name all the time. What’s PHPMyEclipse?
August 30th, 2010 - 10:11
Thanks for the detailed instructions. I’m new to eclipse but not to IDEs. I’m confused about how to use the eclipse workspace for debugging wordpress. Should I set my eclipse workspace to you c:/xampp/apache/htdocs where my local apache server is serving my project pages?
August 30th, 2010 - 10:14
@John, if you look at the instructions above you’ll see the virtualhost in xampp being updated. Keep in mind this is a pretty old tutorial and there’s bound to be a better way to do this by now.
August 30th, 2010 - 11:14
Thanks, I agree, there probably is something better out there. Your the first result for Google: eclipse wordpress debug so I looked at your page first.
btw, I was not able to get my apachee to accept the two directives in the vhosts file.
and
I adjusted for my installation but I kept getting a syntax error: path is invalid.
because of this I just hard coded the directory structure. I could not find any documentation to explain the format you were using.
If I’m misunderstanding something please correct me; thanks again for your post and contributions to web development.
August 30th, 2010 - 13:57
@John Wow, looks like some formatting issues in that code formatter plugin. Those directives are just plain wrong, for some reason it gets munged by the code formatting plugin. If you view the source of the page and search for virtual host you’ll should see the actual directives. I’d have posted them in the comment, but that doesn’t seem to work either. Sorry about that.
October 22nd, 2010 - 16:25
thank u so much .
November 14th, 2010 - 05:32
Hello, I got this error:
[error] The requested name is valid, but no data of the requested type was found. : Could not resolve host name *:80=”" — ignoring!
Prior to installing XAMPP, I already had Tomcat connector installed; I am using localhost 8080, instead of 80.
Can someone help me resolve this issue? Thanks, have a great day.
December 14th, 2010 - 22:46
@ #27: I think the author’s comment on #25 will resolve your issue.
December 14th, 2010 - 22:58
as for me, im currently having problems with file permissions.
It said: There is either no index document or the directory is read-protected.
well, there is definitely an index and since i don’t know how to change file permissions in windows xp, i used filezilla to changed the file permissions… but it still say the same message.
but still, nice blog post. i must have just done something wrong along the way or maybe OS stuff, i don’t know.
February 13th, 2011 - 14:53
I’m not using virtual hosts but just the /htdocs as root dir and then multiple wp directories all for different stuff what is exactly the need for the virtual hosts entry when developing for wordpress and xamp?
February 13th, 2011 - 18:36
@edward I used them at the time to support developing against multiple sites in Eclipse and running them with XAMPP, also WordPress was referencing the blog with a domain name in the database you could always use localhost if you only have one site to deal with.
May 19th, 2011 - 02:36
I use free PHP IDE Codelobster PHP Edition (http://www.codelobster.com)
It has special WordPress plug-in that has special wizard for installation, extended WordPress autocomplete, context help and WordPress Theme Editor.
November 21st, 2012 - 07:05
You provide here steps of editors and web server for PHP which is proved very useful for the beginners who are looking for..
February 13th, 2013 - 05:24
Eclipse provide better facility for PHP development as it has Two plug-ins. The first, PHP IDE Project, is an Eclipse Foundation project, which means it is developed using the Eclipse Foundation’s tools and processes.The other is PHPEclipse and is developed independently.
March 25th, 2013 - 07:21
PHP development one type of effective plateform For Web development and programs and also PHP Development is one of them. It allows you to get more improved web page for different viewpoints Website.