Template Inheritance is not working

Question

Template Inheritance is not working

Navigation

#1 by (1 votes)

0

I'm trying to create blocks inside my base template (index.html), but apparently the block is not used.

index.html

{% load static %}
<!DOCTYPE html>
<html lang="pt-br">
<head>
    <title>Portfolio's</title>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="stylesheet" href="{% static 'content/css/bootstrap.css' %}">
    <link href="https://fonts.googleapis.com/css?family=Lobster|Oswald|Port+Lligat+Slab" rel="stylesheet">
     .
     .
     .
    <div class='container'>
        <div class='row'>
            <div id='artigo' class='col-lg-8'>

                {% block corpo_artigo %}

                {% endblock %}
     .
     .
     .

When I call it in a separate file, it does not take effect

body_article.html

{% extends "index.html" %}
{% block corpo_artigo %}

    {% for item in conteudo_artigo%}

        {% if item.photo %}
        <img src="{{item.photo}}" class="img-responsive" alt="..."> 
        {% endif %}

            <a id='titulo' href="/artigos/{{item.id}}"><h1>{{item.titulo}}</h1></a>
            <h5 id ='autor'>{{item.autor}}</h5>
            <h5 id ='tag'>{{item.tag}}</h5>

            {% if item.corpo|length > 1000 %}
                <p id = 'corpo_artigo'>{{item.corpo|truncatewords:200|safe}}</p> 
                <button class="btn btn-default navbar-btn"> <a href="/artigos/{{item.id}}">Continue lendo</a></button>
            {% else %}
                <p>{{item.corpo}}</p>
            {% endif%}
                <h5 id ='data'>{{item.data}}</h5>

        {% endfor %}

{% endblock %}

Obs I'm using a directory called templates using:

'DIRS': [os.path.join(BASE_DIR, 'templates')],

EDIT: I noticed that the {% extends "index.html"%} tag works normally, but everything I put inside the {% block% does not work.

python django

asked by anonymous 24.09.2017 / 19:26

1 answer

Find difference between two tables Form field above all the elements on the page

score 1 · Accepted Answer

During my research I realized that this type of error is a recurring thing with respect to the inheritance of Templates so I decided to leave here the solution to the problem and if possible contribute with the knowledge of others that will fall into the same impasse.

I think the confusion is how the tag works. The examples given in the documentation and some posts scattered around the web lead one to believe that it behaves as an 'include', but in fact it does not have anything to do with it.

The tag {% extends%} really extends content from one page to another. It may seem trivial, but I will give an example that elucidates such behavior, so let's start from the beginning:

urls.py

from heranca import views
from django.conf.urls import url
from django.contrib import admin

urlpatterns = [
   url(r'^admin/', admin.site.urls),
   url(r'^$', views.home), #Exemplo simles de URL 
]

We created a simple URL and imported our view called 'home'.

heranca / views.py

from django.shortcuts import render

def home(request):
    return render(request, 'index.html')

Here comes the main confusion. It would be intuitive to call an html that is actually our html base but in fact what we should call in our view is the html where our blocks will stay , thus generating another html that will serve as a skeleton

index.html

{% extends 'esqueleto.html'%}
{% block conteudo %}
   <p> Ja o conteudo presente dentro dos blocos apareceria somente caso o bloco seja devidamente declarado na pagina 'esqueleto'
    Dessa forma a pagina 'esqueleto' age como um esqueleto do nosso site possibilitando rodar elementos que são comuns a 
    todas as páginas.
   </p>
 {% endblock%}

In this way we should store in the 'skeleton' page the content that we want to be really relevant to other pages that refer to it.

 <!DOCTYPE html>
 <html>
 <head>
    <title>Teste de herança </title>
 </head>
 <body>
 <div>
    <h1>Titulo do site</h1>
    <p>O conteudo presente na pagina 'esqueleto' será comum a pagina 'index' pois a mesma 'extende' seu conteudo a partir da tag 'extends'</p>

    {% block conteudo%}

    {% endblock%}
</div>

If you reread the question from this post you will realize that there the tag was being used similarly to an include in python when it works differently.

I hope to contribute to the community somehow with this. This post has helped me to reach this conclusion