Herencia de plantilla en Flask

La herencia de plantillas es una característica muy buena de las plantillas de Jinja. Jinja es un motor de plantillas web para el lenguaje de programación Python. Hemos visto que las páginas web de un sitio web contienen el mismo pie de página, barra de navegación, etc. Entonces, en lugar de hacer el mismo pie de página y la misma barra de navegación en todas las páginas web por separado, usamos la herencia de plantilla, que nos permite crear la parte que es igual en todas las páginas web. (por ejemplo, pie de página, barra de navegación) solo una vez y tampoco necesitamos escribir la etiqueta html, head, title una y otra vez. Permite definir la estructura común de las páginas web en el archivo base.html. En primer lugar, renderizaremos la plantilla usando el matraz del archivo main.py.

Requisito previo –   Frasco – (Creación de la primera aplicación simple)

 

Paso 1: cree una aplicación de matraz para representar la plantilla principal 

Python3

from flask import Flask, render_template
  
# Setting up the application
app = Flask(__name__)
  
# making route
  
  
@app.route('/')
def home():
    return render_template('home.html')
  
  
# running application
if __name__ == '__main__':
    app.run(debug=True)

Paso 2 : crear archivos HTML

Ahora configuraremos nuestro archivo base.html en el que tenemos un encabezado que será común en todas las páginas web. 

Sintaxis: 

{% block content %}
{% endblock %}

El código arriba y abajo de estas líneas será el mismo para todas las páginas web y el código entre ellos será para una página web específica. 

HTML

<!DOCTYPE html>
<html lang="en">
<head>
    <title>Template Inheritance</title>
</head>
<body>
    <h1> This heading is common in all webpages </h1>
    {% block content %}
    {% endblock %}
  
</body>
</html>

  

Ahora configuraremos nuestro archivo home.html en el que heredaremos la plantilla del archivo «base.html» y escribiremos un código para 

página de inicio también. 

Sintaxis:

  {% extends "base.html" %}
        {% block content %}
          write code here for home page only 
        {% endblock %}

HTML

{%extends "base.html" %}
{%block content%}
  
<h1>Welcome to Home</h1>
  
{% endblock %}

      

Ejecute su archivo main.py. 

Producción – 

A continuación se muestra la salida.

        

Este artículo es solo un ejemplo simple. También podemos agregar la barra de navegación, el pie de página, etc. al archivo base.html y podemos heredar el archivo home.html y muchos otros.

Publicación traducida automáticamente

Artículo escrito por dontstockplease y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *