[an error occurred while processing this directive]

Ganz schön bunt

Laden Sie jetzt stimmige Farbwelten für Ihre Webseiten herunter - kostenlos

Hier klicken und mehr erfahren

Schnelle Seiten gefällig?

Befreien Sie Ihre Webseiten mit wenigen Mausklicks von unnötigem Balast

Hier klicken und mehr erfahren

[an error occurred while processing this directive]

(Stand: 27.07.24, Adresse: http://www.grammiweb.de/ssi/ssi24.shtml)

 

Dem Benutzer die Layoutwahl überlassen

Sicher haben Sie schon Webseiten gesehen, bei denen Sie aus verschiedenen Layouts wählen konnten, und bei denen Ihre Wahl dann auch auf allen Unterseiten verwendet wurde.

Dank der Möglichkeit, Parameter mit SSI weitergeben und diese mit Abfragen aufgreifen zu können, können Sie eine solche Interaktion auch auf Ihren Seiten ohne großartigen Aufwand anbieten.

In unserer Demonstration haben wir nur die Text- und Hintergrundfarben berücksichtigt. Natürlich können Sie auch komplette Stylesheets einbinden, Seitenteile auswechseln oder Inhalte variieren.

Im Bodybereich des Quelltextes werden Links dargestellt, die die aktuelle Seite aufrufen und dabei einen Parameter ("css=x") weitergeben. Dieser Parameter wird im Headbereich abgefragt und entsprechend seines Vorhandenseins verarbeitet. So wird bei der Weitergabe von css=1 der Text Rot und der Hintergrund Gelb gefärbt, bei css=2 erhält der Text eine dunkelgrüne, der Hintergrund eine khaki Färbung, und wenn kein Parameter vorhanden ist (also auch beim erstmaligen Aufruf), dann wird der Text Schwarz und der Hintergrund Weiss angezeigt.

Um die Layoutwahl auch auf den Folgeseiten beibehalten zu können, müssen Links um den gewünschten Parameter ergänzt werden. Dies geschieht mit folgendem Zusatz:

<a href="seite.shtml?<!--#echo var="QUERY_STRING" -->">Link</a>

Der Quelltext der Seite (die benötigten SSI-Elemente wurden rot gekennzeichnet):

<html><head>

<!--#if expr="$QUERY_STRING = 'css1'" -->

<STYLE TYPE="text/css">
p { font-family: Arial, Sans-Serif; font-size: 10pt; color: red }
body { background-color: yellow }
</STYLE>

<!--#elif expr="$QUERY_STRING = 'css2'" -->

<STYLE TYPE="text/css">
p { font-family: Arial, Sans-Serif; font-size: 10pt; color: darkgreen }
body { background-color: darkkhaki }
</STYLE>

<!--#else -->

<STYLE TYPE="text/css">
p { font-family: Arial, Sans-Serif; font-size: 10pt; color: black }
body { background-color: white }
</STYLE>

<!--#endif -->

</head><body>

<p>Wählen Sie eine Text- und Hintergrundfarbe:</p>

<p>
<a href="<!--#echo var="DOCUMENT_URI" -->?css1">Rot / Gelb</a><br>
<a href="<!--#echo var="DOCUMENT_URI" -->?css2">Grün / Khaki</a><br>
<a href="<!--#echo var="DOCUMENT_URI" -->">Schwarz / Weiss</a></p>

</body></html>


Zurück zum Inhaltsverzeichnis

[an error occurred while processing this directive] [an error occurred while processing this directive]

© Grammiweb.de Internetlösungen. Alle Rechte vorbehalten. Stand: 27.07.2024
Seitenanfang - Sponsor werden - Datenschutz - Medien - Impressum - Werbung - Hilfe - Kontakt