Nous allons maintenant créer une structure de site web. Afin de ne pas perdre de temps à réaliser des
graphismes ou des feuilles de styles, une page d'exemple est fournie dans td6, dans
le dossier design/
.
Pour commencer, créez un layout principal layout.html.twig
contenant la structure générale du
site. Placez la feuille de style et les images dans le dossier public/
de Symfony et utilisez la
fonction asset()
de Twig pour inclure style.css
.
Toutes vos templates hériteront plus tard ce ce layout.html.twig
et surchargeront certain
de ses blocs.
Vous pourrez par exemple placer un
bloc contents
à l'intérieur de votre page. Pour une documentation exhaustive, vous pouvez vous
référer à la documentation "Templating" de
Symfony.
Faites hériter la page default/index.html.twig
de layout.html.twig
.
Maintenant que votre structure est en place, créez une nouvelle action pour lister les pizzas dans votre contrôleur. Bien entendu, nous n'allons pour le moment pas créer de base de données. Pour cela, vous pourrez ajouter une fonction de ce style avec ses annotations:
<?php
/**
* @Route("/pizzas", name="pizzas_list")
*/
public function pizzas()
{
return $this->render('default/pizzas.html.twig', [
'pizzas' => [
'4 fromages', 'Reine', 'Paysanne'
]
]);
}
Testez votre action en vous rendant à la page /pizzas
de votre application, vous
devriez voir un message d'erreur vous indicant que la template correspondante n'existe pas. Créez
cette template en héritant du layout et surchargez le bloc du contenu pour afficher la liste des pizzas passées à la template.
Modifiez le lien du bouton "Les pizzas" de manière à ce qu'il pointe vers la page que vous venez
de créer. Attention: ne mettez pas l'adresse de votre cible "en dur", mais utilisez la fonction twig
path
:
<a href="{{ path('pizzas_list') }}">Les pizzas</a>
Faites également pointer la page "Présentation" vers une second page que vous créerez, qui aura comme URL "/", ce sera la page d'accueil de votre site.