Loading Themes based on Cookies

Hi everyone,
I’m looking to have a site that will load a theme depending on cookies that has been set previously. The cookie will be set on the server side.
I need to…

  1. See if user has cookie already
  2. load theme depending on which cookie the user has
  3. if no cookie load a different page

I have a small idea about how to set the cookies, but have no idea how to load a wordpress theme depending on those cookies.
Is there a function in wordpress that loads themes…

Any help appreciated. Thanks

It depends on what you mean by theme, if you just want to switch out the stylesheet, or if you want to change the currently active theme for that user.

Well, imagine it’s a sports website that changes depending on the team you choose. It will change the stylesheet but I think I will have headers and logos and background that will all need to change.

You could probably change all that with the stylesheet though… so should be relatively straight forward.

The line you’d need to change in your theme’s header.php is:


<link rel="stylesheet" type="text/css" media="all" href="<?php bloginfo( 'stylesheet_url' ); ?>" />

And change it to something like


<link rel="stylesheet" type="text/css" media="all" href="<?php echo get_template_directory_uri(); ?>/<?php echo $stylesheet; ?>" />

Of course you have to get the cookie value and determine which value to put in to $stylesheet.

You might also find a theme switcher plugin helpful if your needs grow beyond this.

Hmm, you’re probably right.
Ok, so bare with me here, but something like this…

<?php
setcookie("themeChoice","$blue","3600*7"); ?>

<?php
if (isset($_COOKIE['themeChoice']))
	{
    $blue = $_COOKIE['themeChoice'];
	<link rel="stylesheet" type="text/css" media="all" href="<?php echo get_template_directory_uri(); ?>/<?php echo $bluestylesheet; ?>" />
    }
    else
    {
    $red = $_COOKIE['themeChoice'];
    <link rel="stylesheet" type="text/css" media="all" href="<?php echo get_template_directory_uri(); ?>/<?php echo $redstylesheet; ?>" />
}
?>

Something like that?
But how would I change the non stylesheet (jpegs etc) with this method?

That’d be fairly close. If you only have two style choices, I’d build the choice like this:


$stylesheet = $redstylesheet;

if ( isset($_COOKIE['themeChoice'] && $_COOKIE['themeChoice'] == $blue ) {
    $stylesheet = $bluestylesheet;
}

Of course, here the red stylesheet is the default here, you can swap those around if you need to.

With regards to changing images, if the images are part of the design, they can probably be in the stylesheet … otherwise you might need to resort to actually having two themes.

Wow, that actually makes sense to me! The stylesheet is red, if there is a cookie set, and the cookie is blue, change stylesheet to blue!
Awesome thanks a lot John!
I will only have 2 choices so that is probably the way to go.
I guess I can have my header and such as backgrounds in a div etc. I haven’t developed for some time now, is that common practice/frowned upon?

The only thing left now is being able to set the cookie upon a click of the images on that original page I created.

is:

<a href="index.php"><?php setcookie("themeChoice","$blue","3600*7"); ?>Blue</a>

possible?

Yeah, for sure. You can base this off a GET parameter.
e.g.


<a href="index.php?setTheme=blue">Blue</a>
<a href="index.php?setTheme=red">Red</a>

Then in the same place where you check for cookies:


$theme = "red";

// the reason we're not merging the if statement here is because we don't *always* want to set the cookie, 
// only when we're switching the theme over.
if ( isset($_GET['setTheme']) )
  if ($_GET['setTheme'] == "blue") {
    //set the cookie to blue
    $theme = "blue";
  }

  setcookie("themeChoice","$theme","3600*7");  
}


$stylesheet = $redstylesheet; 

