Zend FR

Consultez la FAQ sur le ZF avant de poster une question

Vous n'êtes pas identifié.

#1 30-03-2007 22:54:01

BlackYeLL
Membre
Date d'inscription: 30-03-2007
Messages: 10

Des feuilles de styles (CSS) dynamiques ?

Bonsoir tout le monde,

Alors voilà, jusqu'à présent, j'utilisais ma tambouille pour développer, mais les possibilités offertespar le Zend Framework me séduisent de plus en plus.

Je me pose cependant un question, qui m'est très importante :

J'aime bien créer une feuille de style pour les éléments globaux (qui apparaissent très souvent, comme le header/footer entre autres), et une feuille de style par page ou module spécifique.

Donc si on imagine une page qui inclut le header/footer + page de news + un module de chat par exemple, on pourrait imaginer 3 feuilles de styles distinctes.

Pour les appeler, au lieu de faire :
<link rel="stylesheet" type="text/css" href="/path/to/css/global.css" />
<link rel="stylesheet" type="text/css" href="/path/to/css/news.css" />
<link rel="stylesheet" type="text/css" href="/path/to/css/chat.css" />

Je faisais :
<link rel="stylesheet" type="text/css" href="/path/to/css/main.css.php?style=global,news,chat" />

Mon fichier main.css.php commençant alors par un header('Content-Type: text/css'); et combinant les différents fichiers demandés.

