Loading...   Upload Image

Style SwitcherTutorials » PHP/MySQL Tutorials » Style Switcher

Verfasst von Alice am 20.03.2007 - wurde schon 5789 mal gelesen

Kategorie: PHP/MySQL
Bewertung:
9x bewertet
Schwierigkeit: einfach
Kommentare: [ 7 ]

keine ...

Style Switcher - Tutorial

Hier moechte ich euch zeigen wie ihr einen einfachen Stylesheet-Wechsel mit Php erzeugen koennt.

Ich verwende hier eine Session, es waere zwar auch mit Cookies umsetzbar, jedoch hat nicht jeder Cookies aktiviert.

Als erstes muss ganz zu Beginn die Session gestartet werden,
die muss noch vor allen Ausgaben geschehen.

Mit session_start(); wird die Session gestartet.

Danach brauchen wir eine If-else Abfrage, diese checkt ob die Get-Varibale $_GET['style'] gesetzt ist,
ist die Get-Variable vorhanden, so wird der Inhalt dieser Variable mittels $_SESSION['style'] = $_GET['style'];
in die Session geschrieben.
Sollte die Get-Variable nicht vorhanden sein, so ist elseif an der Reihe.
Elsif prueft ob die Session $_SESSION['style'] vorhanden ist,
wenn das nicht der Fall ist, dann wird mit $_SESSION['style'] = 'standard'; das standard Stylesheet,
in diesem Fall traegt diesen den Namen haupt, ausgewaehlt.

Code:
<?php
session_start
();

if (isset(
$_GET['style'])) {
    
$_SESSION['style'] = $_GET['style'];
} elseif (!isset(
$_SESSION['style'])) {
    
$_SESSION['style'] = 'haupt';
}
?>


Damit das Stylesheet wechseln kann, brauchen wir den <link> Tag,
dieser bekommt das Attribut rel="" zugewiesen, welcher die Dateibeziehung angibt.
Hinzukommt das Attribut typ="" welches den Typ des Verknuepfungsziels angibt und
natuerlich noch das Attribut href="" welches den Vernuepfungspfad angibt,
wir geb jedoch nicht den Pfad des externen Css's an,
sondern lassen un stattdessen den Inhalt der Session $_SESSION['style'] ausgeben.

Den <link> Tag definieren wir denmach wie folgt:

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


So nun brauchen wir nur noch die Links mit denen wir die unerschiedlichen Styles steuern koennen.
Dazu benoetigen wir den <a> Tag, welcher das Attribut href="" bekommt,
als Verweisziel lassen wir uns mit der Server Variable $_SERVER['PHP_SELF'] den aktuellen Pfad ausgeben,
an den wir mit '?' die Variable style dranhaengen, der Wert der Variable Style gibt den Namen der CSS Datei an.
Mit dem Attribut title="" bekommt der Link nun noch eine Beschreibung.

So sollte der Link ausschauen:

Code:
<a href="<?php echo $_SERVER['PHP_SELF']?>?style=blue" title="Change the stylesheet to have a the blue style">


Hier wuerde also nun das Stylesheet, welches blue.css heisst mit aufgerufen werden.

Wir koennen die Stylesheet-Auswahl auch mit einer Dropdown Liste gestalten,
diese sollte dann wie folgt aussehen:

Code:
<form action="<?php echo $_SERVER['PHP_SELF']?>" method="post">
<select name="style">
<option value="blau" selected>hier wird das Stylesheet mit dem namen blau.css geladen</option>
<option value="rot">hier wird das Stylesheet mit dem namen rot.css geladen</option>
<option value="gelb">hier wird das Stylesheet mit dem namen gelb.css geladen</option>
</select>
<input type="submit" value="Go">
</form>


Dann braucht der obere Code aber noch eine zuaetzliche If-Abfrage,
der Code muesste dann lauten

Code:
<?php
session_start
();

if (isset(
$_POST['style'])){
    
$_SESSION['style'] = $_POST['style'];
}else{
    if (isset(
$_GET['style'])) {
        
$_SESSION['style'] = $_GET['style'];
    } elseif (!isset(
$_SESSION['style'])) {
        
$_SESSION['style'] = 'standard';
    }
}
?>

Kommentar schreibenHinterlasse einen Kommentar

Du musst angemeldet sein, um einen Kommentar zu hinterlassen...

Du bist noch kein Mitglied von Alice-Grafixx.de?
Dann kannst du dich hier kostenlos registrieren ...


Affiliates:   The Seduction  •   Gallery Yuri  •   Design Grafixx  •   Pat DG  •   Colorful Gfx  •   Blue-Graphics  •   Chibi Graphics  • Show all ...
designenlassen.de - Der Design-Marktplatz für Webdesign, Logo-Design, Flyerdesign u.v.m.        ALL-INKL.COM - Webhosting Server Hosting Domain Provider