if ( isset($_COOKIE['themeChoice'] && $_COOKIE['themeChoice'] == "blue" ) { 
    $stylesheet = $bluestylesheet; 
} 

(P.S. this code is totally untested :p)

My general rule about images etc. is that if they are “design elements” and can go in the stylesheet, then that’s where they go, if they are content, then they need to be inserted with <img> tags. (Just a general rule, exceptions could exist depending on the situation).

@AussieJohn; you are an absolute legend!
Not only have you helped me with JS but also the PHP - I lavish my praise upon you!
I’m at work at the moment, and get the internet at my new place on Saturday - then I’ll put this into real practice. It’s going to be fun I know it!
I can’t thank you enough!

I guess the only thing in the back of my mind now(and isn’t so important) is how I can have the landing page and the index both be ‘index.php’ - if you know what I mean. I really like neat links. Coming from say google > load landing page (make choice) > go to index.php etc… I don’t know if this is the best way to do it though.

Again thank you for the help!

@bo5ton: are you saying if somebody did a search, and clicked your link, you want them to sent to a holding page that asks red or blue then go back? I haven’t used cookies before, but here is how with sessions.

In header.php.


  session_start();
  if(!isset($_SESSION['theme'])){
   $this_url = 'YourDomain'.$_SERVER['REQUEST_URI'];
   $_SESSION['this_url'] = $this_url;
   header("Location:login.php"); //login.php is whatever holds your check
} 

the file holding your check, would look like: I am assuming it is a basic drop down


  session_start();
  if(isset($_POST['theme'])){ //check if it was set
    if($_POST['theme'] === 'blue'){ //check if blue was picked
       // set blue stylesheet
    } else {
       // set red stylesheet
  }
       $_SESSION['theme'] = $_POST['theme'];
      header("Location:".$_SESSION['this_url']); //redirect to landing
}

@rguy84 & @AussieJohn
This is my feeble attempt. But I’m getting an unexpected curly bracket ‘{’ on line 11…

<?php 
//sets the variable theme to null (i hope)
$theme = "";
//checks if setTheme in address bar or cookie has been set
	if (isset ($_GET['setTheme']) || isset($_COOKIE['themeChoice'])) {
		//if either value is blue
		if (($_GET['setTheme'] == "blue") || ($_COOKIE['themeChoice'] == "blue")) {
			//set theme variable to blue
			$theme = "blue";
		//if either value is red
		} else { (($_GET['setTheme'] == "red") || ($_COOKIE['themeChoice'] == "red")) {
		//set theme variable to red
			$theme = "red";
		
		}
	//set cookie for theme for next visit
	setcookie("themeChoice","$theme","3600*7");
	
}
//if the variable is empty (user hasn't come from choicePage nor has a cookie set) go to choicePage
	if($theme == ""{
	header("Location:choicePage.php");
	}

}  

?>

and for the stylesheet:

<link type="text/css" rel="stylesheet" href="css/<?php $theme?>.css">

Again, this is one of my first attempts at original php…
It should probably be set for the session as well, so if they have cookie’s disabled and the address bar changes it still works…

Your extra bracket is on this line

 } else [COLOR=#ff0000]{[/COLOR] (($_GET['setTheme'] 

That’s what I thought, but then the error says it’s the other curly: { on line 11.

Oh yeah whoops, you’ll need to change it to an elseif statement


~via Tapatalk

Oh my goodness! It works!
Ta daaaaa
Now onto design!

Thanks so much guys, I shall give you credit and a backlink when it’s finished!

Could I set the theme for the session as well?
Because when a user navigates to a page without ?setTheme=red the css won’t load I don’t think?
This is exciting, knowing I can echo things out I can change the logo on top and everything!

Thanks again for all your help John,
I’ve been attempting setting the themes with sessions with no luck and really no idea what i’m doing.
do you think it’s worth it or those without cookies enabled can just suffer?

<?php
//start the session
session_start();
//sets the variable theme to null (i hope)
$theme = "";
//checks if setTheme in address bar or cookie has been set
	if (isset ($_GET['setTheme']) || isset($_COOKIE['themeChoice'])) {
		//if either value is blue
		if (($_GET['setTheme'] == "blue") || ($_COOKIE['themeChoice'] == "blue")) {
			//set theme variable to blue
			$theme = "blue";
		//if either value is red
		} elseif (($_GET['setTheme'] == "red") || ($_COOKIE['themeChoice'] == "red")) {
		//set theme variable to red
			$theme = "red";
		}
	//set cookie for theme for next visit
	setcookie("themeChoice",$theme, time()+3600*7);
	//set session theme
	$_SESSION['themeChoice'] = $theme;
		
}
//if the variable is empty (user hasn't come from choicePage nor has a cookie set) go to choicePage
	if ($theme == ""){
	header("Location:choicePage.php");
	} 

?>

To be honest, I haven’t done a whole lot of PHP in a year or so, so I would look at the PHP forum here. Something in my gut says Cookies and sessions either don’t play nicely or are overkill to do both. What you could do is:
if(cookie exsists =true){
session = cookie
//.do stuff in session
} else {
// start session
// set vars off session
// create and put cookie based off the session
}

Ok, so I’ve been working on this a little bit more and it’s nearly up to where I want it. Have a look in the code comments to see how it works.
The only thing I’m worrying about is people with cookie’s turned off. Although i think this will only affect around 3-5% of users. When people have cookie’s turned off, can session cookies still be used?

<?php

$theme = "";
//checks if setTheme in address bar or cookie has been set
if (isset ($_GET['setTheme']) || isset($_COOKIE['themeChoice'])) {
	//if either value is blue
	if (($_GET['setTheme'] == "blue") || ($_COOKIE['themeChoice'] == "blue")) {
		//set theme variable to blue
		$theme = "blue";
	//if either value is red
	} elseif (($_GET['setTheme'] == "red") || ($_COOKIE['themeChoice'] == "red")) {
	//set theme variable to red
		$theme = "red";
	}
//if theme is already set and user has opted to change their current theme
if ($theme == "blue" && isset($_GET['changeTheme'])) {
		$theme = "red";
} elseif ($theme == "red" && isset($_GET['changeTheme'])) {
	$theme = "blue";
}
//set cookie for theme for next visit
setcookie("themeChoice",$theme, time()+3600*7);
}
	
//if the variable is empty (user hasn't come from choicePage nor has a cookie set) go to choicePage
if ($theme == ""){
header("Location:choicePage.php");
}

?>

Once this is implemented into Wordpress I will also need to change…

<a href="index.php?changeTheme">Choose a New Theme</a>

…so that whichever page the user is on they can swap it, and not be directed to the index everytime.

You can see it in action here.