CSS Variablen mit PHP

Wenn Leute nach Funktionen gefragt werden, die sie sich für CSS wünschen, kommen immer „Variablen“ zur Sprache. Ob das eine gute Idee ist, darüber bin ich mir persönlich noch nicht im Klaren, aber ich neige eher zum Ja. Unabhängig davon ist es mit PHP trivial einfach, Variablen in CSS zu verwenden. Das ist sicherlich kein neuer Trick, aber ich habe ihn noch nie speziell behandelt, also dachte ich, ich sollte es tun.

Style.php

Anstatt die Dateiendung .css zu verwenden, verwenden Sie .php

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

Content-Type

Am Anfang Ihrer neuen style.php-Datei setzen Sie den Content-Type wieder auf CSS

<?php
    header("Content-type: text/css; charset: UTF-8");
?>

Variablen einrichten

Jetzt können Sie Variablen für alles einrichten, was Sie möchten

<?php
    header("Content-type: text/css; charset: UTF-8");

   $brandColor = "#990000";
   $linkColor = "#555555";
   $CDNURL = "http://cdn.blahblah.net";
?>

Variablen verwenden

Unter all dem PHP-Kram können Sie einfach mit dem regulären CSS-Schreiben beginnen, nur dass Sie etwas PHP einmischen können, um diese Variablen auszugeben.

#header {
   background: url("<?php echo $CDNURL; ?>/images/header-bg.png") no-repeat;
}
a {
  color: <?php echo $linkColor; ?>;
}

...

ul#main-nav li a {
  color: <?php echo $linkColor; ?>;
}

Leistung erweitern / Andere Ideen

• Wenn Sie schon dabei sind, können Sie auch gleich das CSS mit PHP komprimieren.
• Theoretisch könnten Sie den User-Agent abrufen und versuchen, browser-spezifisches CSS zu erstellen, aber das ist voller Probleme und nicht empfehlenswert.
• Rufen Sie Datum/Uhrzeit ab und ändern Sie vielleicht einige Dinge auf Ihrer Website für die verschiedenen Jahreszeiten oder Tageszeiten.
• Generieren Sie eine Zufallszahl, testen Sie das Ergebnis, verwenden Sie es, um ein zufälliges Hintergrundbild für Ihren Header festzulegen.

Funktioniert nicht?

Ich habe eine komplett statische Testseite gemacht und es hat gut funktioniert, dann habe ich die gleiche Technik innerhalb einer WordPress-Site ausprobiert und es hat nicht geklappt. Die Lösung für mich war, die Datei mit dem Namen style.css zu belassen und .htaccess zu verwenden, um sie als PHP zu parsen. Stellen Sie einfach sicher, dass dieser Code in der .htaccess-Datei (nur Apache-Server) auf der gleichen Verzeichnisebene wie die CSS-Datei steht. Dann können Sie PHP darin verwenden, wie Sie es von jeder anderen PHP-Datei gewohnt sind.

<FilesMatch "^.*?style.*?$">
SetHandler php5-script
</FilesMatch>

Carlo DeAgazio schrieb, dass dies bei ihm in WordPress funktioniert

<?php
 $absolute_path = explode('wp-content', $_SERVER['SCRIPT_FILENAME']);
 $wp_load = $absolute_path[0] . 'wp-load.php';
 require_once($wp_load);

  /**
  Do stuff like connect to WP database and grab user set values
  */

  header('Content-type: text/css');
  header('Cache-control: must-revalidate');
?>