How to set, define and change a sites stylesheet via PHP and use the defined value?

Printable View

12-19-2014, 05:25 AM
gwmbox

How to set, define and change a sites stylesheet via PHP and use the defined value?

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/1...ie-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
12-19-2014, 09:46 AM
Beverleyh

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 Code:

<?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 Code:

<?php if ($css == 'styles.css') { ?> DEFAULT CONTENT <?php } ?> <?php if ($css == 'dark.css') { ?> DARK CONTENT <?php } ?> <?php if ($css == 'light.css') { ?> LIGHT CONTENT <?php } ?>

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

PHP Code:

<a href="?css=<?php echo $lightcss;?>">Light</a> <a href="?css=<?php echo $darkcss;?>">Dark</a> <a href="?css=<?php echo $default;?>">Default</a>
12-19-2014, 04:28 PM
Beverleyh

I decided to document this in a blog post: http://www.dynamicdrive.com/forums/e...th-Save-Cookie

More info and alternative uses there.
12-20-2014, 12:50 AM
gwmbox

Wonderful and it works fantastic, many many thanks for your help