Code propre PHP + XHTML

Bonjour,

Je sais coder proprement en PHP
Je sais coder proprement en XHTML

Mais là ou ça se complique, c'est lorsque le PHP se retrouve mélangé au XHTML !!

Je veux un code propre aussi bien dans la source lue par le navigateur que le fichier .php

D'où le début des problèmes, avec les indentations, les retour à la ligne etc...

Laissez-vous le code PHP tout à gauche ou est-il au même niveau que le code XHTML ?
Si je dois écrire une variable, j'écris généralement <p><?= $mavariable; ?></p>
mais dès qu'il y a 2-3 lignes de PHP, tout se décale...
Avez-vous de bonnes pratiques ou des astuces ?

Car ça devient très vite illisible.

Salut,

Une technique beaucoup utilisée consiste à indenter par "blocs". Par exemple, un code PHP génère un calendrier...

echo "<!--Début bloc calendrier -->";
echo "<table summary=\"...\">";
echo "\r<thead>";
echo "\r\r<tr>";
...
echo "<!--Fin bloc calendrier -->";

Gérer l'indentation de tout le document serait assez difficile, à moins d'automatiser ça avec un algo, qui pompe des ressources pour rien. Tu peux conserver une bonne lisibilité en séparant bien les différents bouts de code (qui correspondent à différents éléments de ton document) de cette manière.

Pour ma part ça ressemble à ça :

$doc=new View();

$doc->add('<h1>'.t('titre').'</h1>');
$doc->add('<h2>'.t('un titre de deuxième niveau').'</h2>');
$doc->add('<p>'.t('un paragraphe').'</p>');
$doc->add('<h2>'.t('un autre titre de deuxième niveau').'</h2>');

$doc->processSkin();

Mon code en sortie ne contient donc aucune indentation. Si pour une raison quelconque je souhaite en avoir je rajoute ça à la fin de 'processSkin()' :

$dom=new DOM();
$dom->formatOutput = true; // <- pour l'indentation
$dom->LoadHTML($out);
echo $dom->saveXML($dom);

Salut,

Noisequik a écrit :
j'écris généralement <p><?= $mavariable; ?></p>

Ce serait tout de même mieux de mettre

<?php echo $mavariable; ?>

pour ne pas risquer d'erreur d'interprétation sur certains serveurs.

Noisequik a écrit :
Avez-vous de bonnes pratiques ou des astuces ?

Personnellement j'aime bien que le code généré soit indenté.

La première "astuce" c'est que je place mon <?php echo après avoir mis le bon nombre de tabulations pour qu'il s'aligne avec le reste du code.

La seconde est qu'en cas de boucles (genre <ul> <li> <li> <...> </ul>) je me sers de \n (retour à la ligne) et de \t (tabulation) pour indenter. Un pitit exemple :

		<a href="#menu" id="menu" name="menu"></a><!-- ancre "Aller au Menu" -->
		<ul>
			<?php
				for ($i=0; $i < count($lien); $i++) {
				$class_td = '';
				if ($i == $page) $class_td = " class='active'";
				$id_page = ($i == 0) ? './' : $arraypage[$i];
				echo ("<li><a $class_td href='$id_page'>$lien[$i] </a></li>\n\t\t");
				if ($i + 1 < count($lien)) echo "\t";
				} ?>
				
		</ul>
	</div>

C'est vrai que ça "alourdit" un peu le code mais c'est tout de même léger...

A+
Modifié par Heyoan (25 Jul 2008 - 13:25)

merci pour les réponses :

pour commencer je vois que vous n'hésitez pas à écrire des balises avec echo; ce que j'essayais d'éviter, mais dans le cas d'une boucle, je ne sais pas s'il est mieux de fermer et d'ouvrir plusieurs fois <?php ... ?> ou d'cérire avec echo;

Je me demandais aussi si <?= $mavariable; ?> posait vraiment le problème décrit par Heyoan

