Note that there are some explanatory texts on larger screens.

plurals
  1. PO
    text
    copied!<p>Personally I'd use a session variable and not a cookie.</p> <p>Something like this should work:</p> <pre><code>&lt;?php session_start(); // add to the top of your page if (!isset($_SESSION['dark_theme'])) { $_SESSION['dark_theme']==false; } if ($_GET['changetheme']!='') { if ($_GET['changetheme']=='dark') { $_SESSION['dark_theme']=true; } else { $_SESSION['dark_theme']=false; } } ?&gt; </code></pre> <p>This bit, place where you want the link:</p> <pre><code>&lt;?php if(!$_SESSION['dark_theme']){ ?&gt; &lt;a href="?changetheme=dark" id="darken"&gt;Make it Dark&lt;/a&gt; &lt;? }else{ ?&gt; &lt;a href="?changetheme=light" id="lighten"&gt;Make it Light&lt;/a&gt; &lt;? } ?&gt; </code></pre> <p>Or do it using CSS+JavaScript:</p> <p>The HTML:</p> <pre><code>&lt;a href="#" id="darken"&gt;Make it Dark&lt;/a&gt; &lt;a href="#" id="lighten"&gt;Make it Light&lt;/a&gt; </code></pre> <p>The CSS:</p> <p>In your "dark" stylesheet:</p> <pre><code>#darken { display:none; } </code></pre> <p>In your "light" stylesheet:</p> <pre><code>#lighten { display:none; } </code></pre> <p>JavaScript (note, I'm using JQuery as it's much easier to write than normal JS - just you'll need to include JQuery if it's not already on the site):</p> <pre><code>(function($, undefined) { $('#darken').click(function() { $(this).preventDefault(); // stops the link from functioning as a link chooseStyle('none', 60); //call your change stylesheet function $('#darken').hide(); //hide the dark link $('#lighten').show(); // show the light link }) $('#lighten').click(function() { $(this).preventDefault(); // stops the link from functioning as a link chooseStyle('none', 60); //call your change stylesheet function $('#lighten').hide(); //hide the light link $('#darken').show(); // show the dark link }) })(jQuery); </code></pre>
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload