Style-Switcher

**dkdenz** · 09-09-2004, 12:03

Anleitung für einen Style-Switcher,
im Beispiel um die Schriftgröße zu ändern.

Folgendes vor die Doctype-Deklaration:

Code:

<?php
session_start();
if ( isset($_GET['style']) ) {
$_SESSION['style'] = $_GET['style'];
}
elseif ( !isset($_SESSION['style']) ) {
$_SESSION['style'] = '09em';
}
?>

09em ist die Bezeichnung für das Standart-CSS.
Kann natürlich "wasweissich" heißen.
Zusätzlich braucht man natürlich ein 2. CSS mit anderen Anweisungen.
Beispiel:

Code:

html, h1, p, a { font-size:0.9em; font-family:Verdana,Sans-Serif; } (Bsp: 09em.css)
und 
html, h1, p, a { font-size:1em; font-family:Verdana,Sans-Serif; } (Bsp: 10em.css)

Dann folgendes vor den </head> einfügen:

Code:

<style type="text/css">/*<![CDATA[*/ @import url("<?php echo $_SESSION['style']?>.css"); /*]]>*/</style>

Schließlich die Links zum switchen:

Code:

<a href="<?php echo $_SERVER['PHP_SELF']?>?style=09em">standard</a>
<a href="<?php echo $_SERVER['PHP_SELF']?>?style=10em">gross</a>

Das ganze Dokument sieht dann wie folgt aus:

Code:

<?php
session_start();
if ( isset($_GET['style']) ) {
$_SESSION['style'] = $_GET['style'];
}
elseif ( !isset($_SESSION['style']) ) {
$_SESSION['style'] = '09em';
}
?>
<?
echo '<?xml version="1.0" encoding="UTF-8"?>'
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="de">
        <head>
                <title>switcher</title>
                <link rel="stylesheet" type="text/css" href="minimal.css" />
                <style type="text/css">/*<![CDATA[*/ @import url("<?php echo $_SESSION['style']?>.css"); /*]]>*/</style>
        </head>
        <body>
                     <div class="headline">
                     <h1>&Uuml;berschrift</h1>
                     </div>
                     <div class="menu">
                     </div>
                     <div class="inhalt">
                          <p>Blah blah</p>
                     </div>
<a href="<?php echo $_SERVER['PHP_SELF']?>?style=09em">standard</a>
<a href="<?php echo $_SERVER['PHP_SELF']?>?style=10em">gross</a>
        </body>
</html>

Das Ganze basiert auf Sessions.
Ganz am Anfang wird die Session gestartet und die Website erscheint im Standardstil (09em).
Beim Anklicken des "gross"- Links wird der Stil ausgetauscht und die Seite erscheint mit anderer Schriftgröße (10em).
Dadurch, dass keine Cookies benutzt werden,
wird beim nächsten Besuch wieder das Standard-Design erscheinen.

Habe Fragmente davon im www gefunden,
aber das Ganze zum Laufen zu bringen,
war schon etwas trickey...

Viel Spaß beim Nachbauen...

**dkdenz** · 10-09-2004, 08:10

Oder alternativ:

Code:

<link rel="stylesheet" type="text/css" href="<?php echo $_SESSION['style']?>.css">

**womstar** · 10-09-2004, 12:06

klasse!

vielleicht würde ich nach dem klick auf den link mit dem jeweiligen parameter die seite reloaden ohne den parameter, weil man könnte ja so auch ohne die session arbeiten, sprich nur mit dem parameter spielen.

grüße robert

**bene** · 09-01-2005, 12:47

hallo, ich würde das skript auch gerne benutzen aber ich habe noch 2 externe javascriptdateien die ich passend zum design auch auswechseln will. Gibt es da eine Möglichkeit mit dem skript mehrere dateien auszuwechseln oder die .css-Datei irgendwie mit den .js-Dateien zu verknüpfen?

**museager** · 11-01-2005, 22:32

Zitat von dkdenz

Oder alternativ:

Code:

<link rel="stylesheet" type="text/css" href="<?php echo $_SESSION['style']?>.css">

muss die ganze seite, die diesen code aufruft, in php sein? kann man auch eine startseite machen, auf der die farbe abgefragt wird und dann in normalem html weitermachen? sowas hab ich nämlich vor, eine page bei der man am anfang die farbe auswählt. nur ich brauche aufgrund der bilder 3 bzw. 2 verschiedene css-files, will aber nicht auch jede inhaltsseite 3-fach anlegen für die verschiedenen farben. wie geht das (mit möglichst wenig php denn damit hab ich mich bisher noch 0 beschäftigt)?

**museager** · 12-01-2005, 19:00

ich will ja nicht nerven..aber mir ist das verdammt wichtig, sonst komm ich mit der ganzen site nicht weiter, das währe sehr blöd

ich hoffe mir kann geholfen werden, wenn nicht, dann sagt's wenigstens, sonst warte ich ja noch ewig..

**bine** · 17-01-2005, 17:40

@museager: schaust du hier den style switch mal an, da darf man sich auch den code ziehen.
CSS-Style-Switch

@bene: Ich denke man wird sich in dem Fall auch eine session für das passende javascript einbinden können. Frag mich aber bitte nicht wie.

PS: unten auf der Seite, deren Link ich geposted habe sind auch PHP basierende Style-Switches genannt.

Thema: Style-Switcher

LinkBack

Themen-Optionen

Anzeige

Style-Switcher

AW: Style-Switcher

AW: Style-Switcher

AW: Style-Switcher

AW: Style-Switcher

AW: Style-Switcher

AW: Style-Switcher

Ähnliche Themen

BUTTON Style

Gmx im neuen Style

in PS fehlen Schriftarten

Neuer Style

Matrix Style

Lesezeichen

Lesezeichen

Berechtigungen

Swiper Slide Activ ID auslesen

Swiper Slide Activ ID auslesen

Swiper Slide Activ ID auslesen