Problème d'inclusion de pages.

**julien85** · 28/04/2005, 14h52

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 :

Sélectionner tout - Visualiser dans une fenêtre à part

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 :

Sélectionner tout - Visualiser dans une fenêtre à part

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 :

Sélectionner tout - Visualiser dans une fenêtre à part

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 :

Sélectionner tout - Visualiser dans une fenêtre à part

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 :

Sélectionner tout - Visualiser dans une fenêtre à part

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 :

Sélectionner tout - Visualiser dans une fenêtre à part

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 ^^

**GrandFather** · 28/04/2005, 17h52

Bonjour,

par page, tu veux dire page HTML ?

**julien85** · 28/04/2005, 18h09

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 ^^

**julien85** · 29/04/2005, 13h46

Personne n'a d'idée à me proposer

**julien85** · 01/05/2005, 15h47

J'ai enfin réussi, si ça intéresse quelqu'un

**GrandFather** · 01/05/2005, 16h17

Fais-nous part de ta solution...

**julien85** · 01/05/2005, 18h06

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 :

Sélectionner tout - Visualiser dans une fenêtre à part

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 :

Sélectionner tout - Visualiser dans une fenêtre à part

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

page1.xsl

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

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 :

Sélectionner tout - Visualiser dans une fenêtre à part

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 :

Sélectionner tout - Visualiser dans une fenêtre à part

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.

Problème d'inclusion de pages.

XML/XSL et SOAP

Discussions similaires

Partager

Partager