Problème d'inclusion de pages.

Version imprimable

[résolu]Problème d'inclusion de pages.

Bonjour,

J'essaie de réaliser un cabarit de site internet en php/xml/xsl et j'ai des soucis :

Voici mon code :
(je n'utilise pas de tableau mais des div)

style.css

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
#header {
height: 50px;
background-color: #99CCCC;
}
 
#conteneur {
width:80%;
margin:0 auto;
background-color:#9999CC;
}
 
#centre {
background-color:#9999CC;
margin-left: 150px;
margin-right: 150px;
}
 
#gauche {
float:left;
width: 150px;
background-color:yellow;
}
 
#droite {
float:right;
width: 150px;
background-color:yellow;
}
 
#pied {
clear:both;
height: 25px;
background-color: #99CC99;
text-align: center;
}

J'ai ensuite un fichier xml qui traduit la structure de mon site :

site.xml

Code:

1
2
3
4
5
6
7
8
9
10
11
<?xml version="1.0" encoding="iso-8859-1"?>
<?xml-stylesheet type="text/xsl" href="site.xsl"?>
 
<site>
 
	<header/>
	<menu/>
	<pageCentre/>
	<footer/>
 
</site>

J'ai aussi un fichier xml pour le header, le menu et le footer.

header.xml

Code:

1
2
3
4
5
6
 
<?xml version="1.0" encoding="iso-8859-1"?>
 
<header>
	<div id="header">Le header</div>
</header>

menu.xml

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
<?xml version="1.0" encoding="iso-8859-1"?>
 
<menu>
	<div id="gauche">
 
		<ul>
			<li><a href="#">lien</a></li>
			<li><a href="#">lien</a></li>
			<li><a href="#">lien</a></li>
			<li><a href="#">lien</a></li>
		</ul>
	</div>
 
</menu>

footer.xml

Code:

1
2
3
4
5
6
7
<?xml version="1.0" encoding="iso-8859-1"?>
 
<footer>
	<div id="pied">
		le footer	
	</div>
</footer>

Ma feuille de style qui transforme le tout est la suivante :

site.xsl

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
<?xml version="1.0" encoding="iso-8859-1"?>
<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform"> 
 
 
<xsl:template match="/">
	<html>
	<head>
		<title>test</title>
		<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
		<link rel="stylesheet" type="text/css" media="screen" href="style.css" />
	</head>
 
		<body>
 
			<div id="conteneur">
				<xsl:apply-templates />
			</div>
 
	</body> 
	</html>
</xsl:template>
 
 
<xsl:template match="header">
	<xsl:copy-of select="document('header.xml')/header/*" />
</xsl:template>
 
 
<xsl:template match="menu">
	<xsl:copy-of select="document('menu.xml')/menu/*" />
</xsl:template>
 
 
<xsl:template match="pageCentre">
	<h3>Comment inclure ici dynamiquement une page? </h3>
</xsl:template>
 
 
<xsl:template match="footer">
	<xsl:copy-of select="document('footer.xml')/footer/*" />
</xsl:template>
 
 
</xsl:stylesheet>

Et donc ma question est :
Comment intégrer dynamiquement une page au centre?

nb : j'utilise php et la libxslt pour la transformation.

merci d'avance ^^

28/04/2005, 17h52
GrandFather

Bonjour,

par page, tu veux dire page HTML ?
28/04/2005, 18h09
julien85

Je préfèrerais inclure au milieu des pages php en réalité.

J'arrive à inclure des fichiers xml au milieu mais je ne peux pas charger leur feuille de style xsl car l'instruction <xsl:include href="" /> interdit qu'on lui passe une variable comme paramètre.

Donc je pensais inclure au milieu de la page une autre page php qui effectuera la transformation d'une page xml.

Je ne sais pas comment m'y prendre.

Y'a t-il une méthode pour créer une interface graphique en xml/xsl où l'on puisse charger dynamiquement la page centrale?

Merci ^^
29/04/2005, 13h46
julien85

Personne n'a d'idée à me proposer :pleure:
01/05/2005, 15h47
julien85

J'ai enfin réussi, si ça intéresse quelqu'un :wink:
01/05/2005, 16h17
GrandFather

Fais-nous part de ta solution... :)

Bon c'est parti.

Déjà je tiens à dire que j'ai trouvé la solution en analysant ce projet :
http://www.haricow.org/.