Ce qui avait 2 avantages, le premier étant de n'ouvrir qu'une seule connexion au serveur, au lieu de 3, rien que pour les CSS (j'utilise la même méthode pour mes scripts JS).

Le deuxième avantage est que je pouvais mettre du code Php directement dans mes CSS, par exemple :
background-image: url(<?php echo $path_to_images; ?>/background.png);

Or, aujourd'hui, avec le framework je ne sais pas comment faire pour avoir des variables dans mes CSS.

Pour ce qui est d'appeler mes feuilles de styles en une seule fois, rien ne m'empêche de faire comme actuellement (bien que du coup ça sorte du Zend Framework hmm ), mais comment aller chercher des variables de configuration de Zend ?

J'aime bien définir le chemin vers mes images, styles et scripts dans un fichier de configuration... Ça me permet de pouvoir basculer sur un autre chemin pendant que je développe par exemple...

Voilà, je ne sais pas si c'est réalisable, mais ça me serait d'une grande utilité.

Surtout qu'un autre problème se pose, celui de l'url de base. En local, la racine c'est http://localhost/site_en_dev/ alors que sur le serveur c'est http://www.site.com/

Donc mon :
background-image: url(path/to/css/background.png);

fonctionne si je vais sur
http://localhost/site_en_dev/controller/
ou
http://www.monsite.com/controller/

Car dans ce cas l'url est relative au dossier parent (donc http://localhost/site_en_dev/path/to/css ...)

Mais si je vais dans une vue :
http://localhost/site_en_dev/controller/view
ou
http://www.monsite.com/controller/view

Le dossier parent devient "controller", et donc la feuille de style cherche les images dans :
http://localhost/site_en_dev/controller/path/to/css...
http://www.monsite.com/controller/path/to/css...

Donc ça ne fonctionne plus... et si je met l'url absolue :
background-image: url(/site_en_dev/path/to/css/background.png);

Ça fonctionnera en local, mais pas sur le serveur...

D'où l'importance d'insérer des variables dans mes CSS.

Voilà, j'espère que quelqu'un aura une solution propre smile

Merci beaucoup.

Hors ligne

 

#2 30-03-2007 23:31:36

Country
Nouveau membre
Date d'inscription: 23-03-2007
Messages: 7

Re: Des feuilles de styles (CSS) dynamiques ?

Salut,

Les liens des images dans le fichiers CSS sont relatifs à l'emplacement du fichier CSS, pas à l'emplacement du fichier dans lequel il est inclut.

Inutile donc de faire des variables PHP pour remplacer les chemins.

Dernière modification par Country (30-03-2007 23:32:00)

Hors ligne

 

#3 30-03-2007 23:52:13

quode
Membre
Date d'inscription: 22-03-2007
Messages: 20

Re: Des feuilles de styles (CSS) dynamiques ?

La balise xhtml <base> permet de définir une url absolue qui servira de référence pour les liens relatifs présents dans la page. Ceci plus les conseils de Country devraient résoudre tes problèmes.

Dernière modification par quode (30-03-2007 23:52:55)


All software problems can be solved by introducing an extra level of indirection. Well, almost.

Hors ligne

 

#4 31-03-2007 03:49:27

BlackYeLL
Membre
Date d'inscription: 30-03-2007
Messages: 10

Re: Des feuilles de styles (CSS) dynamiques ?

Merci beaucoup smile

Au final, j'ai simplement créé un controlleur cssController.php ... et je vais donc chercher mes feuilles de style avec css/la_css_que_je_veux

Le tout avec la balise BASE définie correctement, et ça roule smile

Hors ligne

 

#5 31-03-2007 09:23:06

golivier
Membre
Lieu: vendée
Date d'inscription: 20-03-2007
Messages: 47
Site web

Re: Des feuilles de styles (CSS) dynamiques ?

Bonjour,

Ca doit ralentir enormément. non ?

Olivier

Hors ligne

 

#6 31-03-2007 12:27:37

BlackYeLL
Membre
Date d'inscription: 30-03-2007
Messages: 10

Re: Des feuilles de styles (CSS) dynamiques ?

Je ferai des tests pour voir la différence, mais je doute que la différence soit significative...

Si utiliser le framework pour créer une simple CSS devait ralentir énormément, je n'ose imaginer ce que ça serait pour la génération des pages (X)HTML bien plus complexes. Je pense donc que c'est négligeable, mais je ferai des tests de performance dans le doute wink

Hors ligne

 

#7 31-03-2007 18:42:29

quode
Membre
Date d'inscription: 22-03-2007
Messages: 20

Re: Des feuilles de styles (CSS) dynamiques ?

BlackYeLL a écrit:

Je ferai des tests pour voir la différence, mais je doute que la différence soit significative...

Ne pas oublier la possibilité de caching coté client (If-None-Match, If-Modified-Since..). Un controller de css 'cache-aware' serait à n'en pas douter une bonne idée.


All software problems can be solved by introducing an extra level of indirection. Well, almost.

Hors ligne

 

#8 31-03-2007 20:24:53

Country
Nouveau membre
Date d'inscription: 23-03-2007
Messages: 7

Re: Des feuilles de styles (CSS) dynamiques ?

La technique de générer un fichier CSS unique est mauvaise car imaginons que je vais sur une page de news avec un module de chat : je télécharge global-news-chat.css (fichier CSS généré par php, combinant les 3 fichiers CSS)

Puis je vais sur une page de commentaire avec un module de chat : je télécharge global-commentaires-chat.css

Je téléchargerait donc 2 fois les fichiers global.css et chat.css puisque le fichier généré par php sera différent pour chaque page du site (impossible ici d'utiliser le cache côté client).

Hors ligne

 

#9 01-04-2007 11:01:12

BlackYeLL
Membre
Date d'inscription: 30-03-2007
Messages: 10

Re: Des feuilles de styles (CSS) dynamiques ?

Quode, il me reste énormément de chose à apprendre de ce Zend Framework, les possibilités et le potentiel semblent énormes.  J'apprends petit à petit, et en effet comme tu le dis, les fonctions de cache doivent être intéressantes dans ce cas là smile Je vais regarder ça, merci.

Country> Ce n'est pas entièrement faux, mais à mon avis il vaut mieux que l'user télécharge quelques dizaines de ko supplémentaires plutôt que d'ouvrir plusieurs connexion aux serveurs.

J'avais fais des tests, et la navigation est beaucoup plus agréable ainsi, car tout est chargé en une seule fois. On le sent bien quand on arrive sur certains sites qui chargent 3 fichiers CSS + 4 fichiers Javascripts par exemple, on sent que le navigateur "mouline" le temps d'ouvrir toutes les connexions.

Alors c'est vrai qu'au lieu d'avoir en cache :
- global.css : 8ko
- chat.css : 1ko
- news.css : 1ko
- home.css : 2ko

On aura :
- ....css.php?global,chat,news : 10ko
- ....css.php?global,chat,home : 11ko

Mais de nos jours, ce sont des tailles de fichier vraiment négligeables, et je préfère privilégier le confort de navigation plutôt que quelques ko supplémentaire dans le cache de l'utilisateur smile

Mais après je pense que tout dépend des points de vue. De toute façon pour le moment je ne peux plus faire ainsi, avec le framework je ne vois pas trop comment gérer et je n'ai pas encore pris la peine d'y réfléchir.

Merci à vous 2 pour votre intervention smile

Hors ligne

 

#10 01-04-2007 20:04:32

Country
Nouveau membre
Date d'inscription: 23-03-2007
Messages: 7

Re: Des feuilles de styles (CSS) dynamiques ?

Heu ouai mais pour un "vrai" site je ne prendrai pas le risque de "corrompre" le cache (qui est un des gros arguments du CSS). Non seulement le visiteur va re-télécharger la même chose encore et encore (1 fois par page différente qu'il verra en fait) mais en plus ça bouffera la bande passante du serveur pour rien. C'est peut être négligeable à petite échelle mais à sûrement pas à grande échelle.

En plus vu le nombre de connexion que va ouvrir le serveur pour la page html et les images (sans compter les scripts externes au site de plus en plus souvent) ce n'est pas 4 ou 5 connexions de plus qui vont changer grand chose.

Hors ligne

 

#11 05-08-2007 18:13:48

alien7
Membre
Date d'inscription: 29-04-2007
Messages: 447

Re: Des feuilles de styles (CSS) dynamiques ?

Pour m apart je l efait comme ca :

Code:

    <link rel="stylesheet" type="text/css" href="/public/styles/style.css" media="screen" />
    <link rel="stylesheet" type="text/css" href="/public/styles/menu.css" media="screen" />
    <link rel="stylesheet" type="text/css" href="/public/styles/form.css" media="screen" />
    <link rel="stylesheet" type="text/css" href="/public/styles/<?php echo $this->page; ?>.css" media="screen" />

Je mets donc une variable $this->view->page dans la fonction init() de mes controlleurs.

Qu'en pensez-vous ?


ZF 2.3 - Twitter Bootstrap 3.2
Local: Ubuntu  -> Apache2 2.4 - MariaDB 10 - PHP 5.6

Hors ligne

 

#12 06-08-2007 10:20:56

yannux
Membre
Lieu: Rennes
Date d'inscription: 07-04-2007
Messages: 284
Site web

Re: Des feuilles de styles (CSS) dynamiques ?

Ca me semble une solution plus correct smile


Société : Direct Info Service

Hors ligne

 

#13 06-08-2007 11:28:07

ndesaleux
Membre
Date d'inscription: 16-04-2007
Messages: 196
Site web

Re: Des feuilles de styles (CSS) dynamiques ?

Perso, je ferai plutot un "plugin/composant" qui permettrai en fonction de la localisation (module, controller, action) détermine le/les fichiers JS/CSS à mettre en place. Et ce si possible avec un module de gestion dans l'admin, mais cela reste mon point de vue.

Comme ca, je peux avoir une feuille CSS spécifique à un tableau que j'inclus à chaque fois que je dois affiché un tableau.
De même pour chaque partie qui peut etre réutilisable comme le menu, le layout principale, les formulaires et ainsi de suite.

Hors ligne

 

Pied de page des forums

Propulsé par PunBB
© Copyright 2002–2005 Rickard Andersson
Traduction par punbb.fr

Graphisme réalisé par l'agence Rodolphe Eveilleau
Développement par Kitpages