Log in

View Full Version : Resolved How to set, define and change a sites stylesheet via PHP and use the defined value?


gwmbox
12-19-2014, 05:25 AM
Hi all

I have been scouring the net and testing various PHP only methods to enable site visitors to set their preferred style (for example: https://github.com/justnorris/CSS-Style-Switcher, http://stackoverflow.com/questions/17133090/how-to-store-a-name-in-a-cookie-and-echo-it etc), in this case i want to have a selection of either dark or light of which there is a dark.css and a light.css file in addition to a layout.css style sheet, the default will be the light one. Setting it up using that script is easy enough, however ... :)

I want to be able to retrieve a value that defines what style sheet is being use, that could be the name or just a 0 or 1 value, so for example if the default or light is used the value is set to be 0, if the dark style is used the value is changed to 1 (or we can just use light and dark, really makes no difference.

With that value defined I want to use it elsewhere on the page (site) so it loads content specific to the style chosen, but I cannot work out how to get that value and use it, therefore my request for help :)

Thanks
Beverleyh
12-19-2014, 09:46 AM
Something like this should work.

Put this in the <head> section of your web page - the last line echos out a stylesheet so put it where you'd want that to appear;

<?php

$default = 'styles.css'; // define stylesheets
$darkcss = 'dark.css';
$lightcss = 'light.css';

$expire = time()+60*60*24*30; // how long to remember css choice (60*60*24*30 = 30 days)

if ( (isset($_GET['css'])) && ($_GET['css'] == $lightcss) ) { // set cookie for light css
$_SESSION['css'] = $_GET['css'];
setcookie('css', $_GET['css'], $expire);
}

if ( (isset($_GET['css'])) && ($_GET['css'] == $darkcss) ) { // set cookie for dark css
$_SESSION['css'] = $_GET['css'];
setcookie('css', $_GET['css'], $expire);
}

if ( (isset($_GET['css'])) && ($_GET['css'] == $default) ) { // set cookie for default css
$_SESSION['css'] = $_GET['css'];
setcookie('css', $_GET['css'], $expire);
}

if (isset($_COOKIE['css'])) { // check for css stored in cookie
$savedcss = $_COOKIE['css'];
} else {
$savedcss = $default;
}

if ($_SESSION['css']) { // use session css else use cookie css
$css = $_SESSION['css'];
} else {
$css = $savedcss;
}

// the filename of the stylesheet is now stored in $css

echo '<link rel="stylesheet" href="/path/to/styles/'.$css.'">';

?>The filename of the stylesheet is stored in the $css variable so you can use this to insert style-specific content;

<?php if ($css == 'styles.css') { ?>
<p>DEFAULT CONTENT</p>
<?php } ?>

<?php if ($css == 'dark.css') { ?>
<p>DARK CONTENT</p>
<?php } ?>

<?php if ($css == 'light.css') { ?>
<p>LIGHT CONTENT</p>
<?php } ?>

And these would be the links to switch / change stylesheets;

<a href="?css=<?php echo $lightcss;?>">Light</a>
<a href="?css=<?php echo $darkcss;?>">Dark</a>
<a href="?css=<?php echo $default;?>">Default</a>
Beverleyh
12-19-2014, 04:28 PM
I decided to document this in a blog post: http://www.dynamicdrive.com/forums/entry.php?305-PHP-Stylesheet-Content-Switcher-with-Save-Cookie

More info and alternative uses there.
gwmbox
12-20-2014, 12:50 AM
Wonderful and it works fantastic, many many thanks for your help