html_css

Factorisons notre HTML

Pas envie de répéter Header et Footer sur toutes tes pages ?

Factorisons notre HTML
profil_c2c.png

Article de Christophe_c

Faisons des composants !

 

 

Bon j'avoue, j'ai triché... un petit peu...
J'ai utilisé php....

Mais un tout petit peu !!!

 

Pas de logique, pas d'appel à une DB...

Je me suis servi d'une toute petite compétence php.

 

Pour en faire de même, vous aurez besoin d'installer XAMP

et de bien créer votre projet dans le dossier xamp/htdocs.

 

Video 1 

Factorisation / fabrication d'élements réutilisables (Header, Footer)

 

 

 

Video 2 

On met un peu de logique avec une boucle et une condition php

 

 

En résumé, nous avons vu ici :

 

L'import d'élément dans notre html, qui prend ici l'entension php.

<?php
require_once "./components/header.php";
require_once "./datas/characters.php"
?>

include()   permet d'inclure un fichier. En cas de problème, le script continue.

require()   permet d'inclure un fichier. En cas de problème, le script s'arrête.

include_once() et require_once()   comme les précédentes, mais vérifient si le fichier a déjà été importé pour qu'il ne ne soit qu'une seule fois.

 

La boucle foreach et la condition if reprennent la logique de Javascript avec une légère différenciation de syntaxe.

Pour inclure de la logique php dans du HTML :

 

<?php foreach ($characters as $character): ?>
   <?php if ($character['side'] === "light"): ?>    
        Tout mon code HTML
   <?php endif ?>
<?php endforeach ?>

On encadre l'HTML avec une balise ouvrante puis une fermante pour la fonction php que nous utilisons.

Facile non ?

 

 

A bientôt Compagnon de Code

Commentaires

Ajoutez un commentaire