Viele ambitionierte Webmaster liebäugeln mit dem Stil-Wechsel auf Knopfruck. Die Profi-Alternative zum unberechenbaren, weil abschaltbaren, JavaScript setzt auf serverseitiges Scripting mit PHP, die schaltet immer.
Wir brauchen ein PHP der Version 4.2 oder höher, in 90 % der Fälle sollte das erfüllt sein – register globals müssen off sein, trans-sid gehört aktiviert (enabled). Die Einstellungen am besten vorher mit <?php phpinfo(); ?> überprüfen – Änderungen nimmt man in der php.config vor, wer da nicht selbst drankommt sollte bei seinem Hoster nachfragen.
Profi-Styleswitcher mit PHP.
Live Demo im neuen Fenster: PHP-Styleswitcher
Die PHP-Version unterscheidet sich für den Benutzer auf den ersten Blick nicht besonders vom JavaScript-Modell – einzig sichtbarer Unterschied, der Stylesheet-Wechsel muss mit wechseln bestätigt werden. Zur Demonstration nehmen wir die selben Stylesheets. Den ausgewählten Stil speichen wir in einem Session-Cookie, er bleibt über die ganze Website erhalten.
Die gesamte Schalt-Automatik steckt in dem Skript switch.php:
<?php
if(isset($_GET['css'])){
switch ($_GET['css']) {
case 'css0':
$stylesheet = '<link href="default.css" type="text/css" rel="stylesheet">';
$_SESSION['csschanger']=$stylesheet;
break;
case 'css1':
$stylesheet = '<link href="eins.css" type="text/css" rel="stylesheet">';
$_SESSION['csschanger']=$stylesheet;
break;
case 'css2':
$stylesheet = '<link href="zwei.css" type="text/css" rel="stylesheet">';
$_SESSION['csschanger']=$stylesheet;
break;
case 'css3':
$stylesheet = '<link href="drei.css" type="text/css" rel="stylesheet">';
$_SESSION['csschanger']=$stylesheet;
break;
default:
$stylesheet = '<link href="default.css" type="text/css" rel="stylesheet">';
$_SESSION['csschanger']=$stylesheet;
} } ?>
Die verwendeten Stylesheets (eins.css, zwei.css …) werden als case css0 bis css3 eingegeführt. Hier ist die richtige Stelle um eigene Stylesheets mit aussagekräftigen Namen ins Spiel zu bringen. Der erste Eintrag sollte immer case ‚css0‘ mit dem Default-Stylesheet default.css sein. Im letzten Eintrag default wiederholen wir die Ernennung zum Default-Stylesheet (aus Gründen der erhöhten Browser-Kompatibilität). Angepasst und abgespeichert kommt unser Skript als switch.php auf den Server.
<?php session_start(); ?>
<?php include("switch.php"); ?>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html>
<head> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Styleswitcher - PHPModell</title>
<?php echo ($_SESSION['csschanger'])? $_SESSION['csschanger']:
'<link href="default.css" type="text/css" rel="stylesheet">' ;?>
<link rel="alternate stylesheet" type="text/css" title="eins" href="eins.css">
<link rel="alternate stylesheet" type="text/css" title="zwei"href="zwei.css">
<link rel="alternate stylesheet" type="text/css" title="drei" href="drei.css">
</head>
Beim Einbau gehören die beiden Zeilen <?php session_start(); ?> <?php include(„switch.php“); ?> ganz an den Anfang – ohne Leerzeichen davor, oder Leerzeilen, nichts – keine unübliche Fehlerquelle. Für den ersten Seitenbesuch rufen wir das Default-Stylesheet mit ?php echo … (s.o.) auf. Die alternate stylesheets sind für den Schalter im engeren Sinne nicht notwendig – in vielen Browsern ist das Stylesheet-Switching damit auch ganz ohne Extra-Schalter möglich:
Stylesheet-Wechsel bei Firefox.
Die Schalterkonstruktion für ein Dropdown-Menü gehört in den body:
<form name="form1" method="get" action="<?php echo $_SERVER[PHP_SELF];?>">
<select name="css">
<option value="css0">Default</option>
<option value="css1">eins</option>
<option value="css2">zwei</option>
<option value="css3">drei</option>
</select>
<input type="submit" value="wechseln">
</form>
Bei den einzelnen Optionen finden wir value css1 bis css3 wieder, die kennen wir als case aus dem Skript switch.php.
Auch ein Schalteraufbau aus reinen Links ist denkbar:
<A href="<?php echo $_SERVER['PHP_SELF']; ?>?css=css0">default</a><br />
<A href="<?php echo $_SERVER['PHP_SELF']; ?>?css=css1">eins</a><br />
<A href="<?php echo $_SERVER['PHP_SELF']; ?>?css=css2">zwei</a><br />
<A href="<?php echo $_SERVER['PHP_SELF']; ?>?css=css3">drei</a><br />
Mit css0 bis css3 sprechen wir alle in switch.php angegeben Stylesheets direkt an. Die Link-Schalter werden beim Anklicken sofort wirksam.
Durch die Programmierung werden aus statischen HTML-Seiten dynamische PHP-Webseiten. Mit der entsprechenden Endung (.php) gehören sie auch abgespeichert und auf den Server geschickt. Auch beim Verlinken der Seiten untereinander ist auf die neue Endung zu achten. Den kompletten Quelltext und alle Beispiel-Stylesheets zum sofort Loslegen gibt es wie immer im Paket zum Download:
Material zum Artikel:
- Beispiel im ZIP-Archiv zum Download
Erstveröffentlichung 15.09.2006
Eine Antwort zu „Stylesswitcher – PHP-Modell“
— was ist Deine Meinung?
Ein toller Beitrag zum Thema PHP Switcher … nur wo ist die ZIP Datei zu finden??