How to Create a WordPress Theme Demo Site

Sometimes you want to give a remote client a few different options for the same website, and you don’t want to do a lot of back-and-forth with them about it. Besides, some variations are super quick to make but much slower to explain. A demonstration is in order!

The goal is to allow the client to go to the site and sift through several different theme choices that you make available.

The first step is to set up a separate WordPress site for this purpose. You could use the client’s own website if it’s not yet “live”, but I would advise using one of your own properties, making sure to un-tick the checkbox for “Make my site searchable by Google, Technorati, etc.”

(By the way, setting up WordPress itself is outside the scope of any of my articles; if you’re reading my blog, you’re probably pretty well beyond that.)

I have a “site layout demo” set up on a subdomain of wordpressconsultant.net (with its own WordPress installation, not a WP multisite sort of thing).

Next, install the themes you’ll be making available. If it’s variations on one theme, make sure they’re all different folders in the /wp-content/themes directory and that their meta-information in style.css contains different names from one another (otherwise your client’s going to be choosing from a maze of twisty themes, all named alike). Choose one to Activate, and then you’re done with that step.

Now we’re going to grab two excellent plugins that save us a hell of a lot of time.

The first is WP Example Content. This handy-dandy plugin allows you to deploy dummy content containing all of the typography gymnastics the client is likely to want to check out. Thoughtfully, the plugin gives you a button to instantly retract and make disappear these content-less posts and plugins at a moment’s notice.

The second plugin we want is Theme Switcher Reloaded, which provides a widget that creates a list of themes available for the website viewer to switch between.

The sad thing, though, is that when you load in a different theme, you lose your widget options and can no longer see the Theme Switcher Reloaded list in the new theme’s sidebar. Whoops!

Now you have two options. You could deploy the following code into every sidebar.php of every theme you’re displaying (changing html tags as appropriate):
<?php if (function_exists(‘wp_theme_switcher’)) { ?>
<h3><?php _e(‘Themes’); ?></h3>
<ul>
<?php wp_theme_switcher(‘dropdown’); ?>
</ul>
<?php } ?>

OR… You could create a Page that functions as a makeshift Theme Switcher:

Configure the widget on one of the themes and then go load the site in a browser. The list of theme choices will show up in the sidebar (like you told it to do!). Do a control-U to look at the HTML source of the resultant page, and look for the list of theme choices. You’re scouting for an unordered list that has a lot of the following string in its links:

?wptheme=

So now copy everything between the two UL tags, and abscond with it to the site’s dashboard, where you will create a new Page or Post. Paste the pilfered HTML in, hit publish, and voila! You’ve got a “theme switcher” that sticks around between themes.

I went one better and set this new Page to be the content that displays when the root site is loaded. That way it’s always obvious where to find the site layout options.

And that’s it! That’s basically all you need to do to set up a theme demo site within the span of 15 minutes.

Did you find this post useful? Have you done something like this before? Do you think you have a better idea, punk? Let me know!

About The Author

nthmost

Other posts by

Author his web sitehttp://wordpressconsultant.net

25

06 2011

Your Comment