The following is a quick way to switch Wordpress styles just by using a URL variable and a cookie. Actually this can be used for any site. I needed to be able to allow users to view one of my sites in plaintext, without a lot of complex CSS in order to be more browser friendly.
First thing you do is open up your header.php file in the theme of your choice.
At the very top, before any other code, paste the following:
<?php
$getstyle = $_GET['css'];
if ($getstyle == "plaintext"){
setcookie("style_cookie", "plaintext");
header("Location: http://www.your-site-url.com");}
?>
To break this down for you real quick like, the first line is the variable which will contain the value of the URL variable that is passed. Line 2 says that if the value of this URL variable is “plaintext” then to proceed to the next line. Line 3 sets a cookie called “style_cookie” with a value of “plaintext.” Line 4 simply resets the page with the cookie in place, otherwise even after sending that URL variable, the user would have to manually refresh the page to see the result. Make sense?
Now that we have a cookie set called “plaintext” we’re ready to proceed. Notice when I set the cookie up in the previous code I didn’t use an expiration value? This will by default cause the cookie to die once the user closes the browser, which is what I want. If you want to set this cookie for any different length of time feel free.
In the header.php file in wordpress, you will see the following line:
<link rel="stylesheet" href="<? php bloginfo('stylesheet_url'); ?>" type="text/css" media="screen" /></link>
I will be removing the proprietary wordpress “bloginfo” code for our purposes here to make this tutorial a little more user friendly you non-wordpress folk. We can’t use this code anyway with my hack since it won’t be integrating with the wordpress control panel.
Anyway, remove the line above and replace it with the following:
if ($_COOKIE['style_cookie'] == "plaintext")
{
echo "<link rel=\"stylesheet\" href=\"http://www.your-site-url.com/wp/wp-content/ themes/yourtheme/plaintext.css\" type=\"text/css\" media=\"screen\" />";
}
else
{
echo "<link rel=\"stylesheet\" href=\"http://www.your-site-url.com/wp/wp-content/ themes/yourtheme/style.css\" type=\"text/css\" media=\"screen\" />";
}
The sole purpose of the code above is to write the html that decides which stylesheet will be used. If the “style_cookie” equals “plaintext” then use the plaintext.css stylesheet otherwise use the standard style.css file.
Upload your header.php file to your server and your ready to go. Just use the following as the URL to activate the new plaintext stylesheet:
http://www.your-site-url.com/wp?css=plaintext
For a demo of what the end result is, click this link. To reset to the standard CSS style CLICK HERE.
This code can be tweaked in many ways to allow unlimited .css files to be used. Download my header.php file attached to this tutorial to see how I set it up for this example.
Click filename below to download::
