Recherche de site Web

Comment ajouter un en-tête de site, un titre de site, un titre d'index dans un projet Django ?


Pour permettre aux utilisateurs de parcourir et de comprendre facilement l'objectif du site, il est essentiel d'avoir un en-tête de site, un titre de site et un titre d'index clairs et succincts lors de la construction d'un projet Django. Vous devez spécifier l'en-tête du site, le titre du site et le titre de l'index dans les modèles HTML de votre application Django afin de les ajouter au site. Chaque page de votre site Web comportera ces composants, ce qui permettra aux visiteurs de parcourir et de comprendre plus facilement l'objectif de votre projet. Ces ajouts sont particulièrement utiles pour les sites Web complexes et volumineux sur lesquels les utilisateurs peuvent avoir du mal à naviguer. Nous verrons l'ajout de ces composants à votre projet Django à l'aide du code Python dans ce tutoriel.

Algorithme

Pour ajouter un index, un en-tête de site et un titre de page à votre projet Django à l'aide des blocs Jinja 2, suivez ces étapes -

  • Créez un modèle HTML de base pour votre projet. Ce modèle doit contenir les blocs Jinja 2 nécessaires pour l'index, l'en-tête du site et le titre de la page.

  • Dans le modèle de base, définissez les blocs Jinja 2 pour l'index, l'en-tête du site et le titre de la page à l'aide de la syntaxe {% block %}.

  • Dans chaque vue de votre application Django, étendez le modèle de base et fournissez le contenu pour les blocs Jinja 2 respectifs en utilisant la syntaxe {% extends %} et {% block %}.

  • Affichez le modèle étendu dans votre application Django en utilisant la syntaxe {% include %} ou {% extends %}.

base.html

<!DOCTYPE html>
<html lang="en">
<head>
   <meta charset="UTF-8">
   <title>{% block title %}{% endblock %}</title>
</head>
<body>
   <header>
      <h1>{% block header %}{% endblock %}</h1>
   </header>
   <main>
   {% block content %}{% endblock %}
   </main>
</body>
</html>

index.html

# In your index template (index.html)

{% extends "base.html" %}

{% block title %}Index Title{% endblock %}

{% block header %}Site Header{% endblock %}

{% block content %}
   <h2>Index Title</h2>
   <p>Make up some text to place here : : : </p>
{% endblock %}
  • Dans Django, l'en-tête de bloc et les titres de bloc font partie du système de modèles qui vous permet de créer des modèles réutilisables avec du contenu dynamique. Tout cela relève du modèle Jinja2 qui est interpolé dans HTML lui-même

  • {% block title %}{% endblock %} permet de définir un bloc pour le titre d'une page Web dans la section d'en-tête d'un fichier HTML mais notez qu'il est vide par défaut, vous êtes donc censé le faire remplacez-le dans le modèle enfant, vous permettant de définir dynamiquement le titre de chaque page de votre site. Par exemple, si vous avez un blog avec plusieurs articles, vous pouvez définir le titre de chaque page d'article de manière dynamique en utilisant le titre du bloc.

  • {% block header %}{% endblock %} aide à définir un bloc pour la section d'en-tête d'une page Web dans la section corps d'un fichier HTML. Semblable au bloc ci-dessus, il est également vide par défaut et est censé être remplacé dans le modèle enfant, vous permettant de définir dynamiquement le contenu de l'en-tête pour chaque page de votre site.

  • Pour utiliser ces blocs, créez un modèle de base avec la structure de base de votre site, y compris les sections d'en-tête et de corps. Ensuite, créez des modèles enfants qui héritent du modèle de base et remplacez les blocs {% block title %}{% endblock %} et {% block header %}{% endblock %} pour définir le contenu spécifique. pour chaque page.

Conclusion

En conclusion, l'ajout de blocs d'index, d'en-tête de site et de titre de page à votre projet Django à l'aide de Jinja 2 peut améliorer considérablement l'apparence générale et les fonctionnalités de votre application. Vous pouvez simplement maintenir l'uniformité tout au long de votre projet tout en permettant une certaine flexibilité dans les pages individuelles en établissant un modèle HTML de base avec les blocs essentiels et en l'étendant dans chaque vue avec les informations pertinentes. Les syntaxes "block%", "extends%" et "include%" offrent un moyen simple et efficace d'y parvenir. Dans l’ensemble, les blocs Jinja 2 constituent un outil puissant pour utiliser Django afin de créer des applications Web dynamiques et attrayantes.

Articles connexes