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
Related
how to completely remove the recent action panel from Django admin UI
I have done a lot of searching and all leads to how to clear the data in the panel from the database .. but what am looking to do is completely remove the panel from my admin Userinteraface .. any help on how to do this?
what I've tried :
tried to override the base_site.html for the admin and it worked for override colors and styles and other blocks but not working with the sidebar block
{% extends "admin/base.html" %}
{% load i18n static %}
{% block title %}{{ title }} | {% trans "G-Attend" %}{% endblock %}
{% block extrastyle %}
<link rel="stylesheet" type="text/css" href="{% static 'custom_admin_styles/admin_override.css' %}">
{% endblock %}
{% block branding %}
<h1 id="site-name">
<b style="color: #1f76bc;size: 80;">
G
</b> Attend </h1>
{% endblock %}
{% block sidebar %}
<div id="content-related">
</div>
{% endblock %}
{% block nav-global %}{% endblock %}
The right solution for this was like :
creating a file called index.html inside my templates/admin/ directory , then inside the HTML file I used this code :
{% extends "admin/index.html" %}
{% block sidebar %}
{% endblock %}
so I need to extend index.html instead of base_site.html
To override the Django admin side bar
You nee to extends admin/base_site.html
{% extends "admin/base_site.html" %}
{% load i18n static %}
<!-- -->
{% block sidebar %}
<div id="content-related">
Your custom side bar here.
</div>
{% endblock %}
NB : Inside your templates folder, you should have created an admin subfolder. And place the custom .html file in it.
More info Here
I'm creating my base.html file and for some reason only one block is displaying in my base.html file at a time. I am trying to include a nav bar, a footer, and some content in base.html but it will only display one block at a time.
I have a feeling it has something to do with my view class because I am only including one file at a time, however I'm fairly new to starting a Django project and I don't know the common procedure to set up a base.html file.
base.html:
{% block nav_bar %}{% endblock %}
{% block content %}No Content to Show!!{% endblock %}
{% block footer %}No Footer Available!!{% endblock %}
views.py:
from django.views.generic import TemplateView
class HomeView(TemplateView):
template_name = 'home.html'
Hoping to have all blocks show up on the page at once!
EDIT: home.html is my homepage content page.
If you are extending the 'home.html' from 'base.html'. Please check if you have the right structure as mentioned below and I recommend you to use spaces between the '}' or '{' and what will come after them.
base.html:
<!DOCTYPE html>
<body >
{% block nav_bar %}{% endblock %}
{% block content %}{% endblock %}
{% block footer %}{% endblock %}
</body>
</html>
home.html :
{% extends "base.html" %}
{% block nav_bar %} {% endblock %}
{% block content %} No Content to Show!! {% endblock %}
{% block footer %} No Footer Available!! {% endblock %}
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 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 %}