Skrobiąc dzisiaj swoją stronę napotkałem pewien problem, który teoretycznie mógłby wymagać stworzenia kilku różnych arkuszy styli. Załóżmy, że mamy stronę, której każda podstrona jest utrzymywana w innej kolorystyce. Oczywiście nie jest problemem stworzyć takie arkusze, jednak przy najdrobniejszej modyfikacji musimy uwzględnić ją we wszystkich plikach, a to już może być z lekka dokuczliwe.
Problem można rozwiązać badzo prosto w przypadku, gdy mamy na serwerze dostęp do PHP. Załóżmy, że mamy następujący szablon Smarty:
{if $DZIAL eq "oferta"}
<link rel="stylesheet" type="text/css"
href="./style.php?main=blue&second=red" />
{elseif $DZIAL eq "sklep"}
<link rel="stylesheet" type="text/css"
href="./style.php?main=green&second=blue" />
{elseif $DZIAL eq "onas"}
<link rel="stylesheet" type="text/css"
href="./style.php?main=red&second=green" />
{/if}
Jak widać, skrypt
style.php jest odpowiedzialny za wygenerowanie arkusza CSS. Informacje, w tym przypadku o kolorystyce, przekazujemy za pomocą zmiennych.
Plik
style.php w większości przypadków będzie wyglądać tak jak zwykły CSS. Jednak na samym jego początku trzeba wysłać jeden nagłówek:
<?php header ('Content-Type: text/css'); ?>
Na brak nagłówka odporny jest IE co oczywiście o nim dobrze nie świadczy, mimo, że akurat w tym momencie piszący strony pod niego nie będą narzekać. Firefox zaś zachowuje się tak jak powinien i jeśli nie otrzyma nagłówka to po prostu nie zaaplikuje stylu z nieznanego typu pliku.
Po zabiegach z nagłówkami możemy przystąpić do tworzenia styli. Sposób zapisu nie różni się niczym od zapisu zwykłego CSS'a. Jednak w pewnym momencie dochodzimy do miejsca, gdzie chcemy dynamicznie wygenerować dane. Możemy to zrobić w następujący sposób:
#navcontainer a:hover, #active a:link, #active a:visited {
background:
<?php
switch ($_GET['main'])
{
case 'blue' :
print '#0fb6ed';
break;
case 'red' :
print '#ff3d33';
break;
case 'green' :
print '#bde24e';
break;
}
?>
url('gfx/new/ground_dot_<?php echo $_GET['second'] ?>.gif');
}
#active a:hover {
background-color :
<?php
switch ($_GET['second'])
{
case 'blue' :
print '#0fb6ed;';
break;
case 'red' :
print '#ff3d33;';
break;
case 'green' :
print '#bde24e;';
break;
}
?>
}
Jak widać, metoda całkiem przyjemna i pokazująca, że PHP można wykorzystać do ułatwienia sobie życia w wielu miejscach.
Kategorie:
Webdesign
