Loading...   Upload Image

Styleswitch mit ifTutorials » PHP/MySQL Tutorials » Styleswitch mit if

Verfasst von worldgraphics am 30.03.2010 - wurde schon 15672 mal gelesen

Kategorie: PHP/MySQL
Bewertung:
6x bewertet
Schwierigkeit: einfach
Kommentare: [ 4 ]

Tag - Schlagwort PHP Tag - Schlagwort Styleswitch

Styleswitch mit if - Tutorial

In diesem Tutorial zeige ich euch, wie man ganz einfach einen Styleswitch mit if() macht. Der Style bleibt beim Seitenwechsel sogar erhalten!

Was ihr benötigt:
- Werbserver mit PHP
- mind. 2 Stylesheets zum Wechseln


1. Der Switch


Der Switch an sich ist gar nicht mal so schwer. Wir fangen mal mit der Datei 'index.php' an, die auch anders heißen kann, um in dein Layout reinzupassen.

<?php// Variablen abspeichern
$cssstyle = $_GET['style'];

// Style abfragen
if($cssstyle == 'blue') { // Wenn ?style=blue
	$css = 'blue.css'; // css-Datei = blue.css
	$style = 'blue'; // style = blue für die Links
}
elseif ($cssstyle == 'black') { // Wenn ?style=black
	$css = 'black.css'; // css-Datei = black.css
	$style = 'black'; // style = blue für die Links
}
else { // Wenn nichts zutraf, also Standard
	$css = 'default.css'; // css-Datei = default.css
	$style = 'default'; // style = default für die Links
}
?>


Diesen Code kannst du gerne per
<?php include('styleswitch.php'); ?>

includen, sofern du diesen Codeteil als styleswitch.php anbespeichert hast.

Unter diesen Code kommt jetzt ganz normal dein <head>-Bereich mit einer kleinen Ausnahme:

<!--Stylesheet einbinden-->
<!--Du kannst vor das php auch eine Verzeichnisangabe machen, wie "../" oder "/"-->
<link rel="stylesheet" href="./<?php echo $css; ?>" type="text/css" />
<!--/Stylesheet einbinden-->


Dieser Code sorgt dafür, dass beim Parameter "style" der URL auch das STylesheet wechselt.
Jezt mal zum Überblick:

Im ersten Teil haben wir den Parameter "style" in der Variable "cssstyle" gespeichert. Dann haben wir abgefragt, ob der Style blue ist und wenn ja, haben wir in der Variable "$css" den Dateinamen der CSS-Datei abgespeichert.
In der Variable "$style" speicherten wir dann den Stylenamen. Dieser muss exakt der gleiche sein, wie der in dem Teil von if() bzw elseif().

Der zweite Code bindet das Stylesheet ein, indem er den Inhalt der Variable "$css" abfragt, in dem ja der Dateiname unseres Stylesheets,
dass wir per Parameter aufgerufen haben, liegt.

Nun kommen wir zu dem Teil de Links. Beim Ändern der Seite soll ja der Style gleich bleiben. Das erreichen wir durch unsere Variable
"$style". Diese kommt nun zum Einsatz. Ein Link (z.B. in der Navigation) sieht dann so aus:

<a href="dateiname.php?style=<?php echo $style; ?>">Text</a>


Statt "dateiname.php" setzt ihr den Link zur Datei ein, auf die ihr verlinken wollt und auf der der erste und zweite Code gespeichert ist.

Das war's dann auch schon.

Ein Tipp meinerseits:
Den <head>-Code in einer Datei abspeichern und includen. Diese Datei muss dann so aussehen:

<?php
// Variablen abspeichern
$cssstyle = $_GET['style'];

// Style abfragen
if($cssstyle == 'blue') { // Wenn ?style=blue
	$css = 'blue.css'; // css-Datei = blue.css
	$style = 'blue'; // style = blue für die Links
}
elseif ($cssstyle == 'black') { // Wenn ?style=black
	$css = 'black.css'; // css-Datei = black.css
	$style = 'black'; // style = blue für die Links
}
else { // Wenn nichts zutraf, also Standard
	$css = 'default.css'; // css-Datei = default.css
	$style = 'default'; // style = default für die Links
}
?>
<html>
	<head>
		<!--Stylesheet einbinden-->
		<!--Du kannst vor das php auch eine Verzeichnisangabe machen, wie "../" oder "/"-->
		<link rel="stylesheet" href="./<?php echo $css; ?>" type="text/css" />
		<!--/Stylesheet einbinden-->
		<!--Weitere Angaben im <head> außer <title>!-->


Dann müsst ihr auf euren Unterseiten am Anfang nur noch dies einfügen:

<?php include('style.php'); ?>
<title>Euer Titel</title>
</head>


Dann kommt ganz normal euer <body>-Bereich.

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  •   Blue-Graphics  •   Pat DG  •   Design Grafixx  •   Gallery Yuri  •   Chibi Graphics  •   Colorful Gfx  • Show all ...
designenlassen.de - Der Design-Marktplatz für Webdesign, Logo-Design, Flyerdesign u.v.m.        ALL-INKL.COM - Webhosting Server Hosting Domain Provider