I am using jinja2 as a template language in my project. Here is simplified templates structure:
base.html:
{% block content %}{% endblock %}
{% block sidebar %}{% endblock %}
content.html:
{% extend 'base.html' %}
{% block content %}
<div class="content">
Content
{% block sidebar %}
<div class="sidebar">Sidebar</div>
{% sidebar %}
</div>
{% endblock %}
And the result of content.html render:
<div class="content">
Content
<div class="sidebar">Sidebar</div>
</div>
<div class="sidebar">Sidebar</div>
As you may see, sidebar is present twice at rendered content.html.
Question:
Is there a way to avoid appearance of the sidebar in content, leaving {% block sidebar %} inside {% block content %} ?
I think your content.html template is invalid - you're clearly positioning sidebar related content inside the content block, so it will allways appear there. Also, your base.html seems invalid as well, it should look more like:
{% block content %}{% endblock %}
{% block sidebar %}{% endblock %}
Related
I'm trying to load a header template into my index with {% block %} but I can't get it to load
index.html
<body>
<header>
{% block header %}{% endblock %}
</header>
<h1>Hello</h1>
</body>
header.html
{% extends "index.html" %}
{% block header %}
<div class="header">
<i class="fas fa-archive"></i>
<i class="fas fa-home"></i>
<h1>hey</h1>
</div>
{% endblock %}
views.py
def index(request):
categories = Category.objects.all()
context = {'categories': categories}
return render(request, 'category/index.html', context)
The app is installed in the settings.
To get things to work the way you wanted you would need to make header.html the base template then extend index.html off of it. This is because header.html is only substituting in {% block header %} when you render header.html. Index.html doesn't see any of these substitutions when rendered. You may want to make the header.html file a static file and load it in that way. Similar to how you would with css.
To achieve what you want to you should render header.html now, check django docs.
It's better to have a layout and then put the header block inside it.
layout.html
...
<body>
<header>
{% block header %}{% endblock %}
</header>
<h1>Hello</h1>
{% block content %}{% endblock %}
<footer>
{% block footer %}{% endblock %}
</footer>
</body>
...
index.html
{% extends "layout.html" %}
{% block header %}
the header
{% endblock %}
{% block content %}
here the content
{% endblock %}
{% block footer %}
here the footer
{% endblock %}
Now you can render the index.html in your view
I'm calling a template in extended template.
I can't not find 'how to extended template call the other template in jinja2?'
base.html
<div class="main-container">
{% block content %}
{% endblock %}
</div>
child.html
{% extends "base.html" %}
{% block content %}
<div class="child">
<button class="modal"/>
{% modal content %}
{% endblock %}
</div>
{% endblock %}
modal content.html
<div class="modal-content">
...some code
</div>
I want call modal content in child.html.
If you're meaning you want to add the content.html into the child.html page, use include
Within child.html:
{% include 'content.html' %}
I have the following base.html
{% load static from staticfiles %}
<html>
<title>COOL| {% block title %} Sometitle {% endblock %}</title>
<body>
<!--- BEGIN INSERT CONTENT FOR OTHER PAGE HERE-->
{% block 'body' %}
{% endblock %}
And I have somefile.html which are wrapped by the above.
{% extends 'base.html'%}
{% block title %} Contact {% endblock %}
{% block 'body' %}
<h1> CSV </h1>
{% endblock %}
The message I get is this:
Invalid block tag: 'static', expected 'endblock'
I expect somefile.html will inherit {% load static from staticfiles %} from base.html. But it doesn't. What's the right way to do it?
You should load tags in each template.
I'm currently writing a quick python script to adapt all my old templates to a new base-template.
To do this I need to move the code inside the {% block body %} somewhere else.
I already got this one to match all my {% load smth %}
r"\{% load [^\{%]+? %\}"
What I want to match is the code between {% block body %} and {% endblock %}
Example:
{% block body %}
<div class="row">
<div class="span12">
[...]
</div>
</div>
{% endblock %}
unfortunately, there is no way to use regexp here, unless you use the notation {% endblock body %}, or you don't use nested blocks. Here is an example why it will fail:
{% block body %}
<div class="row">
<div class="span12">
{% block foo %}
[...]
{% endblock %}
</div>
</div>
{% endblock %}
regex will catch nested {% endblock %} as end of the body block
Leaving the obvious problem of nested blocks aside, this would be the regex to match all not-nested blocks:
\{% block [^\{%]+? %\}[\s\S]*\{% endblock %\}
I can't figure out how to modify blocks from included templates using Jinja2. Here's an example where I use three files.
base.html:
<html>{% include "content.html" %}</html>
content.html:
<h1>{% block title %}Title{% endblock title%}</h1>
<div>{% block content_body %}Content Body{% endblock content_body%}</div>
story.html
{% extends "base.html" %}
{% block title %}story.title{% endblock title %}
{% block content_body %}story.description{% endblock content_body %}
When rendering story.html, I'll get:
<html>
<h1>Title</h1>
<div>Content Body</div>
</html>
How would I render with the expected values?
base.html is not rendered because it's not invoked by any template. What you could do is a second level of extension:
base.html:
<html>{% block html %}{% endblock %}</html>
content.html:
{% extends "base.html" %}
{% block html %}
<h1>{% block title %}Title{% endblock title%}</h1>
<div>{% block content_body %}Content Body{% endblock content_body%}</div>
{% endblock %}
Still, that is probably overkill, you will likely find that a single base template is enough (i.e. combine base.html and content.html into a single template).