je cite sa solution et ensuite je mets mon code :

"Afin d'avoir toujours la même structure dans la charte graphique (un menu à
droite ou le titre en haut par exemple), une technique consiste à avoir un
fichier nommé common.xsl par exemple, dans lequel se trouve un xsl:template
qui matche la racine « / ». Ce template affiche les balises html, head et body, les
éventuels menu ou titre apparaissant sur toutes les pages du site. Puis, à
l'intérieur du body, un xsl:applytemplates
relance le processus sur le reste de
l'arbre XML.
Ainsi dans tous vos autres fichiers XSLT, pour réutiliser cette structure, il
suffit d'inclure ce fichier common.xsl, puis de définir un xsl:template matchant
« /haricow ». Ce template sera sélectionné par le apply-templates situé dans
common.xsl. De cette manière on ne définit que le contenu de la page
(l'espace qui change sur chaque page en dehors du titre et du menu)."

Maintenant un exemple concret :

Nous allons créer un gabarit de site comportant une en-tête, un pied de page, un menu vertical, un menu gauche et un menu droit.

Nous avons besoin de 8 fichiers.

- style.css (car nous allons utiliser des div et non des tableaux).

- page1.xml (données)
- page1.xsl (présentation)
- page1.php (traitements)

- page2.xml
- page2.xsl
- page2.php

- site.xsl (la structure du site)

style.css
Code:

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 #conteneur { width:80%; margin:0 auto; background-color:#9999CC; } #header { height: 50px; background-color: #99CCCC; } #centre { background-color:#9999CC; margin-left: 150px; margin-right: 150px; } #haut { height: 25px; background-color:#CCCCFF; text-align: center; } #menuhaut { list-style-type: none; margin: 0; padding:0; } #menuhaut li { display: inline; } #gauche { float:left; width: 150px; background-color:yellow; } #droite { float:right; width: 150px; background-color:yellow; } #pied { clear:both; height: 25px; background-color: #99CC99; text-align: center; }
page1.xml
Code:

1 2 3 4 <?xml version="1.0" encoding="iso-8859-1"?> <main> <text>Ici la première page</text> </main>
page1.xsl
Code:

1 2 3 4 5 6 7 8 9 10 <?xml version="1.0" encoding="iso-8859-1"?> <xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform"> <xsl:include href="site.xsl" /> <xsl:template match="/main"> <h1><xsl:value-of select="text" /></h1> </xsl:template> </xsl:stylesheet>
page1.php (utilisation de la libxslt)
Code:

1 2 3 4 5 6 7 8 9 10 11 12 13 <?php $moteurXslt = new xsltProcessor(); $style = new domDocument(); $style->load('page1.xsl'); $moteurXslt->importStylesheet($style); $source = new domDocument(); $source->load('page1.xml'); echo $moteurXslt->transformToXml($source); ?>
Pour les pages : page2.xml, page2.xsl et page2.php, c'est exactement le même principe donc je ne mets pas le code.

Maintenant le fichier le plus important :

site.xsl
Code:

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 <?xml version="1.0" encoding="iso-8859-1"?> <xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform"> <xsl:template match="/"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" lang="fr"> <head> <title>gabarit de site xml/xsl</title> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> <style type="text/css">@import url(style.css);</style> </head> <body> <div id="conteneur"> <div id="header"> <xsl:text> Le header ici</xsl:text> </div> <div id="haut"> <ul id="menuhaut"> <li><a href="page1.php">Page 1</a></li> <li><a href="page2.php">Page 2</a></li> <li><a href="#">Menu 3</a></li> <li><a href="#">Menu 4</a></li> </ul> </div> <div id="gauche"> <ul> <li><a href="page1.php">Page 1</a></li> <li><a href="page2.php">Page 2</a></li> <li><a href="#">Menu 3</a></li> <li><a href="#">Menu 4</a></li> </ul> </div> <div id="droite"> <ul> <li><a href="page1.php">Page 1</a></li> <li><a href="page2.php">Page 2</a></li> <li><a href="#">Menu 3</a></li> <li><a href="#">Menu 4</a></li> </ul> </div> <div id="centre"> <xsl:apply-templates/> </div> <div id="pied"> <xsl:text> Le footer ici</xsl:text> </div> </div> </body> </html> </xsl:template> </xsl:stylesheet>
Et voilà le travaille.