Problem with redirecting in a Django HTML file

Question

I am building a personal website and I am getting an error whenever I click on the the redirect link and I am quite puzzled how to proceed.

I am also including my url.py, views.py and navbar.html files (HTML file where the redirect code is) code:

File views.py

def product(request):
    return render(request = request,
                  template_name = "main/categories.html",
                  context ={"categories": ItemCategory.objects.all})

def homepage(request):
    return render(request = request,
                  template_name = "main/categories.html",
                  context ={"categories": ItemCategory.objects.all})

def about(request):
    return render(request = request,
                  template_name = "main/about.html",
                  context ={"categories": ItemCategory.objects.all})

def contact(request):
    return render(request = request,
                  template_name = "main/contact.html",
                  context ={"categories": ItemCategory.objects.all})

File url.py

from django.urls import path
from . import views
from django.conf import settings
from django.conf.urls.static import static
from django.contrib.staticfiles.urls import staticfiles_urlpatterns

app_name = "main"

urlpatterns = [
    path("", views.homepage, name="homepage"),
    path("product/", views.product, name="product"),
    path("about/", views.about, name="about"),
    path("contact/", views.contact, name="contact"),
    path("register/", views.register, name = "register"),
    path("logout/", views.logout_request, name = "logout"),
    path("login/", views.login_request, name = "login"),
    path("<single_slug>", views.single_slug, name="single_slug"),
]


urlpatterns += staticfiles_urlpatterns()

File navbar.html

<nav>
  <div id="nav-wrapper">

    <div>
      <ul class="center hide-on-med-and-down">
        <li>
          <a href="{% url 'homepage' %}">Home</a>
        </li>
        <li>
          <a href="about/">About Us</a>
        </li>
        <li>
          <a href="product/">Products</a>
        </li>
        <li>
          <a href="services/">Services</a>
        </li>
        <li>
          <a href="contact/">Contact</a>
        </li>
        <li>
          <a class='dropdown-trigger btn' href='#' data-target='dropdown1'>Drop Me!</a>
        </li>
      </ul>
    </div>
  </div>
</nav>

How can I fix it?

Answer 1

You used app_name='main' in your urls.py. So your anchor should be href="{% url 'main:homepage' %}"

Answer 2

Django has built-in url template tags. It returns absolute path reference by matching with your views.

You can modify your navbar.html like this for best practice.

<nav>
  <div id="nav-wrapper">
    <div>
      <ul class="center hide-on-med-and-down">
        <li>
          <a href="{% url 'homepage' %}">Home</a>
        </li>
        <li>
          <a href="{% url 'about' %}">About Us</a>
        </li>
        <li>
          <a href="{% url 'product' %}">Products</a>
        </li>
        <li>
          <a href="{% url 'service' %}">Services</a>
        </li>
        <li>
          <a href="{% url 'contact' %}">Contact</a>
        </li>
        <li>
          <a class='dropdown-trigger btn' href='#' data-target='dropdown1'>Drop Me!</a>
        </li>
      </ul>
    </div>
  </div>
</nav>

Here, you are calling your URL using a name which you have registered in urls.py.

It would be more helpful if you take a look on here.

Answer 3

Use url tags for other href's.

For example.

<a href="{% url 'main:product' %}">Products</a>

See the documentation: Reversing namespaced URLs