Glisser

PHP : mélanger HTML et PHP (pages dynamiques)

PHP : mélanger HTML et PHP, pages dynamiques (partie 11)

Écrit par : Thibault Chazottes

Un fichier .php peut être du HTML

Référence : balises PHP.

Un site classique : head, body, un h1, un p. Si le fichier s’appelle index.php sans une ligne de PHP, ça marche. L’extension .php ne force pas à tout écrire en PHP. Hors des balises, l’analyseur ignore le contenu : c’est renvoyé tel quel (ici, du HTML).

<!DOCTYPE html>
<html lang="fr">
<head>
    <meta charset="UTF-8">
    <title>Mon site</title>
</head>
<body>
    <h1>Bienvenue</h1>
    <p>Un paragraphe.</p>
</body>
</html>

C’est le même principe que dans c’est quoi PHP et le premier script : PHP tourne côté serveur, le navigateur ne voit que le HTML produit.


Ouvrir PHP au milieu du HTML

On déclare des variables, puis on les injecte dans le HTML. Entre <?php et ?>, c’est du PHP. Dehors, c’est du HTML.

<?php
$title = 'Bienvenue sur mon site';
$firstName = 'Thibault';
?>
<!DOCTYPE html>
<html lang="fr">
<head>
    <meta charset="UTF-8">
    <title><?= $title ?></title>
</head>
<body>
    <h1><?= $title ?></h1>
    <p>Bonjour <?= $firstName ?> !</p>
</body>
</html>

Le serveur exécute le PHP, remplace les balises par le texte, et envoie du HTML. Apache (ou le serveur intégré) ne « mélange » pas deux langages dans le navigateur : il transforme, puis envoie le résultat.


<?= : le raccourci d’echo

Référence : echo.

<?= $title ?> est équivalent à <?php echo $title; ?>. Moins verbeux. Disponible même si short_open_tag est désactivé (ce n’est pas la balise courte <?, celle-là peut être coupée).

echo affiche. Rien de plus : c’est une construction du langage, pas une fonction.


Conditions dans le HTML : if: / endif

Référence : syntaxe alternative.

Les conditions avec accolades, ça marche. Au milieu du HTML, c’est plus lisible avec deux-points à la place de {, et endif; à la place de }. Pareil pour else / elseif.

<?php
$isLogged = false;
?>
<body>
<?php if ($isLogged): ?>
    <p>Vous êtes connecté</p>
<?php else: ?>
    <p>Veuillez vous connecter</p>
<?php endif; ?>
</body>

$isLogged === true → « Vous êtes connecté ». false → « Veuillez vous connecter ».

Les deux syntaxes sont équivalentes. On ne mélange pas accolades et endif dans le même bloc (règle officielle).


Boucles dans le HTML : foreach: / endforeach

Même principe pour les boucles. Un tableau, une liste HTML, autant de li que d’éléments.

<?php
$products = ['ordinateur', 'clavier', 'souris', 'écran'];
?>
<h1>Produits</h1>
<ul>
<?php foreach ($products as $product): ?>
    <li><?= $product ?></li>
<?php endforeach; ?>
</ul>

Oublier endforeach; : erreur. F5 : les quatre produits s’affichent.


Tout ensemble : un mini-catalogue

Variables, tableaux imbriqués, foreach, if, <?= : un seul fichier.

<?php
$pageTitle = 'Catalogue';
$products = [
    ['name' => 'Ordinateur', 'price' => 899, 'available' => true],
    ['name' => 'Clavier', 'price' => 49, 'available' => true],
    ['name' => 'Souris', 'price' => 29, 'available' => false],
];
?>
<!DOCTYPE html>
<html lang="fr">
<head>
    <meta charset="UTF-8">
    <title><?= $pageTitle ?></title>
</head>
<body>
    <h1><?= $pageTitle ?></h1>
    <?php foreach ($products as $product): ?>
        <article>
            <h2><?= $product['name'] ?></h2>
            <p><?= $product['price'] ?> €</p>
            <?php if ($product['available']): ?>
                <p>Disponible</p>
            <?php else: ?>
                <p>Indisponible</p>
            <?php endif; ?>
        </article>
    <?php endforeach; ?>
</body>
</html>

Mille produits depuis une base : le même foreach, toujours ~40 lignes. C’est ça, le HTML dynamique.


Démo vidéo


FAQ rapide (SEO & technique)

Un fichier .php peut contenir du HTML ?
Oui. Hors des balises PHP, le contenu est renvoyé tel quel. Voir balises PHP.

<?= c’est quoi ?
L’équivalent de <?php echo … ?>. Voir echo.

Pourquoi endif et endforeach ?
Syntaxe alternative : : à la place de {, endif; / endforeach; à la place de }. Plus lisible au milieu du HTML. Voir syntaxe alternative.

Le navigateur exécute-t-il le PHP ?
Non. Le serveur exécute, puis envoie du HTML. Voir requête HTTP.


Conclusion

Fichier .php = HTML +, au besoin, des îlots PHP. <?= pour afficher, if: / endif et foreach: / endforeach pour les conditions et les boucles. À la fin, le client ne reçoit que du HTML.

La suite de la playlist : include et require, pour réutiliser header, footer et le reste. L’épisode est là : PHP : include et require.

Étiquettes :