This example at http://djangosnippets.org/snippets/2421/ works as it is.
Placed in templates/includes/tabs.html
<ul class="tab-menu">
<li class="{% if active_tab == 'tab1' %} active{% endif %}">Tab 1</li>
<li class="{% if active_tab == 'tab2' %} active{% endif %}">Tab 2</li>
<li class="{% if active_tab == 'tab3' %} active{% endif %}">Tab 3</li>
</ul>
Placed in your page.html template
{% include "includes/tabs.html" with active_tab='tab1' %}
The variable gets passed along from page template to tabs.html.
How would you pass active tab variable from:
- page.html (pass active tab1)
- extends base.html
- includes tabs.html (how to get it here.)
In your base.html you could have your {% block tabs %}:
{% block tabs %}{% endblock %}
And in your page.html:
{% extends "base.html" %}
{% block tabs %}
{% include "includes/tabs.html" with active_tab='tab1' %}
{% endblock %}
If this isn't enough DRY for you you can maybe crate a custom inclusion tag for your tabs.
Related
{% if movies.has_other_pages %}
<ul class="pagination">
{% if movies.has_previous %}
<li class="pagination-item">
Previous
</li>
{% else %}
<li class="pagination-item">
<a>Previous</a>
</li>
{% endif %}
{% for i in movies.paginator.page_range %}
{% if movies.number == i %}
<li class="pagination-item current-page"><a>{{i}}</a></li>
{% else %}
<li class="pagination-item">{{i}}</li>
{% endif %}
{% endfor %}
</ul>
{% endif %}
I'm trying to use paginator in django but it seems like something is wrong but I can't seem to figure it out.
I have a base template that I'm trying to extend. With in that template I have a navigation that needs a variable passed.
What I was doing was trying to 'extend' it by using an include like so:
{% include "base.html" with active_nav='atInventory' %}
but this doesn't render the blocks of the base with the extended content in the right order.
The navigation is set up in the base like so:
<nav class="col-xs-12 paddingVertical-sm">
<ul class="removePadding removeMargin txtXxs">
<li class="{% if active_nav == 'atContact' %} activeNav {% else %} inactiveNav{% endif %}">
<a href="{% url 'contact' %}">CONTACT<a>
</li>
<li class="{% if active_nav == 'atAbout' %} activeNav {% else %} inactiveNav{% endif %}">
ABOUT
</li>
<li class="{% if active_nav == 'atProjects' %} activeNav {% else %} inactiveNav{% endif %}">
PROJECTS & CLINICS
</li>
<li class="{% if active_nav == 'atServices' %} activeNav {% else %} inactiveNav{% endif %}">
SERVICS
</li>
<li class="{% if active_nav == 'atInventory' %} activeNav {% else %} inactiveNav{% endif %}">
INVENTORY
</li>
<li class="{% if active_nav == 'atHome' %} activeNav {% else %} inactiveNav{% endif %}">
HOME
</li>
<br class="clear-fix">
</ul>
<img src="{% static 'images/assets/klossviolins_logo.png' %}" />
<br class="clear-fix">
</nav>
Is there a better way to do this? Or does this just require a slight tweak? Thanks in advance for any help on this.
nI wouldn't do this - extend it the way it was intended. Include is for including reusable components. Here you just want every template to extend your 'base.html' with {%extends 'base.html'%}
Just a pointer as well - I'd do the active nav with a tiny script instead of tons of if statements. So add an ID to each li element (#nav-home for index in my example), and on your home page have something like:
<script>
$(document).ready(function() {
$( "#nav-home").addClass("activeNav");
});
</script>
I am developing a Django application, i had some problem,
I hope to do the following effects on Django,
<div id='cssmenu'>
<ul>
<li class='active'><a href='#'><span>Home</span></a></li>
<li><a href='#'><span>Products</span></a></li>
<li><a href='#'><span>Company</span></a></li>
<li class='last'><a href='#'><span>Contact</span></a></li>
</ul>
</div>
Django Code,
<div id='cssmenu'>
{% for child in children %}
{% cycle 'active' 'last' as cssmenu silent %}
<li class="{{ cssmenu }}">
{{ child.get_menu_title }}
{% if child.children %}
<ul>
{% show_menu from_level to_level extra_inactive extra_active template "" "" child %}
</ul>
{% endif %}
</li>
{% endfor %}
</div>
Could you help me?
That's not what cycle is for: it's for alternating between two or more alternatives. You don't want that at all.
Instead, just use the forloop attributes:
{% for child in children %}
<li class="{% if forloop.first %}active{% elif forloop.last %}last{% endif %}">...</li>
{% endfor %}
Although I suppose you don't want the first one to always be active, but you haven't given any information about how you do want to determine where 'active' goes.
I'm using django-paginate and getting weird formatting issues with the {% paginate %} tag. I have attached an image of the problem.
I was just wondering what could be potentially causing this?
In the image below I'm on the first page. Notice that the 1 is cut off and also that the pages are strangely ordered and the previous/next is not really visible.
My template is just this for now:
{% extends "base.html" %}
{% load mptt_tags %}
{% load pagination_tags %}
{% load i18n %}
{% block body %}
{% autopaginate parts 20 %}
{% paginate %}
That's not related to Django, neither to Django-Paginate. It seems that you're using Bootstrap as your front-end framework, and that implies issues such that.
I've implemented a similar approach for this site manoomit.com, creating a custom template for managing pagination within django-paginate.
It looks like that:
{% if is_paginated %}
{% load i18n %}
<div class="pagination pagination-centered">
<ul>
{% if page_obj.has_previous %}
<li>‹‹ {% trans "previous" %}</li>
{% else %}
<li class="disabled">‹‹ {% trans "previous" %}</li>
{% endif %}
{% for page in pages %}
{% if page %}
{% ifequal page page_obj.number %}
<li class="active">{{ page }}</li>
{% else %}
<li>{{ page }}</li>
{% endifequal %}
{% else %}
...
{% endif %}
{% endfor %}
{% if page_obj.has_next %}
<li>{% trans "next" %} ››</li>
{% else %}
<li class="disabled">{% trans "next" %} ››</li>
{% endif %}
</ul>
</div>
{% endif %}
I'm working on a project where there's some specific styling on a menu item which has nested children. The menu structure looks something like this
Home
|
About
|
Services
|_ web design
|_ social marketing
|_ traditional marketing
I'm using {% show_menu 0 100 100 100 "menu.html" %} in my template and I have the following inside my menu.html:
{% load menu_tags %}
{% for child in children %}
<li class="{% if child.selected %}active{% endif %}{% if child.sibling %}dropdown{% endif %}">
{{ child.get_menu_title }}
{% if child.children %}
<ul>
{% show_menu from_level to_level extra_inactive extra_active template "" "" child %}
</ul>
{% endif %}
</li>
{% endfor %}
I put {% if child.sibling %}dropdown{% endif %} in there to illustrate where I want the class to be added, but targeting it as a child.sibling is not the right way of doing it. Is there a way to target the specific dropdown like this {% if child.has_children %}dropdown{% endif %}?
Thanks
{% if child.children %}...{% endif %}