8719 sujets

Développement web côté serveur, CMS

Pages :
Bonjour ma question est très simple , puis je me servir de variable défini grace à php dans une page web dans une feuille de style .css . Du genre récupérer le nom d'un background ou une couleur défini grace à une fonction php . Je n'ai rien trouvé à ce sujet et ca me semble extremement bizzare car je suis persuadé que ca serait ultra pratique Smiley cligne J'attends votre réponse avec impatience Smiley smile

Jacques Dupont(d)
Administrateur
Bonjour,

en toute rigueur (pour éviter les confusions), il n'y a pas de variables et de fonctions PHP dans une page web; il y en a par contre lors de la construction de la page web.
Il est tout à fait possible de générer (écrire sur le DD du serveur) une feuille CSS "à la volée" et d'y faire référence dans la page web en cours (en lui donnant un nom particulier pour éviter que le cache du navigateur se fourvoie) ou bien en l'intégrant directement dans la page web en cours de construction.
Le danger est de compliquer inutilement les choses et le design si c'est pour avoir des dizaines de version des feuilles CSS ... Par contre générer de temps à autre une feuille CSS via une interface d'administration en modifiant à 15 endroits différents la même couleur #abcdef ça ça peut bien simplifier les petites modifications j'imagine.

Felipe
Rien ne t'interdit de faire ça dans ta feuille CSS :

background-image:URL(<?=$mavar?>);

A condition, bien sûr, de nommer ta feuille avec une extension .php au lieu de .css.
Il me semble qu'il faudra de plus utiliser la fonction php header() pour déclarer le document généré comme étant de type text/css. Il doit y avoir un sujet ou deux à ce propos sur ce forum.

Tiens, trouvé ça en googlant :
<?php header("Content-type: text/css; charset=UTF-8"); ?>

Mais mieux vaut trouver une ressource un peu solide (article, tutoriel, documentation) sur la question.

Journal du net : Des CSS dynamiques via PHP
Pas évalué ce que ça vaut.
J'imagine quand même mal les 20 variables dans le link vers le fichier css surtout que certaines de ces variables ce définissent après le header où ce trouve le <link ...

Ce qui m'embete surtout c'est le fait d'envoyer les valeurs à chaque fois , j'aimerai les modifiers une seul fois et qu'elle reste ainsi par la suite , jusqu'a ce que je lui redemande . Ce que je suis en train de créer n'est pas vraiment le fait que chaque visiteur puisse changer et modifier son apparence comme il le souhaite comme vous pouvez l'imaginer . Ce que j'ai crée c'est plus pour que le webmaster à qui je fournirai un site de base puisse régler via par exemple un panneau d'administration toute l'apparence de son site par exemple et que cela s'inscrive dans ca feuille css . J'ai déja trouvé le moyen de le faire mais comme suit et sans feuille de style :

<div class="blabla" style="background : <?php echo $background; ?>"></div> 


evidement c'est pas ce que je préfère Smiley smile

Il serait aussi intéréssant meme pour le webmaster que je suis d'avoir une fonction hautdediv(imagegauche, imagemilieu, imagedroite)
qui ferait :

<div class="hautelement">
    <div class="gauchehautelement">
    </div>
    <div class="milieuhautelement">
    </div>
    <div class="droitehautelement">
    </div>
</div>


et modif css ou ajout :

.hautelement {
  width: 100%;
}
.gauchehautelement {
  float: left;
  width: 5%;
  background: url('<?php echo $imagegauche; ?>') no-repeat top left;
}
.milieuhautelement {
  width: 90%;
  background: url('<?php echo $imagemilieu; ?>') repeat-x top left;
}
.droitehautelement {
  float: right;
  width: 5%;
  background: url('<?php echo $imagedroite; ?>') no-repeat top right;
}

