How do I use Template Inheritance to inherit Style Sheets (css) in my Django project?

Asked

Viewed 1,397 times

1

I have a base.html template and another library.html template that is inheriting base! I managed to inherit most of the base.html, but when I try to add another link tag in the Style block Django accuses Templatesyntaxerror error, when I remove the block with the new link tag the more it renders the template normally!

Base.html:

<!DOCTYPE html>
{% load staticfiles %}
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="description" content="">
<meta name="author" content="">
<link rel="shortcut icon" href="">

<title>{% block title %}{% endblock %}</title>

<link href="{% static 'css/bootstrap.min.css ' %}" rel="stylesheet">
<link href="{% static 'css/starter-template.css ' %}" rel="stylesheet">
<link href="{% static 'css/navbar-static-top.css ' %}" rel="stylesheet">

{% block Estilo %}
{% endblock %}

</head>

<body>

<div class="navbar navbar-inverse navbar-fixed-top" role="navigation">
  <div class="container">
    <div class="navbar-header">
      <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
        <span class="sr-only">Toggle navigation</span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
      </button>
      <a class="navbar-brand" href="#">Library Chameleon</a>
    </div>
    <div class="collapse navbar-collapse">
      <ul class="nav navbar-nav">
        <li class="active"><a href="#">Home</a></li>
        <li><a href="#emprestimo">Emprestimo</a></li>
        <li><a href="#relatorios">Relatórios</a></li>

        <li class="dropdown">
          <a href="#" class="dropdown-toggle" data-toggle="dropdown">Serviços <b class="caret"></b></a>
          <ul class="dropdown-menu">
            <li><a href="#cadLivros">Cadastrar Livros</a></li>
            <li><a href="#cadUsuarios">Cadastrar Usuarios</a></li>
            <li><a href="#cadFuncionarios">Cadastrar Funcionarios</a></li>
            <li class="divider"></li>
            <li class="dropdown-header">Pesquisa</li>
            <li><a href="#pesqLivro">Livro</a></li>
            <li><a href="#pesqUsuario">Usuario</a></li>
            <li><a href="#pesqFuncionario">Funcionario</a></li>
          </ul>
         </li>

      </ul>
    </div>
  </div>
</div>

{% block Corpo %}
{% endblock %}

<!-- JavaScript
================================================== -->

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script src="{% static 'js/bootstrap.min.js ' %}"></script>
{% block JScript %}
{% endblock %}

Library.html:

{% extends 'base.html' %}

{% block title %}Chameleon | Cadastro de Livro{% endblock %}

{% block Estilo %}
<link href="{% static 'css/cadastros.css' %}" rel="stylesheet">
{% endblock %}

{% block Corpo %}       
<div class="container">

  <form class="form-signin" role="form">
    <h2 class="form-signin-heading">Cadastro</h2>

    <input type="text" class="form-control" id="codigo" name= "codigo" placeholder="Codigo" required autofocus>
    <input type="text" class="form-control" id="titulo" name= "titulo" placeholder="Titulo" required>
    <input type="text" class="form-control" id="autor" name= "autor" placeholder="Autor" required>
    <input type="text" class="form-control" id="editora" name= "editora" placeholder="Editora" required>
    <input type="text" class="form-control" id="genero" name= "genero" placeholder="Genero" required>
    <input type="text" class="form-control" id="publicacao" name= "publicacao" placeholder="Ano: 0000" required>

    <textarea id="sinopse" name="sinopse" placeholder="Sinopse" rows = 10 cols = 63 required></textarea>

    <br><button class="btn btn-lg btn-primary btn-block" type="submit">Salvar</button>
  </form>
</div>
{% endblock %}

{% block JScript %}
{% endblock %}

Error returned from Django:

TemplateSyntaxError at /cadLivro/
Invalid block tag: 'static', expected 'endblock'
Request Method: GET
Request URL:    http://localhost:8000/cadLivro/
Django Version: 1.6.2
Exception Type: TemplateSyntaxError
Exception Value:    
Invalid block tag: 'static', expected 'endblock'
Exception Location: C:\Python27\lib\site-packages\django\template\base.py in invalid_block_tag, line 331
Python Executable:  C:\Python27\python.exe
Python Version: 2.7.6
html css django

1 answer

2


Add the {% load staticfiles %} in the library.html also.

Django requires you to add the required headers to each template file, even if they are already declared in the base template. Are you using the static inside the style block, but the template still doesn’t know what it means, due to the absence of the {% load staticfiles %}.

Browser other questions tagged html css django

You are not signed in. Login or sign up in order to post.