Le format d'un template Django est décrit grâce à un langage qui s'appelle HTML.
Le format d'un template Django est décrit grâce à un langage qui s'appelle HTML.
-
Qu'est-ce que le HTML ?
+
=== Qu'est-ce que le HTML ?===
HTML est un code qui est interprété par votre navigateur (Chrome, Firefox ou Safari) et qui permet d'afficher une page web à l'utilisateur.
HTML est un code qui est interprété par votre navigateur (Chrome, Firefox ou Safari) et qui permet d'afficher une page web à l'utilisateur.
Ligne 30:
Ligne 30:
Si vous avez encore l'erreur "TemplateDoesNotExist", essayez de redémarrer votre serveur. Allez sur votre ligne de commande et arrêtez votre serveur en appuyant simultanément sur Ctrl+C (les touches Control et C de votre clavier). Vous pouvez le relancer en tapant la commande "python manage.py runserver".
Si vous avez encore l'erreur "TemplateDoesNotExist", essayez de redémarrer votre serveur. Allez sur votre ligne de commande et arrêtez votre serveur en appuyant simultanément sur Ctrl+C (les touches Control et C de votre clavier). Vous pouvez le relancer en tapant la commande "python manage.py runserver".
Et voilà, il n'y a plus d'erreurs ! Bravo :) Cependant, notre site ne peut rien faire d'autre pour le moment qu'afficher une page blanche. La faute à notre template que nous avons laissé vide. Allons corriger ça.
Et voilà, il n'y a plus d'erreurs ! Bravo :) Cependant, notre site ne peut rien faire d'autre pour le moment qu'afficher une page blanche. La faute à notre template que nous avons laissé vide. Allons corriger ça.
Ligne 46:
Ligne 48:
Alors, à quoi ressemble notre site web maintenant ? Allons le découvrir : http://127.0.0.1:8000/
Alors, à quoi ressemble notre site web maintenant ? Allons le découvrir : http://127.0.0.1:8000/
La balise la plus élémentaire, <html>, figure toujours au début de n'importe quelle page web tandis que </html> est toujours située à la fin. Comme vous pouvez le constater, l'intégralité du contenu de notre page web est située entre la balise de départ, <html>, et la balise fermante, </html>.
+
* La balise la plus élémentaire, <html>, figure toujours au début de n'importe quelle page web tandis que </html> est toujours située à la fin. Comme vous pouvez le constater, l'intégralité du contenu de notre page web est située entre la balise de départ, <html>, et la balise fermante, </html>.
-
<p> est la balise pour les éléments de type paragraphe. </p> permet de fermer chaque paragraphe.
+
* <p> est la balise pour les éléments de type paragraphe. </p> permet de fermer chaque paragraphe.
=== Head et body ===
=== Head et body ===
Ligne 57:
Ligne 61:
Chaque page HTML est divisée en deux éléments : head (entête) et body (corps).
Chaque page HTML est divisée en deux éléments : head (entête) et body (corps).
-
head est un élément qui contient des informations sur le document : son contenu ne s'affichera pas à l'écran.
+
* **head** est un élément qui contient des informations sur le document : son contenu ne s'affichera pas à l'écran.
-
body est un élément qui contient tout le reste. Son contenu s'affichera à l'écran et constituera notre page web.
+
* **body** est un élément qui contient tout le reste. Son contenu s'affichera à l'écran et constituera notre page web.
-
Nous utilisons <head> pour transmettre la configuration de la page au navigateur tandis que <body> l'informe sur le contenu de la page.
+
Nous utilisons ''<head>'' pour transmettre la configuration de la page au navigateur tandis que ''<body>'' l'informe sur le contenu de la page.
Par exemple, vous pouvez donner un titre à votre page web en utilisant l'élément titre dans le <head> :
Par exemple, vous pouvez donner un titre à votre page web en utilisant l'élément titre dans le <head> :
Vous avez vu comment le navigateur a compris que "Le Blog d'Ola" est le titre de votre page ? Il a interprété <title>Le blog d'Ola</title> et a placé ce texte dans la barre de titre de votre navigateur (c'est ce titre qui va être aussi utilisé lorsque vous créez un marque-page, etc.).
Vous avez vu comment le navigateur a compris que "Le Blog d'Ola" est le titre de votre page ? Il a interprété <title>Le blog d'Ola</title> et a placé ce texte dans la barre de titre de votre navigateur (c'est ce titre qui va être aussi utilisé lorsque vous créez un marque-page, etc.).
Pour l'instant, notre template nous permet seulement d'afficher les mêmes informations alors que nous disions précédemment qu'il doit nous permettre d'afficher des informations différentes utilisant le même format.
Pour l'instant, notre template nous permet seulement d'afficher les mêmes informations alors que nous disions précédemment qu'il doit nous permettre d'afficher des informations différentes utilisant le même format.