Bien evidement c'est un exemple grossier qui doit contenir des fautes et sans tout le finiolage , mais vous avez le principe de ce que je veux faire . En adoptant cette techique à tout les éléments connus d'une page web moderne de base on pourrait créer très rapidement et modifier aussi rapidement . Qu'en pensez vous ?
Modifié par jacquesdupontd (17 Jul 2006 - 22:07)
Merci mpop tu assures . Je te jure pourtant j'avais googlé et j'avais absolument rien trouvé d'intéréssant . Le lien que tu m'a filé est parfait . Je sais pas si vous l'avez consultez mais donc il explique qu'on peut en changeant l'extension et le link de la page html auquel ce refaire le css en .php au lieu de .css tu peux absolument transformer ta feuille css en feuille dynamique . Il faut par contre insérer :

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

Pour déclarer . Le problème est qu'il va devoir chager la feuille à chaque fois et ne ce servira pas du cache comme quand l'extension était .css puisque désormais il est dynamique (c'est le principe). Il explique à la fin de l'article un moyen de contourner cela en indiquant au naviguateur que le fichier css n'a pas été modifié :

<?php header("HTTP/1.0 304 Not Modified"); ?>

'Le code 304 permet d'indiquer au navigateur que la page n'a pas été modifiée depuis le dernier chargement, et qu'il peut donc utiliser la version stockée dans son cache...'

Je me pose pourtant une question , si j'insère ca , les personnes qui n'auront pas visité le site avant que j'insère ce header n'auront donc que l'ancienne version non ? Ou faudrait il que pour chaque utilisateur une fois le contenu chargé une premiere fois lors de la visite il ajoute automatique ce header au deuxieme chargement de la page ? ca me semble très compliqué non ?

excusez moi si des parties de mes propos vous semble incensé mais cela ne fait que 2 mois que je me suis mis au xhtml css php Smiley smile

Par ailleurs cela métonne beaucoup qu'il n'y ai pas plus d'article à ce sujet et que vous n'utilisiez pas cette possiblité . Elle me parait pourtant très très pratique non ?

Merci pour vos réponses
Modifié par jacquesdupontd (17 Jul 2006 - 22:12)
Aucune idée pour la gestion du cache, je ne me suis jamais posé la question pour l'instant (et là tout de suite j'ai pas vraiment le temps).

