Loading...   Upload Image

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

Verfasst von worldgraphics am 30.03.2010 - wurde schon 18402 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 bentigt:
- 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 heien 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 fr die Links
}
elseif ($cssstyle == 'black') { // Wenn ?style=black
	$css = 'black.css'; // css-Datei = black.css
	$style = 'black'; // style = blue fr die Links
}
else { // Wenn nichts zutraf, also Standard
	$css = 'default.css'; // css-Datei = default.css
	$style = 'default'; // style = default fr 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 dafr, 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 fr die Links
}
elseif ($cssstyle == 'black') { // Wenn ?style=black
	$css = 'black.css'; // css-Datei = black.css
	$style = 'black'; // style = blue fr die Links
}
else { // Wenn nichts zutraf, also Standard
	$css = 'default.css'; // css-Datei = default.css
	$style = 'default'; // style = default fr 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> auer <title>!-->


Dann msst ihr auf euren Unterseiten am Anfang nur noch dies einfgen:

<?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 ...


       ALL-INKL.COM - Webhosting Server Hosting Domain Provider