DSS: PHP und CSS – Grundlagen

Dass man PHP scripte in jede HTML-Datei einbauen kann oder jede Website mit PHP dynamischer machen kann, ist sicher den meisten bekannt. Doch dass man auch Stylesheets mit PHP dynamischer gestallten kann, ist wohl den wenigsten bekannt. Das Ganze nennt sich dann DSS und bedeutet Dynamic Stylesheets

Die Vorteile sind ganz einfach aufzuzählen: Eigentlich sind es die gleichen Vorteile wie PHP in einer HTML-Datei. PHP in CSS macht einen Stylesheet dynamischer und bietet dem Nutzer viele Möglichkeiten zur besseren Übersicht durch Verwendung durch Variabeln oder durch Einfügen anderer Funktionen oder Einstellungen. Ein paar Beispiele werden in anderen Artikeln erläutert. Hier folgen nun die Grundlagen.

Zu erst beginnt man damit, eine ganz Normale PHP-Datei zu erstellen. In unserem Beispiel nenne ich diese mal “style.css.php” und lege sie im gleichen Verzeichnis wie die index-Datei ab. Diese öffnen wir dann und fügen unseren Inhalt ein:

<?php
  header('Content-type: text/css');
  /*
    Hier können nun Variablen, Algorithmen und Funktionen stehen.
  */
?>

  /*
    Hier beginnen dann die ganz normalen CSS-Befehle.
  */

body {
  background-color: #c4c4c4;
}

h1 {
  font-size: 19px;
}

Es ist wichtig, den Inhaltstyp mit “text/css” zu definieren, weil der Server sonst automatisch eine HTML-Datei erkennt.

Im Folgenden mal ein Beispiel, wie man Variabeln in dieser PHP(DSS)-Datei nutzen kann:

<?php
  header('Content-type: text/css');
  $cool = "justify";
  $hintergrund1 = "#ffffff";
  $schriftfarbe = "#c4c4c4";
?>

body {
  background-color: <?=$hintergrund1?>;
}

div {
  color: <?=$schriftfarbe?>;
  border: 1px solid #eeeeee;
}

#menu {
   color: <?=$schriftfarbe?>;
}

#content {
  text-align: <?=$cool?>;
  color: #000000;
}

Bei diesem Beispiel hat man den Vorteil, dass man kleine Änderungen am Design nur einmal eingeben muss. Man möchte eine global festgelegte Schriftfarbe haben, so packt man diese in eine Variabel und ordnet sie den einzelnen Elementen zu. So kann man, wenn man die Schriftfarbe ändern möchte, diese nur in der Variabeldefinition ändern und muss nicht die ganze Datei durchforsten.

In diesem Beispiel wurde die Kurzschreibweise verwendet. <?=$cool?> bedeutet somit <?php echo $cool; ?>.

Nun muss man diese DSS-Datei nur noch in der HTML-Datei (beispielsweise in der index.php) einbinden. Das ganze geht einfach: Man bindet diese PHP(DSS)-Datei wie eine normale CSS-Datei ein:

<link rel="stylesheet" type="text/css" href="style.css.php" />

Eine DSS-Datei ist eine PHP-Datei. Wichtig ist aber dennoch, dass wir beim Dateityp “text/css” eingeben.

Man muss beachten, dass durch DSS das Laden der Seite extrem zunehmen kann. Immerhin kann bzw. sollte der Browser die CSS-Files nicht cachen, wenn man solche Effekte haben willst, wie dynamische Veränderungen. Wie das verbieten des Cachen geht, erkläre ich im Folgenden:

<meta http-equiv="cache-control" content="no-cache" />

Durch das Einfügen des Meta-Tags wird generell dem Browser verboten, die Seite zu cachen.

Die zweite Möglichkeit gibt dem Browser den Befehl, in welchem Zeitraum die Seite neu gecached werden soll. In diesem Fall sind es 0 Sekunden.

<meta http-equiv="expires" content="0">

Ersetzt man die 0 durch beispielsweise eine 60, wird die Cache alle 60 Sekunden. Am besten ist es, wenn man den Cache alle 3 Stunden, also 10800 Sekunden erneuert. So wird das Surfvergnügen nicht durch so lange Ladezeiten gemindert.

Ich hoffe, ich konnte einigen weiter helfen. Es folgen noch weitere Beispiele, die ein paar Vorteile von DSS erläutern und Funktionen vorstellen.