(pour <? echo $mavariable; ?> je suis sûr que c'est déconseillé par contre)

Noisequik a écrit :
(pour <? echo $mavariable; ?> je suis sûr que c'est déconseillé par contre)

J'aimerais bien connaître la raison de ça.

Il faut PHP5 pour utiliser Dom, non ?

SiDi a écrit :
Il faut PHP5 pour utiliser Dom, non ?

Il y a une extension pour PHP 4 je crois mais sinon oui c'est intégré à PHP depuis la version 5.

Heyoan a écrit :

C'est vrai que ça "alourdit" un peu le code mais c'est tout de même léger...

lourd ou léger ?

Sinon, je fais exactement comme tu fais.J'utilise souvent \n et \t. Si j'ai besoin de voir le code source html, je me casse pas la tête.

++

Noisequik a écrit :
(pour <? echo $mavariable; ?> je suis sûr que c'est déconseillé par contre)

Changaco a écrit :
J'aimerais bien connaître la raison de ça.

Lorsqu'on met <? ça indique qu'on va se servir d'une instruction de traitement. On le complète par exemple par <?xml-stylesheet, <?php, <?zouzou-control, etc...
Si tu n'indiques rien à la suite de <?, tu ne sais pas comment va être interprété les instructions qui suivent puisque tu ne contrôles pas, à cet instant, la configuration du processeur d'instructions.

a écrit :
(pour <? echo $mavariable; ?> je suis sûr que c'est déconseillé par contre)

Si tu as un serveur, dont tu ne fais qu'utiliser l'hebergement, et que tu ne le contrôle pas.

Tu vas faire ceci dans ton fichier php :

Je m'appelle <?=$ma_variable; ?>

Sur ce serveur dont tu ne sais pas comment il est configuré, tu peux très bien y voir après traitement du serveur apache :

Je m'appelle <?=$ma_variable; ?>

En gros, il ne t'aura rien traité. Alors que si tu t'efforce d'être rigoureux en marquant bien les balises d'ouverture et fermeture php, que tu utilises les bonnes fonction php, quel que soit la config, le code généré sera toujours le même.

En même temps, ce n'est pas plus long, et au moins, tu sais ce que tu fais tout le temps.

Je m'appelle <?=$ma_variable; ?>
Je m'appelle <?php echo $ma_variable; ?>

8 octets de plus, rien de renversant, c'est comme pour le CSS/(x)html, si tu est bien rigoureux, que tu utiles les bon éléments au bon endroit, tu t'en sortiras toujours mieux, et te relire ne sera pas compliqué.

Après tu parlais si il valait mieux plusieurs "echo" ou un seul, si tu ne fait pas de site qui comporte 10 000 "echo" et qui doit supporter une charge serveur énorme, tu ne verras jamais la différence. Fait comme tu le veux.

Après, si tu rentre dans les critères exclusif, plusieurs "echo" avec quelques variable est plus rapide à traiter qu'un seul "echo" rempli de plein de variable (des millièmes de secondes d'écart (c'est un test que DEW avait fait me semble t'il)).

koala64 : peux-tu me parler plus en détail de ta méthode, car je ne connais pas du tout les feuilles de style xsl

Super_baloo8 : en fait pour echo, je ne parlais pas de la charge serveur car la différence est négligeable, mais plutôt du fichier source php, notamment la coloration syntaxique

En mettant du html dans un echo, tout le code sera d'une seule couleur donc beaucoup moins lisible...

Je vois ce que tu veux dire, en général dans un "echo", y'a pas 100 000 balises html, donc je n'y pensais pas.

Après, ça peut être pratique :

<php
$mon_nom = "Toto";
?>
<body>

<div>

<p>Mon nom est <?php echo $mon_nom; ?></p>

</div>
</body>

Pour aller dans ton sens, il vaux mieux utiliser le principe de "Template" (gabarit), qui sera parsemer de variable, et ces variables seront renseigner en amont, puis tu inclus le template.

Comme ça d'un côté, tu as le html (template), et de l'autre, traitement dynamique de toutes tes variables.
Modifié par Super_baloo8 (31 Jul 2008 - 13:42)

Noisequik a écrit :
Bonjour,

Je sais coder proprement en PHP
Je sais coder proprement en XHTML

Mais là ou ça se complique, c'est lorsque le PHP se retrouve mélangé au XHTML !!

Je veux un code propre aussi bien dans la source lue par le navigateur que le fichier .php

D'où le début des problèmes, avec les indentations, les retour à la ligne etc...

Laissez-vous le code PHP tout à gauche ou est-il au même niveau que le code XHTML ?
Si je dois écrire une variable, j'écris généralement <p><?= $mavariable; ?></p>
mais dès qu'il y a 2-3 lignes de PHP, tout se décale...
Avez-vous de bonnes pratiques ou des astuces ?

Car ça devient très vite illisible.

Utilise un moteur de template (smarty par ex )

Ainsi tu auras ton code php dans un fichier et ton html (template) dans un autre, les 2 ne seront plus mélangés

Le moteur de template est une bonne solution, mais pour de petits projets ça n'en vaut pas forcément la peine.
D'ailleurs, PHP est déjà un moteur de template en soi : Il suffit d'être rigoureux et de respecter la séparation entre traitement et présentation.

Par exemple tu peux avoir un fichier qui ne sert qu'à effectuer tous les calculs, requêtes à la BDD, transformations de texte, dates, etc, création de tableaux et que sais-je. Dans un deuxième fichier, tu n'as que du code HTML agrémenté d'echo et de boucles PHP si besoin.

Un troisième fichier (ou pas forcément) peut se charger d'inclure les différents fichiers de traitement et de template ainsi que les fichiers de fonctions, de paramètres, etc, suivant ce qui est nécessaire.

Je ne suis pas un professionnel et j'ai parfois quelques projets à coder pour d'autres personnes. Le dernier en date, un tout petit projet auquel j'ai appliqué ce système de template (donc "moteur de template" créé par moi) m'a pris trois jours à coder, permet de changer totalement le design rien qu'en utilisant des CSS (pour les couleurs et les images) ou de changer carrément l'emplacement des blocs en modifiant le code HTML du template. (pour un petit apperçu : http://fredetglop.free.fr )

Ce que j'ai gagné à coder ainsi : Très grande lisibilité de mon code (dès qu'on a compris comment fonctionne le moteur de template, puisque je n'ai pas fait de doc ), ajout/retrait de blocs très facile pour modifier une page du site, changement de design très facile, etc.
L'inconvénient est par contre que ce moteur de template n'est pas réutilisable puisqu'il n'est fait que d'includes et d'une séparation rigoureuse entre le traitement et la présentation (donc spécifique à ce site-là).

Pour en revenir aux echo

Personnellement, si je n'utilise pas de moteur de template, ma page se décompose en au moins deux parties :
1. Traitement PHP
2. Bloc HTML

La première partie s'occupe des requêtes vers la base de donnée et du traitement des informations;
La seconde partie est la structure HTML avec des blocs PHP à l'intérieur si nécessaire.
J'utilise des echo lorsqu'il faut afficher une ou deux variables mais évite le plus possible d'y inclure de grandes portions de HTML.

Je préfère

<p><?php echo $variable; ?></p>

à

<?php echo '<p>'.$vatiable.'</p>'; ?>

Pour si peu de balise, je fais des exceptions, mais c'est juste pour montrer le principe.

Et puis quelque chose de très pratique en PHP, quand tu utilise des boucles ou des conditions, c'est cette structure qui te permet de fermer ton bloc PHP tout en restant dans la boucle (ou la conditionnelle) :

<?php if ($variable == $condition): ?>
Code HTML dans lequel il est toujours possible d'inclure <?php echo 'des blocs PHP'; ?> sans aucun problème
<?php else: ?>
C'est un if/else tout à fait classic
<?php endif; ?>

(Marche aussi avec for, while, each et foreach)
Modifié par superjun (03 Aug 2008 - 15:26)

lu',

Noisequik a écrit :
koala64 : peux-tu me parler plus en détail de ta méthode, car je ne connais pas du tout les feuilles de style xsl

Le principe de base est le suivant :

php

<?php

final class XSLTransform {
	
	final private function process($xml, $xsl, $param) {

		$DomXml = DOMDocument::load($xml)
		or die('Le fichier xml est indisponible ou comporte des erreurs !');

		$DomXsl = DOMDocument::load($xsl)
		or die('Le fichier xsl est indisponible ou comporte des erreurs !');

		$process = new XSLTProcessor;
		$process->importStyleSheet($DomXsl);
		foreach($param as $key => $value) $process->setParameter("", $key, htmlspecialchars($value));

		return print $process->transformToXML($DomXml);

	}

	final public function __construct($xml, $xsl, $param) {

		header('Content-type: text/html; charset=utf-8');
		header('vary: user-agent');
		ini_set('arg_separator.output', '&');
		ob_start('ob_gzhandler');

		return is_string($xml) && is_string($xsl) && is_array($param) ?
			XSLTransform::process($xml, $xsl, $param):
			false;

   }

}

$xml = 'xml/ressources.xml';
$xsl = 'xsl/template.xsl';
$param = array(
	[#red]'page' => 'home'[/#]
);

new XSLTransform($xml, $xsl, $param);

?>

xml

<?xml version="1.0" encoding="utf-8" ?>
<site>
	[#blue]<item>coucou</item>[/#]
</site>

xsl

<?xml version="1.0" encoding="utf-8" ?>

<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">

	<xsl:output
		method="xml"
		version="1.0"
		encoding="utf-8"
		omit-xml-declaration="yes"
		doctype-public="-//W3C//DTD XHTML 1.0 Transitional//EN"
		doctype-system="http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"
		indent="yes" />

	[#red]<xsl:param name="page"/>[/#]

	<xsl:template match="/">
		<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" lang="fr">
			<head>
				<meta http-equiv="content-type" content="text/html; charset=utf-8" />
				<meta http-equiv="content-language" content="fr" />
				<meta name="DC.Language" scheme="RFC3066" content="fr" />
				<title>page test</title>
				<link rel="stylesheet" type="text/css" media="screen, projection" href="css/default.css" />
				<script type="text/javascript" src="js/default.js"></script>
			</head>
			<body id="{[#red]$page[/#]}">
				<p>[#blue]<xsl:value-of select="item"/>[/#]</p>
			</body>
		</html>
	</xsl:template>
</xsl:stylesheet>

et pour pouvoir se servir de XSL, il faut activer le module php_xsl dans ta config'.

Si cette solution t'intéresse, tu peux, par exemple, consulter ce cours.