Sinon, si le site lui-même n'a pas besoin de fonctionnalités de modification dynamique de l'apparence, tu peux peut-être passer par un script PHP (dans l'interface d'admin s'il y en a une) qui permette de générer un fichier CSS tout simple, avec les valeurs rentrées par le webmaster.

Suivant le degré d'optimisation, il suffit de faire une feuille de style générale qui ne bouge pas, et une feuille plus succinte avec les propriétés paramétrables, qui sera générée par le script PHP à chaque fois que l'on veut changer les paramètres, et qui sera importée dans la feuille de style principale.
Cf pour la règle @import : http://forum.alsacreations.com/faq/#item61

En passant, pour un site avec plusieurs feuilles de style au choix, on peut sans doute faire une feuille de style dynamique unique (un fichier php) avec une sélection de la feuille de style à importer via un unique paramètre passé en GET.
<link rel="stylesheet" type="text/css" href="style/commun.css?style=premier" />

Et hop, le tour est joué. Enfin j'imagine, pas encore testé…
exactement vous voyez que ca peut etre très intéressant on beaucoup n'y on tout simplement pensés n'est ce pas ? Smiley cligne En tout cas ce que je suis en train de faire (ce pour quoi je vous ai posé cette question) commence à vraiment bien marché et c'est franchement superbe . Bientot je n'aurais qu'a changer quelques valeurs pour transformer mon site à souhait Smiley cligne

Merci beaucoup pour ton aide , j'ai pu voir en lisant quelques post que tu aidais vraiment bien les gens et toujours de bon humeur . Ce sont des qualités rares que je te félicite d'avoir . Merci à tout les autres qui m'ont aidés aussi , peut être aurais je l'occasion de vous faire bénéficier de mon idée/script quand il sera fini et vraiment fonctionnel , ca pourra en intérésser quelques un .
Modifié par jacquesdupontd (18 Jul 2006 - 03:02)
Bonjour,

Plutôt que de jouer avec les 304, ajouter simplement une directive AddHandler application/x-httpd-php .css via le .htaccess du répertoire des styles, pour utiliser un fichier style.css dynamique.

Cela dit, à l'usage, et comme le disait Felipe ci-dessus, ces feuilles dynamiques compliquent et alourdissent souvent les choses, en fait Smiley cligne
Juste un truc à propos du cache : .php ne signifie pas forcément non mise en cache. Tant que les paramètres GET restent identiques, normalement...

a écrit :

Je me pose pourtant une question , si j'insère ca , les personnes qui n'auront pas visité le site avant que j'insère ce header n'auront donc que l'ancienne
version non ? Ou faudrait il que pour chaque utilisateur une fois le contenu chargé une premiere fois lors de la visite il ajoute automatique ce header
au deuxieme chargement de la page ? ca me semble très compliqué non ?

oui, il faut gérer ça par exemple avec les sessions, ce qui est je pense une prise de tête inutile.
Laurent Denis a écrit :


Cela dit, à l'usage, et comme le disait Felipe ci-dessus, ces feuilles dynamiques compliquent et alourdissent souvent les choses, en fait Smiley cligne


C'est le choix de l'importation qui devrait plutot être dynamique non ?
Changer juste le chemin du 'link' css dans le header 'html'
nORKy a écrit :


C'est le choix de l'importation qui devrait plutot être dynamique non ?
Changer juste le chemin du 'link' css dans le header 'html'


Oui et non. Cela dépend des objectifs.

Pour offrir simplement des présentations alternatives, la CSS dynamique unique qui adresse tel ou tel contenu CSS selon le choix de l'utilisateur (style switcher) est franchement inutile. Il suffit de gérer l'adressage des CSS statiques comme tu le suggères très justement.

Pour permettre à l'administrateur d'un CMS de personnaliser quelques aspects de la présentation du site, une CSS de surcharge statique sur la CSS par défaut, générée via l'interface d'admin, sera la solution la plus économique tout en donnant le plus de possibilités à l'administrateur (notamment celle de contourner l'interface et d'intervenir directement sur sa CSS de personnalisation, quand l'interface est dépassé par ses besoins, ce qui est inévitable).

Pour gérer de manière plus précise et plus limitée certains éléments répétitifs, comme le disais Felipe, la CSS dynamique peut au contraire être une solution pratique.

Pour permettre une personnalisation plus poussée, qui va finalement jusqu'au design personnalisé du site, c'est le côté HTML qui ne suivra plus, à moins d'intégrer de manière très lourde dans le template unique des classes et des div partout (cf le code de jacquesdupontd ci-dessus), ou alors de gérer un système de templates HTML par overrides (avec des CSS essentiellement statiques), en fonction des classes d'objets de contenu. Mais dans ce dernier cas, on change totalement de logique, et on se met à faire de la gestion de structure (SMS), ce qui est beaucoup plus puissant que la gestion de contenu (CMS). C'est une toute autre histoire, ça, qui commence en ce moment Smiley cligne

Mais tu as tout à fait raison, jacquesdupontd, c'est passionnant, ça, quand on commence à mettre les doigts dedans : on est dans des enjeux très important pour le Web actuel.
Modifié par Laurent Denis (18 Jul 2006 - 09:26)
En tout cas je vous remercis car j'ai réussi à faire ce que je voulais et franchement ca n'a pas l'air d'être lourd au chargement pour l'instant . Et franchement c'est vraiment ultra pratique , je vous montre ca des que c'est terminé . Merci encore Smiley cligne Ah oui juste pour info voila comment j'ai fait :

