Quick links: Content - sections - sub sections
EN FR
Quick Search Advanced search
 
Page

  [Opened] [Résolu] CSS avec background url dans le répertoire www d'un module

Posted by csk on 02/25/2013 18:37

Bonjour à tous,

j'essaie de porter mon application Jelix 1.3 vers Jelix 1.4 (et accessoirement vers 1.5). Depuis la version 1.4, Jelix offre la possibilité de mettre des css, js et autres fichiers, directement dans le répertoire www d'un module.

Afin de mieux ranger mes fichiers de mon application, je veux rapatrier mes css et images du répertoire www de l'application vers celui du module qui les concernent.

Dans une feuille de style (disons style.css), je définis dans une classe CSS un arrière-plan avec une image.

.maClasse
{
   background: url(img/fond.png);
   ...
}

Les fichiers styles.css et fond.png sont des fichiers que je mets dans le répertoire www d'un module. Pour l'inclusion de style.css, je peux faire dans mon template :

{meta_htmlmodule css 'mymodule', 'css/styles.css'}
<div class="maClasse">
   ...
</div>

Mais comment faire pour retrouver mon image fond.png tout en conservant sa déclaration dans la feuille de style ? Est-ce que c'est la bonne façon de procéder ?

Autre question rien avoir, dans l'exemple http://docs.jelix.org/fr/manuel-1.4/vues/vue-html#ajouter-des-feuilles-de-styles-fichiers-javascript-images :

{* dans le www/ d'un module *}
{meta_htmlmodule css , 'mymodule', 'css/mystyles.css'}

Est-ce que la 1ère virgule est en trop ?

Merci d'avance.

  [Opened] CSS avec background url dans le répertoire www d'un module

Reply #1 Posted by laurentj on 02/26/2013 22:05

Bonjour,

Mais comment faire pour retrouver mon image fond.png tout en conservant sa déclaration dans la feuille de style ?

D'après l'exemple que tu as donné, l'url de ton image est relative à celle de la feuille de style, donc à priori pas de souci.

Par contre il faut activer le moteur d'url significatives et de lier le fichier urls.xml du module jelix à ton urls.xml principal (ou de déclarer une url vers l'action "jelix~www:getfile" dans ton urls.xml principal). Ainsi l'url de ta feuille de style sera un chemin, et non pas une url avec le nom du fichier css en tant que paramètre...

Ou autre solution mais moins flexible : mettre l'url absolue de l'image dans tes css. Mais d'une appli à une autre, ça peut changer, c'est pas top

Est-ce que la 1ère virgule est en trop ?

oui elle est en trop

  [Opened] CSS avec background url dans le répertoire www d'un module

Reply #2 Posted by csk on 02/27/2013 18:27

Un tout grand Merci Laurent! Ça fonctionne à merveille avec les urls significatives.

Pour ceux qui serait dans le même cas : j'ai simplement activé les urls significatives dans le fichier de configuration defaultconfig.ini.php.

[urlengine]
engine=significant
...

Ensuite, j'ai mis dans le fichier urls.xml principal :

<?xml version="1.0" encoding="utf-8"?>
<urls xmlns="http://jelix.org/ns/urls/1.0">
	<entrypoint type="classic" name="index" default="true">
		...
		<url pathinfo="/getfile/:targetmodule/:file" module="jelix" action="www:getfile">
			<param name="targetmodule" type="string"/>
			<param name="file" type="path"/>
		</url>
	</entrypoint>
</urls>
 
Page
  1. CSS avec background url dans le répertoire www d'un module