Template inheritance & block tag not working

Hello folks,
This seems like such a simple thing, but it’s not working for me →

From index.html:

 <h1>THIS IS ABOVE THE BLOCK</h1>
     {% block testblock %}
          
     {% endblock testblock%}
 <h1>THIS IS BELOW THE BLOCK</h1>


 {% block results %}
 {% endblock results %}

 <h1>End of Results</h1>

results.html:

{% extends "index.html" %}

{% block results %}

 <div class="row align-items-start py-5">
 <div class="col">
 <h4>Primary Results: </h4>
 </div>
 <div class="col">
 <h4>Secondary Results: </h4>
 </div>
 </div>

 <!-- loop block -->
 <div class="row align-items-start py-2">
 <div class="col">
 <h5>This is where primary results will appear</h5>
 </div>
 <div class="col">
 <h5>This is where secondary results will appear</h5>
 </div>
 </div>

{% endblock %}

test.html

{% extends "index.html" %}

{% block testblock %}

    <h1>THIS IS IN BETWEEN THE BLOCKS</h1>

{% endblock %}

Result:

Only the contents of index.html are displaying. I’ve read through the Django documentation on templates section 3 times. It’s such a simple thing; can anyone tell me what’s going wrong, please?!

All html files are in the same directory

How are you rendering these? (What code are you running to get these results?)

I’m not sure what you’re asking me here.
I runserver from terminal and it’s rendered in the browser
the html files themselves are in search_app/templates/search_app/file.html

You have one or more views that renders those templates to display the pages. We need to see those views.

Gotcha, gotcha… of course
It’s just the beginnings of me mucking about with my first project so it’s pretty simple →


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

So you’re rendering index.html. That’s what you’re going to see on that page.

Can you elaborate more, please

I saw it as this was what template inheritance was for.
You have me really confused right now, actually

Do the child template pages (search.html, test.html - the pages with {% extend %} in them) need to be rendered as views as well?

Not “as well” - instead of, depending upon what it is you’re trying to display.

Think of the “page construction process” as an “inside-out” design. A view retrieves content (typically, usually, or frequently) from a database. The view figures out what’s going to be displayed, and then renders a template to build a page with that content.
That template can be designed to work within a larger framework of a page - that larger framework is the template that the view’s template extends.

That outer template might contain your header and footer, along with the JavaScript and CSS needed for the page as a whole. But the “guts” of the page is produced by the view using that “inner” template.

I’m trying really hard not to sound dumb here, I’m just starting with django from a couple years of on and off python experience. I’ve been working through a tutorial and reading the docs from this site.
What you said above, I think, says I had the {% extends %} tag in the wrong file. So I checked back through the documentation and made sure I had it right. Then I tried to render the results.html page instead of index.html but got a template not found error even though they’re in the same directory.
It made a bit of sense to me to render results.html rather than index.html since the latter is referenced in the former; but again, I’m super new with Django and haven’t quite gotten my head around it yet.
Saying that, I’m still not 100 certain what you’re saying I should do here

You don’t mention which tutorial you’re working through, but I always recommend either the Official Django Tutorial or the Django Girls Tutorial. In this case, I think you’re going to be better off with the Django Girls Tutorial because it gets more into templates and template extensions.

All template references are “absolute” and not relative to the location of the current template. (Note: The word “absolute” here is to be interpreted quite loosely. This is not strictly true, but “good enough” for now.) That way, any template can extend an appropriate base template from a common directory regardless of the location of the extending template. There are other benefits that this provides as well.
In your specific case here, since your template is accessed in the searchnet directory, your extends tag needs to specify the directory.

I got really happy reading this and thought to myself “Yes, of course… duh”
but in the end

{% extends "searchnet/index.html" %}

doesn’t get the job done either. I tried building this out to the project directory and still it isn’t working. I’ve been messing with it since last night.

I’ll check out those tuts, thanks. In the meantime, I’m still down to hear more suggestions on why this isn’t working

We’d need to see the TEMPLATES setting within your settings file, along with a more detailed explanation of your directory structure, starting from the root of your project, and specifically identifying the location of these files and directories relative to your project root.

Also, you may want to review:

The only thing I’ve done to settings.py are added the path to templates to DIR

TEMPLATES = [
    {
        'BACKEND': 'django.template.backends.django.DjangoTemplates',
        'DIRS': [os.path.join(BASE_DIR, 'templates/')],
        'APP_DIRS': True,
        'OPTIONS': {
            'context_processors': [
                'django.template.context_processors.debug',
                'django.template.context_processors.request',
                'django.contrib.auth.context_processors.auth',
                'django.contrib.messages.context_processors.messages',
            ],
        },
    },
]

and registered the app in INSTALLED_APPS

INSTALLED_APPS = [
    'searchnet.apps.SearchnetConfig',
    'django.contrib.admin',
    'django.contrib.auth',
    'django.contrib.contenttypes',
    'django.contrib.sessions',
    'django.contrib.messages',
    'django.contrib.staticfiles',
]

My directory structure is
Project
| - searchnet/
| - templates/
| - searchnet/
- index.html
- results.html

EDIT: directory structure didn’t display as expected. The path to both parent and child template is
{Project}/searchnet/templates/searchnet/..

Surrounding anything like that between the lines of ``` helps to prevent the forum software from reformatting it on you.

What’s the content of your SearchnetConfig class?

I’m confused by your use of the .. in that path. Are those files in the templates directory or in the templates/searchnet directory?

class SearchnetConfig(AppConfig):
    default_auto_field = 'django.db.models.BigAutoField'
    name = 'searchnet'

The … is just where the directories end and the files begin. So the html files are in that second searchnet directory

And you’re saying you’re getting an error message when you try to render searchnet/results.html, where the first line of results.html is {% extends "searchnet/index.html" %} ?

Can you post the complete error that you are getting? Not the one in the browser, but the error as displayed in the console window where you’re running runserver. (And please remember to enclose that complete block of text between lines of ```.)

I would have gladly done that for you but it turns out that now things are working. When I tried rendering results.html before it didn’t work so I changed it back. After we got the proper path up there it was still rendering index.html. Now with the proper path and rendering the proper file it’s working. Thank you for you time.

That’s really counter intuitive for me (not rendering index.html but rather rendering the extension) but now I see exactly what you mean by inside out approach. It’s going to take a while before that seems natural to me.

So the view connects the child template which connects to the parent rather than the view connecting to parent and the parent calling the child!?

It’s going to take a restructuring of my previous understanding to keep that straight

Thanks again

1 Like