how to add an active class to current element in navbar in django
# navbar_demo/pages/views.py...
'''We will pass a unique variable for each page whose value will be 'active' to make
a page active in navbar when it call.'''
def index(request):
context = {"home_page": "active"} # new info here
return render(request, 'pages/index.html', context)
def about(request):
context = {"about_page": "active"} # new info here
return render(request, 'pages/about.html', context)
def contact(request):
context = {"contact_page": "active"} # new info here
return render(request, 'pages/contact.html', context)
# In html file #
'''
<ul class="navbar-nav">
<li class="nav-item {{ home_page }}">
<a class="nav-link" href="{% url 'index' %}">Home</a>
</li>
<li class="nav-item {{ about_page }}">
<a class="nav-link" href="{% url 'about' %}">About</a>
</li>
<li class="nav-item {{ contact_page }}">
<a class="nav-link" href="{% url 'contact' %}">Contact</a>
</li>
</ul>
'''
4
1
<li {% if request.resolver_match.url_name == 'home' %}class="active"{% endif %}>
<a href="/">HOME</a>
</li>
Thank you!
1
0
Are there any code examples left?
New code examples in category Python
-
Python 2023-04-11 03:04:20
-
Python 2022-03-27 22:40:04 pycharm no module named
-
Python 2022-03-27 22:25:05 assign multiple variablesin one line
-
Python 2022-03-27 22:20:02 levenshtein distance
-
Python 2022-03-27 21:35:09 get text from url python last slash
-
Python 2022-03-27 21:30:30 df concatenate df
-
Python 2022-03-27 21:25:09 python odd or even
-
Python 2022-03-27 21:15:32 python include function from another file
-
Python 2022-03-27 21:10:01 color module python
-
Python 2022-03-27 21:00:27 python tkinter cursor types