Complete Guide to Using Thesis 2 for WordPress. Click Here.

≡ Menu

Step 57: How to install WordPress and Thesis 2 locally using XAMPP


In this step, we’re going to install WordPress and Thesis 2 on our hard drive.  This will give us complete control over a test site where we can test website changes before going live on our real site.  In Step 56 we learned how to set up test posts, pages, and templates for testing small changes.  This can be done on our live site.  However, this may not be ideal for larger scale changes.  For these types of changes we want to test in a separate location, not our live site.  We can do this a couple different ways.  We can buy a domain and set up a test site just the same as we did for our real site.  Or, we can install WordPress and Thesis 2 locally using XAMPP.  This allows us to test our changes without the possibility of the public finding our test site.

Installing XAMPP and WordPress locally on your hard drive

The first thing we need to do is install XAMPP and WordPress on our hard drive.  You can find great instructions for installing XAMPP and WordPress here.  I won’t cover these steps as this author has done a great job.  Pay close attention, there are lots of little steps to this.

If all goes well, you’ll now see a base WordPress install on your local machine.

WordPress localhost install

Navigate to the wp-admin page and sign into your WordPress Dashboard.

WordPress Dashboard localhost

Installing Thesis 2 in our XAMPP localhost WordPress

Refer back to Step 15.  Follow this step to install Thesis 2 in your localhost WordPress.

WordPress Themes Menu

Once you’ve installed Thesis 2, refresh your localhost page and you will now see the default Thesis 2 view.

Thesis 2 localhost

Awesome!  We are now running WordPress with the Thesis 2 theme in localhost mode from our hard drive.

Export and Import WordPress data into our localhost version

OK, we have a full running version of WordPress and Thesis 2 on our hard drive.  Now, let’s add some content.  Instead of creating new content, we can export our live site content and import into our localhost version.

From your live site WordPress Dashboard, navigate to Tools > Export.

WordPress Export Tool

Select “All Content” and click the “Download Export File” button.

WordPress Export Download

Next, in your test site, navigate to Tools > Import.  Select “WordPress”.

WordPress Import Tool

You will be prompted to install the WordPress importer.  Click the “Install Now” button.

WordPress Import Tool Install

Click the “Activate and Run” link.

WordPress Import Install Plugin

Click the “Choose File” button and navigate to the folder where you downloaded your WordPress Export file.  Select the file, then click the “Upload file and import” button.

Import WordPress

Next, you will be given the option to import the author or create a new author as well as the ability to assign the imported posts to a different author.

You can also choose to “Download and import file attachments” which will attempt to copy over the media files from your live site.  I chose not to do this since I have over 500 images at this time.  If you don’t choose this option, you media files will be linked from your live site.  Click the “Submit” button.

Import WordPress Submit

After the import completes, navigate to your localhost home page and you’ll see your content.  Note that your attachments and media have not been copied over.  They are being served from your live site.  This is fine, we don’t need the original media in our local install for testing changes.  We can always create new posts and pages and upload local media to our localhost site if needed.

WordPress Import Success

You can delete the WordPress “Sample Page” and “Hello World” post as we have loaded our own content.

Exporting and Importing Thesis 2 Skin

As you can see above, our site is in the default Thesis 2 format.  We don’t see the Thesis 2 customization we’ve been working so hard on.  In order to test changes, we want to download our current skin and import it into our localhost version.

Navigate to the Thesis Skin Editor > Manager page on your live site.  If you haven’t created a Thesis 2 Skin backup in a while, click the “Create New Backup” button.  Select the backup you want and click the blue “Export” button.

Thesis 2 Skin Export

Check all the boxes, if they aren’t checked by default.  Then click “Export Skin”.

Thesis 2 Export Skin

In your localhost WordPress, navigate to Thesis > Skin Editor > Manager screen.  Click the blue “Import Skin Data” button.

Thesis 2 Import Skin

Navigate to the location where you saved your exported skin and select the file you exported.  Click the green “Import Data” button.

Thesis 2 Import Data

Click “OK” on the confirmation popup.

Thesis 2 Import Confirmation

Navigate to your localhost home page and you will now see the same look-and-feel as your live site.

Thesis 2 localhost

You will notice that your background image and header image hasn’t been imported.  We chose not to pull in media files during the import so these weren’t carried over.  We can always upload our background as we did in Step 28 and our header image as we did in Step 42.

You may also want to perform Steps 6 – 11 of the guide to select the same settings as your live site.  You will also notice that the sidebar widgets are missing.  You will need to recreate these if desired.

That’s it, you’re all done.  You now have a copy of your live site running on your local hard drive for use in testing changes.

About the author: I’m a techie, a gadget geek, a former programmer, and all-around technology nut. Currently I’m a business analyst for a technology company. I love what technology can do for us. I love smartphones and apps for everything. Building sites with Thesis 2.0 and WordPress help me to reconnect with the feeling of building something tangible.

I’m on: Google+ and Twitter

{ 0 comments… add one }

Leave a Comment