Do You Localhost Your WordPress?
Do you do all your design/testing/development on your production website? Have you ever installed or updated something that either crashes or messes your site up? Have you ever tried to format or fix your site layout while everyone visiting watches you? Has any of this happened to you for hours or even days while you go insane and scramble to fix the issue?
If you have spent any amount of time in WordPress you can easily identify with these issues. This insanity can be avoided by doing all your development on your own computer. This article will run you through how to get WordPress working on your own computer and leave your production site stable, clean and user friendly. Test all your plugins, updates, layout and design ideas on your local computer instead of letting the world watch you in the process.
Overview
- Develop Like a Pro
- What is XAMPP
- Installing XAMPP
Step by Step Video Instructions - New WordPress Install
- How to Sync your Systems
The Duplicator Plugin Quick Overview - Administer like a Pro
- Read Time: 8-10 minutes | Exercises: 15-30 minutes
Develop Like a Pro
Most people set up their WordPress sites with hosting providers like BlueHost, HostGator, GoDaddy and the big named hosting providers. This is definitely where you want to start and the most affordable solution for getting your site visible to the world. The problem is that most people just stop here. They do all their testing/design/configuration and prototyping directly on their production site and rely on it as a one-stop shop for getting everything done.
Now given you have a low traffic site where you are really not trying to commercialize it or take it to the next level, then the practice of doing everything on a single production server is probably okay. However if you establish good habits now, you will carry them forward to sites that really matter and are no longer just hobby sites.
When you begin to build up a decent list of subscribers where people are checking your site regularly and your name and brand is also associated with the reliability of your website, then you should approach every update to your site and database with much more caution and develop like the pros do.
Professional developers work in separate environments. They have two identical blogs on two separate computers. The first is a development environment and the second is a production environment which is usually their hosting provider. The development and production blogs are usually identical to each other except for one huge difference. The development server is only seen by the developer and internal to his/her company and the production server is what the rest of the world sees (usually your hosted server).
This is how the pros work and in this article you will learn how to set this environment up for yourself so you can take advantage of all the benefits a development/production environment offers you.
- Design/prototype without affecting your production site
- Detect plugin conflicts before they happen
- Avoid unnecessary bandwidth costs
- Test major upgrades for system stability
- Debug customer errors in a controlled environment
- Test new themes widgets and much much more…
What is XAMPP
To have the same functionality that your hosting provider gives you when you set up your production website, you will need the same tools they use to make this happen. Those tools consist of a Web server, database engine, and a scripting language capable of performing complex application requests.
The three big tools that hosting companies use include: Apache, MySQL, and PHP. The beauty of XAMPP is that it bundles all these applications and a few others into an easy to use control panel that allows you to run great applications like WordPress, Joomla, Drupal, and tons of other great open source and commercial products on your own machine.
Installing XAMPP
Setting up and installing XAMPP is a simple and easy process. You can have your own WordPress up on your computer in under 15 min! Just follow these simple steps.
1. DOWNLOAD XAMPP
2. INSTALL XAMPP
Windows Specific Instructions:
- Disable UAC: During the install, you may get a message indicating that you need to turn off “User Account Control.” This can easily be done by clicking your start button. Type “uac” in the search dialog and choose “Change user account control settings” then set the slider to the very bottom.
- Install Path:
Good: C:\xampp or D:\xampp
Bad: C:\Program Files\xampp (xampp does not play well with spaces) - Services: These sections don’t need to be checked.
- Firewall: Click “Allow Access” on all dialogs
After Install browse to: http://localhost/
You now have an environment capable of serving up WordPress sites locally.
3. FIND CONTROL PANEL
After XAMPP is installed you will need to control XAMPP from it’s control panel. To always have XAMPP showing in your system you need to enable your notifications by clicking customize from the system tray pop-out menu. Then enable XAMPP to show notifications.
You can also get to the XAMPP control panel by typing XAMPP from the start menu. The Mac will have similar and probably easier options so look for them after install. As far as the control panel for both operating systems, it is the same.
New WordPress Install
Start MySQL and Apache (see panel above)
Browse to Database Editor:
Create a database: “mypress1″ or whatever name you want
Create database user: Privileges -> Add a new User
UserName: “superadmin”
Host: “localhost”
Password: “whateveryouwant”
Privileges: Check All
Run WordPress Installer:
Download WordPress and extract to: C:\xampp\htdocs\mypress1\ your path should be similar
Browse to: http://localhost/mypress1/
Enter database info from above.
Finish Installer…
Your Done!
Sync Existing WordPress
So you might be asking, “I have a production site and I just ran through installing XAMPP. How do I get the production site onto my local box?” Good thing you asked, I have a handy little plug-in that I wrote that will help you perform this task. Just watch the video below and then download and install the duplicator plug-in and you’ll be ready to start developing like a pro.
Administer Like a Pro
If you’re like most WordPress administrator’s you simply update plug-ins and the core of word press on your production site without realizing that these updates are editing core files and core database tables. This is going to work for you 99% of the time but it’s that 1% that could bring your site down and possibly cause outages for hours. Sometimes I experience people who have had their website down for days by simply installing a plug-in.
Individuals who administrate there WordPress sites like professionals have the two-tiered system I mentioned above in the section “Develop like a pro.” The systems don’t have to be 100% in sync; however, they should be somewhat close. So, before you do any upgrades or play with a new plugin simply install it on your development site to make sure everything looks good and you have it configured just how you want and then perform the same action on your production site.
Virtual Mentoring the Smart Way
38 comments
Leave Reply
Wow, this is a great post! Thanks a lot for the information.
I just ran through the video and I now have my own WordPress setup on my own box.
Now I feel like I can make a lot more changes or experiment without breaking my production site.
Thanks again!
Keith.
Hi Cory,
I discovered your site – and ultimately your magnificent Duplicator plugin – via the long and painful process of establishing a powerful security suite for (self-hosted) WP users.
First off, I’d like to extend a heart-felt “Thank you!” for both such a great great plugin, as well as the equally excellent tutorial above. As a dedicated Linux user, I have never been able to find a suitable localhost solution… that is, until now, thanks to you.
The possibilities that your tutorial have opened up simply make the mind reel with all of the exciting possibilities… easy to get unfocused.
Anyhow, I have a quick question I was hoping you could shed some light on. I got localhost running totally successfully and was about to set up a mysql as per your instructions when I encountered the following warning:
“Your configuration file contains settings (root with no password) that correspond to the default MySQL privileged account. Your MySQL server is running with this default, is open to intrusion, and you really should fix this security hole by setting a password for user ‘root’.”
Any idea on how to go about this in Linux (Mint/Ubuntu)?
Many Thanks in advance!
Best regards,
Mark
Hey Mark,
The error you are getting on a localhost box won’t really matter since it is just a development box, however to answer your question and get rid of the warning in phpMyAdmin you can follow these steps.
1. OPEN PHPMYADMIN
Browse to http://localhost/phpmyadmin/
2. CREATE ROOT USER
Create database user: Privileges -> Add a new User
UserName: “root”
Host: “localhost”
Password: “whateveryouwant”
Privileges: Check All
3. UPDATE CONFIG FILE
After you change the password for root, you need change config.inc.php in $/xampp/phpMyAdmin.
Open config.inc.php in a text editor, and find: $cfg['Servers'][$i]['password'] = ”;
Insert your root password from step 2 in the above ”. Save your config.inc.php.
Reopen your phpMyAdmin in the browser and the message should be gone.
Hope this helps!
Hello,
One thing I am confused on is getting the newly developed site back onto the host server without messing up the activity that happened in the mean time. Such as, new comment and posts. It sounds like:
1. we would have to backup the “live” sites’ database
2. install the duplicate file from the “development” site to the “live” site.
3. If I then restore the recently backed up database to the newly upgraded “live” site will it mess with my recent changes in development or will it simply keep all of my posts that were just backed up in the database?????
Wondering what the right thing to do is.
Hey Mark,
Here are a few rules I follow.
PRE-PRODUCTION:
This is before a site goes live. At this stage I do all my development locally and setup my WordPress as I see fit. Then I upload the package and installer generated from the Duplicator plugin on my development box up to my production box or host. I then run the installer and I have a replica of what I just spent weeks developing.
POST-PRODUCTION:
Once a site goes live I only duplicate a site the other way which is from production (my host) down to my development box. This of course only happens when I no longer need the state of my development WordPress instance. I use my development box as a playground for what I want to happen on production.
Once my production site is duplicated onto my development box my sites are in sync temporarily. I then start the process of whatever project I have to work on and integrate all the changes on my development box. I usually keep a log or 90% of the time just know what I’m changing and working on. I then either FTP my custom files or reinstall any plugins directly onto the production site, based on all the changes I made on my development box.
Any type of configuration is duplicated (like a plugin setup). However I know what the plugin or changes are going to look like and how it will function because I did all my testing on a development box. Now I don’t have to worry about installing a plugin and trying to tinker with it on a production site. I was able to make everything perfect on my development box and then push those changes to the production without messing up my production site. It also allows you to test a plugin or changes to see if you even want to use that plugin.
Hope this helps!
Alright I think I understand.
1. duplicate live production site to development box.
2. develop, then install development site to production site.
3. when needing to make changes to production site.
a. duplicate to development.
b. develop.
c. do not duplicate back to production site.
4. copy files needed from development site to production site.
a. put up maintenance mode on production site.
b. copy files from development to production via ftp.
Question: Which files do I copy?
– Is it alright to copy the whole /wp-contents/ folder or will that mess up the
database?
5. take maintenance mode down and let visitors enjoy
Hey Mark looks good!
A few comments on your steps:
Step 2. This is a manual process, so every plugin that you installed and configured on your development box you would need to re-install and configure on your production box. However in most cases you don’t need to worry about maintenance mode, because you already know it works on your development box and you have tested thoroughly. Most plugins are pretty simple, just install and make a few changes. However if its a large complicated plugin that require quite a bit of setup then maintenance mode may be necessary, its really your call.
The underlying benefit to this process is that you can make easy changes to your site whenever you want with confidence, without having to wait for odd hours to go into maintenance mode.
Step 3. You don’t really need to do this every time you want to make a change. In fact your development and production site can stay out of sink for quite some time if you want. You really only need to perform this step when you feel your development box (aka playground) is not representative of your production site.
Step 4. If you are only working with plugins then you don’t have to FTP anything. Just install and configure with the settings you did on development. However if its a custom WordPress template then all you have to do is FTP the template file(s) and configure your new WordPress ‘Page’ to point to that template. You really don’t need to write your posts on a development box because you can just use the preview mode till you decide to publish the post.
Step5. As I mentioned before maintenance mode isn’t really necessarily needed unless your doing large changes that surfer could access. In fact lots of time I will make large changes directly on a production site as long as they can’t link to the feature I’m implementing. Once I’m done I then put up the link so they can get to it.
Many people use maintenance mode to test out plugins on there production site. That is a very bad practice. Plugins can conflict with other plugins causing problems on your site, so its important to always test these in a development environment. Anytime you have to put your site in maintenance mode you may ask yourself why.
Maintenance mode is not necessary if you have already done diligence on a development box. I have been developing for over 20 years and implemented tons of website and probably only used maintenance mode 2-3 times. Now to be realistic maintenace mode is no big deal for a small blog, but if your site is averaging thousands of visitors a day then you don’t want downtime.
Hey Cory,
Thanks for all of the great info! And thanks for editing the format on my reply. I didn’t realize it would all align:left.
“However if its a custom WordPress template then all you have to do is FTP the template file(s) and configure your new WordPress ‘Page’ to point to that template.” – Cory
I am looking more at customizing the template for the entire site, based off of another template and editing the code.
Thanks,
Mark
@Corey and @Mark – Thank you for precisely explaining the sync process and when it it not necessarily needed.
Do either one you ever experience distinct anomalies with xampp that you do not experience with a live web install for a development box/playground? For example, a particular theme I’m rather fond of has a drop down widget area to the top. On the web, works correctly. In xampp, it freezes (will not drop down).
There’s a couple other minor anomalies; enough to cause me to (sadly) abandon xampp.
Have either of you experienced any anomalies via xampp that were no encountered via a live web production box?
Thanks!
Mark
Hey Mark,
Totally understand your pain! Anomalies are definitely a part of software development. There are times when I work on identically hardware and software and still get different results. Software is far from perfect and I have learned that as a developer or consumer of these products you have to learn to work around the issues and try to pinpoint the underlying problem.
The problem most likely isn’t with xampp itself, but one of its underlying components. All xampp does is laydown PHP, MySQL and Apache. So the problem could be as much as a mis-match in one of those versions. You may have to go to an older version of xampp
Sometimes minor things such as using PHP 5.3.1 or 5.3.2 can cause enough of a minor difference to cause things to not work. Then you have the conflicts of operating systems. Right now I do all my development on a Windows 7 xampp and then push everything up to a Linux host. While 95% of things work, I still get the strange anomalies which can sometimes drive me mad. But I usually find a way to fix it or work around it.
Sometimes strange anomalies can also point to poor development design, which should help you identify the better plugins. In other words the plugin or software developer only tested on this one browser under this one version of PHP. In software development and especially web development that is a huge no-no.
Try to get your versions of PHP, MySQL and Apache as close as possible. Also test in several browsers to make sure its not systematic of just one browser. You may also email the plugin author or post to the WordPress boards and see if someone has had a similar problem. Most likely your not the only one to experience the problem. If your still are not able to get your development box perfect that’s OK. Keep in mind its a sandbox to play in and tweak your settings.
If the anomalies are too great and you just can’t find a work around on the xampp platform you could try some of these:
WampServer
UwAmp
You can also just Google ‘xampp alternatives’. There are quite a few out there. I have had the best luck with xampp.
Just keep in mind that in the world of software development its very critical to isolate your development and production, especially if you making any type of cash-flow or have and audience. So either use xampp or another consolidated WAMP/LAMP packager and remember to always do your tinkering on your development box and leave your production box for your audience to enjoy…
In future articles I’ll try to write some tutorials to show people how to identify these problems on there box so they will know the right questions to ask when they go into the forum. It’s important if you plan to do these sites on your own to have some very basic know-how of HTML, CSS and the ability to debug JavaScript. You won’t need to know how to program, but understanding what technology is actually causing the issue will help you get your answer so much faster.
Hope this helps releave some of your tensions!
Believe me I know exactly how you feel :)
Hi Cory,
My apology for misspelling your name above. And awesome, in-depth answer. It definitely gave me a renewed confidence to give it another shot; even despite the the anomalies.
Since I am a dedicated Linux user I’m blessed in being able to have lampp configured to silently run in the background right at point of boot up. Absolutely no having to “launch” it when I need it … local server’s always running if the computer’s on.
As you can imagine, that was an extremely hard proposition to walk away from.
Prior to hearing your above response, I was running both a production box and a dev box (on it’s own toplevel subdomain) on my host account. On the upside, it was as close to 1:1 as could be realistically expected. On the downside, it had nowhere remotely close to the response time that running your own localhost has.
Moral: Thanks to your most excellent insight in this regard, I am going to stick with lampp. A few minor anomolies are quite acceptable when the speed factor is taken into account. Thanks Cory!
Best regards,
Mark
Hey Guys, love your Duplicator plugin. I’ll definitely be doing a write up on it at serverpress.com. Good work. Sign me up for that newsletter!
And to answer your questions on this post, yes… why yes we do! In fact, we’ve deployed an XAMPP mashup that makes it even easier for developers and designers to work on multiple WordPress projects, try out bbPress, BuddyPress or even take WordPress Multisite with domain mapping for a spin. All on your local box, and cross platform too. Check it out! http://serverpress.com/products/desktopserver/
Nice post- I develop on localhost on my Win7 box using IIS7.5 server (inetpub)& IIS Express
(WebMatrix). Both of these are Windows products which fit well on a Windows computer. My old computer ran Vista & I did use XAMPP on that for my localhost & that was fine but I have no reason to use XAMPP on Win7.
Currently I have a problem with TweetBox not authoring on my localhost IIS7.5 but I hope I will sort this out soon! There are always issues with all these technologies….but there is always a way around the problems!
Happy localhost developing :-)
Hey Richard,
By day I’m a C# developer pretty heavy on Windows, and really love playing with WordPress in the evenings. I have a good friend who uses WebMatrix and loves it! I’ll have to give it a try soon, it looks pretty nice!
Cheers!
I am kinda new to wordpress so being able to develop on my local system and move it the live server is great : and thanks everso for a great product which happens to work most of the time – however I have a specific problem where I moved from one server to another and it did not change the permalinks or settings – whenever I go to change them in the new site it shows the name of the old site (in the browser) – the new site is http://www.lyons-den-carving.com/wordpress and the old site is http://www.frogshollow.com/wordpress
I was wondering if you could email me any suggestions?
Thanks in advance.
Hey Ann,
If you want to go ahead and submit a support ticket at support.lifeinthegrid.com I can work with you so we can get it up and running on your system.
Just spent the morning trying to install an application on my hosting site using MySQL. Found out that it won’t run there, and realize now that I’d be better off with this application running on my local site. Until now I didn’t know where to begin, but your video provides the exact information I need. Well done and thanks!
And after poking around your website for a little while, I think I’ve just discovered a new favorite place. Nice work.
Hey Tip,
Glad the videos were helpful! I think lots of people don’t really know about using WordPress on their own computers, it can definitely allow you to tinker with ideas and try things you normally wouldn’t on a live site. Thanks for dropping by and taking the time to chat!
Cheers!
Wow this really worked. I was able to sync my live site to my local computer. Once I made a child theme, oddly all the live sites widget customization’s disappeared, but then I simply reactivated them in the widgets for them to reappear in the child. Did I miss something on this point?
Now I’d like to upload the new local child, but I’ve never done this at all. Can you please either tell me how or point me to a good tutorial. Everything I’ve seen via Google makes it look needlessly complex.
Thanks for the great tutorial and idea for developing locally.
Corl
P.S. How did you get the two check boxes below with the “Sign me up to your newsletter!” I’ll want one of those.
Hi Corl,
Thanks for stopping by this thread! Wow lots of questions….
1st Question:
Not really sure what happened there…
2nd Question:
For the child theme you might try this:
http://wordpress.org/extend/plugins/one-click-child-theme/
3rd Question:
Here is what I use for the newsletter sign-up:
http://txfx.net/wordpress-plugins/subscribe-to-comments/
Hope that helps!
Hi Cory,
What I mean to ask is how do I upload the entire customized “Package” (WP, Theme, Plugins etc) to a live server once I’ve customized it locally? I’m sure this is very basic, but I’ve just begun and I’m totally confused.
Thanks,
Corl
Hey Corl,
Yeah your right it is a bit involved. Probably not something I could explain in a comment. I’ll try to get a video out that explains the process or at least will try to walk you through it a bit…
Cheers!
Hi Cory,
My production server (Bluehost) uses php version 5.2.17. The localhost Mac OS XAMPP I installed today uses php version 5.3.1.
A.) Do I need to ask Bluehost to upgrade to 5.3.1? (Looks like 5.4.10 is the current “stable” version.)
B.) Can I downgrade my XAMPP php version to 5.2.17? Should I, and if so, do you know a good info link for doing that?
C.) Should I ask Bluehost to upgrade to 5.4.10 and upgrade my XAMPP localhost to 5.4.10? If so, do you know a good info link for doing that?
D.) Why would Bluehost seemingly be so far behind in its php version? When a host upgrades php, is it on a per user-site basis upon request?
Thanks!
Hey Ken,
Looks like Corl answered a good portion of you questions. Thxs Corl! Its technically ok to run different versions. My preference however is to try and keep my development box and my hosted systems at least at the same minor version. So if I’m on 5.3.x at home I usually like to keep my vps/hosted sites at 5.3.x as well. A good host should update the revision number 5.3.x (the x part) automatically if it contains any security holes, which technically on many software projects is what that place holder is reserved for…
Hope that helps!
Hi Ken,
Bluehost lets you select your PHP version, see https://my.bluehost.com/cgi/help/447 If this doesn’t help give them a call and ask.
Best,
Corl
I’m testing Duplicator by transferring a test site on to localhost XAMPP with PHP 5.2.8. I get an installer fail because it is looking for 5.2.17+ yet I see 5.2.8 on one of your demos. All other points on the System Status pass.
Hi Martin,
The 5.2.17 check was probably added a bit after the demo. 5.2.17 is the most stable and secure of the 5.2 builds. If your using anything lower it will have security holes. Also php 5.5 is right around the corner being a one man shop its really to difficult to support so many versions for the Duplicator…
Hope that helps!
Is setting the UAC to none a good idea. Won’t that leave you vulnerable?
Hey Bill,
Thanks for stopping by… If your behind a good firewall, keep good antivirus and have a small network of very trusted users you should be fine. Otherwise on a bigger internal network you might have to consider your options…
Hi Cory,
Great post, and thank you for putting in so much effort to develop a wordpress duplication solution.
Can you please clarify something…
Do we first create an empty wordpress instance at the new location? Or do we simply create a new (empty) database, and the plugin installs wordpress plus everything else?
Assuming we only need to create a new database (and not wordpress), where do we upload the package? Does it go beside the installer script? And do we need to unzip the package first?
And one last thing… what if we want the duplicated instance to live on the same host as the production site, i.e. in a sub-directory called dev, will there be any conflict or risk?
Thanks again, Ross.
Hey Ross,
Thanks for stopping by… I think all of your questions or at least most of them can be answered here:
http://lifeinthegrid.com/duplicator-quick
You don’t need to unzip the file it should do it for you…
For the last question I would avoid doing dev work on a production server, but if you do all you should have to do is change the paths of the url and the file system… Be sure to always have backups of all your data just in case you run into issues…
Hope that helps!
Hi Cory,
Thanks for the quick start guide.
When I run the installer it halts on Step 1 and prompts me to download installer.php, have you come across this behaviour before? Any suggestions?
Thanks, Ross.
Hey Ross,
Go ahead and submit a support ticket and we can talk about it in the ticket thread!
support.lifeinthegrid.com
Thxs
What an awesome article! So detailed and easy to follow. I got my development environment all setup yesterday. Thank you!
Everything as you said until I get to the part about where I log on at localhost/ at that point it doesn’t log onto the xamp page, but instead goes to another page (“Welcome” IIS7 Internet Information Service) It does this even if I type localhost/xamp/
I have running but it wouldn’t run on port 80 so I reset it to port 21, 443 and it’s running.
It might be good to mention that I also have microsoft server 2012 installed and microsoft visual studio pro. Would these conflict?
Thanks for any help or advise.
Hi Mike,
Thanks for stopping by… Yeah you will have to stop IIS see this link to do that…
Then if you setup Xampp Apache as a service it should auto-load the next time you restart your computer so that Apache is automatically started and IIS is not…
Hope that helps!
This might be a really silly question, but I am completely blind to the answer at the moment. I am in the pre-install phase on my localhost and my system status indicates that the Root Directory has a problem: “Is Writable” has a [Fail] beside it. What is the appropriate way to fix this?
Thank you in advance! The videos have been extremely helpful and I appreciate the fact that this plugin exists!
Hi Sasha,
Thanks for stopping by… Actually that issue is related to how you have Apache setup. Unfortunately there is never a one size fits all solution for these issues. It tends to change across XAMPP versions and then adding the combination of Operating Systems and it gets pretty crazy on how you can solve the problem… The way to pin point your exact setup is to ask Google with a detailed search… So if your running windows on XAMPP then put a search like “XAMPP make directory writable windows” (clear here).
You will probably come across several solutions. Try each one and then don’t forget to restart Apache (press start/stop in the XAMPP control panel) if you perform any instructions that ask you to edit your httpd.conf file.
Hope that helps!
We encourage users to only leave feedback if it values or encourages the other readers! We don't mind a short sales pitch for a product or your site if the link or text provides HIGH QUALITY content for the community. If your simply just trying to link build then your comments may get removed.
What your own custom image beside all your comments on every website? Sign up for a Gravatar. It free and it's easy!