More Styling

Hi @karakus! That’s an interesting question and might come down to personal preference, although let’s see what Django suggests:

One common way of using inheritance is the following three-level approach:

• Create a base.html template that holds the main look-and-feel of your site.
• Create a base_SECTIONNAME.html template for each “section” of your site. For example, base_news.html, base_sports.html. These templates all extend base.html and include section-specific styles/design.
• Create individual templates for each type of page, such as a news article or blog entry. These templates extend the appropriate section template.

While this doesn’t explicitly address your question about multiple apps, I could see it used like that as well. E.g. you’d use a project-wide base.html template, and then app-specific base_APPNAME.html templates etc.

Personally, I would make this choice on a per-project basis, since both approaches make sense to me. If it’s a project where the apps are tied together rather firmly and it’s unlikely that I would segment one of them out to use it elsewhere, then I would opt for the general base.html template, especially if unified styling and structure is something I’m going for. Otherwise, having everything neatly packaged inside of its app feels the most comfortable to me. :)

Tl;dr: I’m not sure there is a definite answer to your question. There are some good practices you can follow, such as the approach of double-inheritance that the Django docs suggest, and it’s a good idea to consider the trade-offs of either approach on a per-project basis.

Other Approaches

There are also ways to make the inheritance conditional that I have never used myself, but you could play around with it. Here are two links on StackOverflow:

• stackoverflow.com/questions/5380984/any-way-to-make-extends-conditional-django
• stackoverflow.com/questions/2575282/django-conditional-template-inheritance

I like sticking with the other approach better, though, since it feels to me this could potentially get a little messy ¯\_(ツ)_/¯

Thanks for the info Martin - it all helps!

i’m still getting this error message

NoReverseMatch at /projects/1 ‘projects’ is not a registered namespace

Hi @charneuk. For the NoReverseMatch to go away, there are a couple of things you can check, see if you can find the bug by following the suggestions in NoReverseMatch Debugging. ​ Let me know what you tried and what worked - or if it didn’t work so we can dig deeper.

HI Martin

I have created a new file called “custom.css” and placed it in the same folder as base.html, all_projects.html etc. and added this code to the base.html head tag…

<link  rel="stylesheet" href="http://127.0.0.1:8000/projects/custom.css">

It isn’t finding this file. Is there something I am missing here?

Hi @KatMac, if you want to add your own CSS file to customize your app’s look and feel, you’ll have to handle that CSS file as a static file.

In short, just like you want to remove hardcoded URLs from templates, you’ll also want to handle static files without hardcoding your URLs:

# your-template.html
{% load static %}

<link rel="stylesheet" type="text/css" href="{% static 'projects/custom.css' %}">

Hope that helps! :)

Hey Martin, first of all thank you for being responsive here to help guide us, and also thanks to the community for helping us to find the same navbar from bootstrap that you are using. Honestly I was unsure which navbar to grab. MY question is about the meta structure. I noticed that I can either add a second meta tag for the device view or i could add it to the existing tag. Is there a best practice or is that personal preference?

Hi @Eli, I’d suggest to add a second <meta> tag. This keeps the information logically separate:

<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">

The first meta tag is about character encoding, the second one about your site’s viewport. At least to me this approach makes it less effort to maintain, because I can find the information I need more quickly.

I keep getting this error. Any nudge in the right direction would be appreciated.

Exception Type: NoReverseMatch Exception Value: Reverse for ‘projects’ not found. ‘projects’ is not a valid view function or pattern name.

samjeezy did you check out the lesson on debugging this error? It could be a couple of reasons you’re getting the error, that lesson gives you hints and approaches on how to tackle it: realpython.com/lessons/noreversematch-debugging/