j'ai donc ajouté l'extension php et mis le header dans le css et le bon link dans la page html s'y referrant .
Ensuite j'ai appélé des valeurs à partir d'une table adminapparence créer dans mysql aux endroits qui en avaient besoins . J'insere donc ces valeurs via une page d'aministration d'apparence ou directement via des fonctions intélligente dans ma page html et mon fichier css les récupères aussi de facon intélligente de manière à ce que je puisse changer toute l'apparence de mon site en un clin d'oeil . Que vos div soit en arrond dit carré ou n'importe , ma technique est toujours aussi rapide , je suis bien content de moi sur ce coup la , j'imagine que je ne dois surement pas être le seul à avoir créer de tel fonctions mais après avoir cherché longuement sur le net j'ai pu m'apercevoir qu'ils n'y en avaient pas tant que ca qui le faisait de cette facon qui permet vraiment de changer l'apparence dans les moindres détails . Merci encore , je continu car j'ai encore beaucoup de taff je n'en suis qu'a lindex et encore il est pas fini Smiley smile
Bonjour
C'est après m'être posé la même question que je suis tombé sur le sujet de jacquesdupontd, et il est vrai que j'ai trouvé peu de choses à lire ailleurs. Sauf, une petite page: developpeur.journaldunet.com qui explique brièvement quelques trucs. Je dirais que ça résume presque les réponses apportées à ce topic.

Il doit y avoir d'autres trucs, si quelqu'un a des liens utiles, qu'il n'hésite surtout pas.
Bonjour,

J'en arrive juste à me poser la question que vous avez traitée.

Suite à la suggestion de MPOP, j'essaie de faire passer une variable en GET depuis ma page d'accueil vers mon fichier CSS dynamique (=écrit en PHP).

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


Seulement voilà : Je n'arrive pas à récupérer la variable GET dans mon fichier style dynamique...


<?php
header("Content-type: text/css"); 
$rubrique = $_GET['rubrique'];
?>

h2 {
background-image: url('pics/<?php echo $rubrique; ?>.jpg');}


je n'ai aucun echo... Avez vous trouvé une solution !?
Merci de votre aide.
Julien
Hello Julien,

Je viens de faire un test concluant avec :
page_test.php
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>CSS dynamique</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<link rel="stylesheet" media="screen" type="text/css" title="Exemple" href="test_css.php?color=yellow" /> 
</head>
<body>
<p>texte</p>
</body>
</html>
et test_css.php
<?php
header("Content-type: text/css");
if (isset($_GET['color']))
{
$color = $_GET['color'];
}
else
{
$color = 'black';
}
?>
body {
	font-family:Verdana, Arial, Helvetica, sans-serif; color:red;
	font-size: 0.8em;
	margin: 0px;
	padding: 0px;
	background-color:<?php echo $color ?>;
}


@+ Smiley cligne
Pour info, pour gérer le cache en php, il ne faut pas utiliser la directive
header("HTTP/1.0 304 Not Modified");
qui est en fait liéé aux requètes conditionnelles et necessite pas mal de précaussions pour fonctionner correctement. (à commencer par ne pas le mettre à la fin du code sinon ça ne sert à rien...

je conseille personnellement de définir une date d'expiration de la sorte :
<?php
  $offset = 60 * 60 * 24 * 3;
  $ExpireString = "Expires: " . gmdate("D, d M Y H:i:s", time() + $offset) . " GMT";
  Header($ExpireString);
?> 

et au besoin de spécifier le Cache-Control:
Cache-Control: max-age=3600


vous pouvez aussi allez vous documenter par là Smiley crazy
Merci Heyoan Smiley smile

Tu m'as fait réaliser que j'oublie parfois mon cerveau à la machine à café ! Blague à part, j'avais laissé le problème de côté pensant que j'avais manqué une subtilité du "passage de variables" dans les css dynamiques.

En fait, le problème venait de mon css qui comportait une petite erreur fatale (un hack pour IE mal géré, qui va bientôt disparaitre grâce, entre autre, aux css dynamiques).

Merci pour ta réponse rapide.
Une bonne soirée ou journée,
Julien

ps.
ça ne se fait pas de dire ça... je viens de me discréditer en une minute Smiley cligne quoi qu'il en soit, merci Smiley smile
Modifié par Julien Fortin (09 Dec 2006 - 18:33)
Pages :