Best way to handle LoginView login on all pages in Django

I am new to Django and I have spent a lot of time trying to find a solution to my problem but was not successful. I have a top navbar that is included in the base.html file and every page extends base.html. In my navbar, I have a button that shows a modal (bootstrap) and I want this modal to show the login form. My url.py is as follows:

from django.urls import path, include
from .views import RegisterView
from django.contrib.auth.views import LoginView, LogoutView, PasswordResetView, PasswordResetDoneView, PasswordResetConfirmView, PasswordResetCompleteView, PasswordChangeView, PasswordChangeDoneView

urlpatterns = [
    # Mapping django auth at the root
    # The URLs provided by auth are:
    # login/ [name='login']
    # logout/ [name='logout']
    # password_change/ [name='password_change']
    # password_change/done/ [name='password_change_done']
    # password_reset/ [name='password_reset']
    # password_reset/done/ [name='password_reset_done']
    # reset/<uidb64>/<token>/ [name='password_reset_confirm']
    # reset/done/ [name='password_reset_complete']
    #path('', include('django.contrib.auth.urls')),
    path('password_reset/', PasswordResetView.as_view(), name='password_reset'),
    path('password_reset_done/', PasswordResetDoneView.as_view(), name='password_reset_done'),
    path('password_reset/<uidb64>/<token>/', PasswordResetConfirmView.as_view(), name='password_reset_confirm'),
    path('password_reset/complete/', PasswordResetCompleteView.as_view(), name='password_reset_complete'),
    path('password_change/', PasswordChangeView.as_view(), name='password_change'),
    path('password_change/complete/', PasswordChangeDoneView.as_view(), name='password_change_done'),
    path('login/', LoginView.as_view(), name='login'),
    path('logout/', LogoutView.as_view(), name='logout'),
    path('register/', RegisterView.as_view(), name='register'),
]

As you can see above, path('login/', LoginView.as_view(), name='login'), will only correctly resolve {{ form }} in localhost:8000/login but I want it to resolve in all paths to achieve what I want. Meaning, if I navigate to localhost:8000/login and open the modal from navbar, I will see the login form but if I open the modal from navbar from localhost:8000/anyOtherPath , then it will not show the login form.

What is the best recommended way to achieve what I want? Please let me know if you want to see more of my code to understand my situation better.

In summary, I have a navbar in base.html and every page extends base.html. The navbar contains a button to show a modal and I want to display a login form in that modal, regardless of which page I am on.

Any help here would be very much appreciated. Thank you in advance.

Two options come quickly to mind.

  1. Include the html for the modal form in your base.html.
  2. Have the login menu entry make an AJAX call to retrieve the form from the server.