Le 14 septembre 2017, nous avons publié une version actualisée de notre Politique de confidentialité. En utilisant video2brain.com vous vous engagez à respecter ces documents mis à jour. Veuillez donc prendre quelques minutes pour les consulter.

TYPO3 : ​Intégration avec FLUID Template

Utiliser les partials

TESTEZ LINKEDIN LEARNING GRATUITEMENT ET SANS ENGAGEMENT

Tester maintenant Afficher tous les abonnements
Apprenez à utiliser les partials qui vont vous permettre de gagner beaucoup de temps. Vous allez ainsi réutiliser des parties de templates.
07:18

Transcription

Voyons maintenant comment utiliser les partials. Donc, comme je le disais tout à l'heure, les partials sont des éléments qui vont être réutilisables dans vos différents templates et layouts. Donc, je vais commencer par créer un premier partial qui va être, par exemple, mon menu. Donc, sur mon dossier Area, qui veut dire zone Je vais créer un nouveau fichier nommé « Menu.html ». Donc, je vais simplement mettre du texte pour simuler mon menu. Donc, « MENU : ». Je crée une liste. Ctrl + D pour dupliquer... ... « Page 2 » et « Page 3 ». Donc, je sauvegarde. Donc, je vais créer comme ça plusieurs partials. Je vais maintenant créer un partial « Footer »... ... « .html »... ... avec, par exemple, un copyright... ... « Copyright 2016 ». Donc, maintenant que j'ai créé mes deux partials, je vais pouvoir les afficher dans mes layouts. Donc, je vais retourner dans mon layout Green... ... et je vais appeler mon partial MENU... ... avec « f:render »... ... «  » « partial »... ... « = »... ... « Area », puisque mon partial se trouve dans le dossier « Area »... ... « /Menu ». Même chose pour le footer... ... « f:render »... ... « partial=Area »... ... « /Footer »... Je sauvegarde, et je vais maintenant pouvoir vérifier l'affichage. Donc, je vide les caches, et je recharge. Voilà, je vois donc bien apparaître mes deux partials, mon menu et mon footer. Donc maintenant, je vais retourner dans mon template, et utiliser l'affichage par défaut. Donc, au lieu d'utiliser le layout Green, je vais utiliser le layout Default, et sauvegarder. Si je retourne sur mon frontend et que j'actualise, je vois que je ne retrouve pas mon menu et mon footer. Donc, évidemment, je vais vouloir les afficher. Donc pour ça, je vais retourner dans mon template par défaut... ... dans mon layout par défaut... ... et ajouter ici, le rendu de mes partials... ... « partial= »... ... « Area/Menu »... ... et ... ... « render partial »... ... « Area »... ... « /Footer »... ... j'enregistre, je retourne sur mon frontend, et j'actualise. Mon menu apparaît et mon copyright également. Donc, vous voyez bien ici l'intérêt des partials qui vont vous permettre de réutiliser du code dans vos layouts comme dans vos templates. Ici par exemple, si je n'avais pas de partials, j'aurais dû dupliquer deux fois le code du menu, une fois dans mon layout par défaut et une fois dans mon layout Green. Maintenant, pour la maintenance, c'est beaucoup plus simple puisque je peux simplement modifier mon menu... ... sauvegarder... ... recharger le frontend... ... et il va être modifié sur les deux layouts. Donc, je peux retourner dans mon template par défaut et utiliser le layout Green. Je recharge et je vois bien que la Page 4 est également là. Donc, il faut aussi savoir que vous pouvez utiliser les sections dans les partials. Donc, imaginons ici que je vais changer la couleur de mon menu en fonction du layout utilisé. Donc, pour ça, je vais définir deux sections... ... « = »... ... « Yellow ». Je vais déplacer mon menu dedans... ... et une seconde section... ... « Orange »... ... et je colle également dans le code de mon menu... ... je vais ici ajouter... ... une div... ... qui va me permettre de définir un style... ... avec un fond orange... ... « background »... ... « orange »... ... donc là, je ferme ma div... ... je déplace ensuite mon menu à l'intérieur de ma div... ... avec un copier-coller... ... et je vais faire la même chose, pour le menu jaune... ... voilà, je peux sauvegarder. Donc, je vais déplacer mon menu. Donc, je vais maintenant placer mon menu à l'intérieur de cette div. Voilà. Et je vais faire la même chose pour le menu jaune... ... « div »... ... « background » « yellow »... ... voilà, je peux sauvegarder. Je vais maintenant, pour le layout vert, afficher le menu jaune, et pour le layout par défaut qui est rouge, afficher le menu orange. Donc pour ça, je me rends dans mon layout vert, et je vais dire ici, utiliser la section... ... jaune... ... donc, « Yellow » qui est ici. Donc, je sauvegarde. Je retourne ensuite dans mon layout par défaut... ... et je fais de même... ... « section »... ... « Orange ». Je sauvegarde. On va voir ce que ça donne. Donc, comme d'habitude, on vide les caches. On recharge. On voit ici que sur le layout vert, j'ai bien mon menu jaune qui apparaît, et si je modifie mon layout, donc dans le layout par défaut... ... j'ai bien pour le layout rouge, le menu orange qui apparaît.

TYPO3 : ​Intégration avec FLUID Template

Apprenez à intégrer avec FLUID, le langage officiel de templating de TYPO3. Passez de la méthode classique des markers vers FLUID, et abordez les bonnes pratiques.

1h36 (24 vidéos)
Aucun commentaire n´est disponible actuellement
 
Logiciel :
TYPO3 6
Spécial abonnés
Date de parution :16 juin 2016

Votre formation est disponible en ligne avec option de téléchargement. Bonne nouvelle : vous ne devez pas choisir entre les deux. Dès que vous achetez une formation, vous disposez des deux options de consultation !

Le téléchargement vous permet de consulter la formation hors ligne et offre une interface plus conviviale. Si vous travaillez sur différents ordinateurs ou que vous ne voulez pas regarder la formation en une seule fois, connectez-vous sur cette page pour consulter en ligne les vidéos de la formation. Nous vous souhaitons un excellent apprentissage avec cette formation vidéo.

N'hésitez pas à nous contacter si vous avez des questions !