while the 'unread_list' API works, I cannot get the tag {% live_notify_list list_class="dropdown-menu" %} to work.
The tag definition is:
def live_notify_list(list_class='live_notify_list'):
html = "<ul class='{list_class}'></ul>".format(list_class=list_class)
return format_html(html)
correct me if I am wrong, but this doesn't do anything but returning an unsorted list. I would like to display all the notifications. According to the documentation (documentation) all I need to do is to use {% live_notify_list %} however, this doesn't display anything.
The library I am using at github.
DevKing, hopefully you have solved the issue. To give more context, the {% live_notify_list %} is used for getting real-time updates of notifications that can be used in a dropdown on a navbar. A user can click and get a dropdown of the most recent notifications (the default is 5). If you want a list of all notifications, you can provide a link to {% url 'notifications:unread' %}.
You will need to include this
{% load notifications_tags %}
<script src="{% static 'notifications/notify.js' %}" type="text/javascript"></script>
{% register_notify_callbacks callbacks='fill_notification_list,fill_notification_badge' %}
And then you can place this within your navbar
<li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown">
Notifications {% live_notify_badge %}
<span class="glyphicon glyphicon-user pull-right">
</span>
</a>
<ul class="dropdown-menu" id="notice-link">
<a href="{% url 'notifications:unread' %}">
{% live_notify_list %}
</a>
</ul>
</li>
The {% live_notify_badge %} will show you the number of unread notifications while the {% live_notify_list %} will provide the list of recent notifications. The js added above will pull new notifications every 15 seconds (which you can make shorter/longer).
Related
This question already has answers here:
How do i show an active link in a django navigation bar dropdown list?
(4 answers)
Closed 2 years ago.
When a navigation link is clicked and page is redirected to that link, I am trying to highlight the active link in the nav bar. I was able to achieve the highlighting by using if and else. But I would like to know is there any way better than this. Right now I have to duplicate this code again and again.
<li class="nav-item">
<a
{% if request.path == '/register' %}
class="active nav-link"
{% else %}
class="nav-link"
{% endif %}
href=" {% url 'register' %} ">
Register
</a>
</li>
If you set the nav item URL as a variable, you can use it for the href and a check to see if it's the current page.
{% url 'about' as url %}
<li class="nav-item {% if request.path == url %}active{% endif %}">
<a class="nav-link" href="{{ url }}">About</a>
</li>
I'm using Flask for a small web app and having trouble to get my background image to display after extending using Jinja.
My layout.html contains a header:
<!-- Header section -->
<header class="header-section">
<div class="header-warp">
<div class="container">
<a href="#" class="site-logo">
<img src="{{ url_for('static', filename='img/logo.png') }}" alt="">
</a>
<div class="user-panel">
{%if session.user_id %}
Logout
{% endif %}
</div>
<div class="nav-switch">
<i class="fa fa-bars"></i>
</div>
</div>
</div>
</header>
<!-- Header section end -->
<main>
{% block main %}
{% endblock %}
</main>
And in another html file, I want to extend the layout:
{% extends "layout.html" %}
{% block title %}
Register
{% endblock %}
{%block main%}
<section class="hero-section set-bg" data-setbg="{{ url_for('static', filename='img/review-bg.jpg') }}">
However, the review-bg.jpg doesn't load and instead, I received a blank section. However, when I straight up copying the layout (not using extends anymore), the image loaded correctly. I double checked with (http://127.0.0.1:5000/static/img/review-bg.jpg) and the path correctly return the image.
Anyone can help explain to me why Jinja doesn't load the image after extending?
The problem seems to be in data-setbg - it can be React script, look here:
html tag attribute "data-setbg" is not working in React project
Or try to google "data-setbg is not working"
Edit the extension to:
{% extends "layout.html" %}
{% block title %}
Register
{% endblock %}
{%block main%}
<img src="{{ url_for('static', filename='img/review-bg.jpg') }}" alt="">
Do you see the image now? If so (what I suspect), it's not jinja/flask related but something else is going on. If not, right click on the page in firefox and press view source. Where is the link pointing to?
I'm new to django and django-cms. I read the official docs and tried to find any other info on the internet, that could guide me through making dropdown menus in django cms. But unfortunately for me, the official docs are really raw (I don't get it at all what's about the menus) and on the internet there's nothing sensible enough.
Please explain me or give a step by step guide on this topic.
At this moment the menu is working and the only code that I have for that is a pair of <ul> and this {% show_menu 0 100 100 100 %} inside them.
The most simple way to get dropdowns working in django-cms is to follow this:
(In this example I am using Bootstrap code for my menu)
In your base.html file (or any other name that you are using) use this way of showing your menu {% show_menu 0 10 10 10 %}
As an example, this is what i used in my code in base.html to render the menu:
<ul>
{% show_menu 0 10 10 10 "menu/custom-menu.html" %}
</ul>
Now create the template in the directory "/templates/menu/custom-menu.html" with these sekizai tags and similar html code that will overwrite your base.html and render your menu with drop-down elements:
<div class="dropdown">
{% for child in children %}
<!-- no child pages -->
{% if child.is_leaf_node %}
<li>{{child.get_menu_title }}</li>
{% endif %}
<!-- /no child pages -->
<!-- has child pages -->
{% if not child.is_leaf_node or child.ancestor %}
<li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown">
{{child.get_menu_title }}<b class="caret"></b></a>
<ul class="dropdown-menu">
{% if child.get_descendants %}
{% for kid in child.get_descendants %}
<li>
<a href="{{ kid.get_absolute_url }}">
{{kid.get_menu_title }}
</a>
</li>
{% endfor %}
{% endif %}
</ul>
</li>
{% endif %}
<!-- /has child pages -->
{% endfor %}
<!-- /end for child -->
</div>
And dont forget to put the {% load menu_tags %} sekizai tag in the top of your custom-menu.html file.
I'm using Django flatpages and trying to pass the title of a flatpage as part of an html include.
{% block navbar %}
{% include 'navbar.html' with active='{{flatpage.title}}' %}
{% endblock %}
This is so I can highlight the whereabouts in the navigation bar.
<ul class="nav navbar-nav">
<li class="{% if active == 'home' %}active{% endif %}">Home</li>
etc.
</ul>
It doesn't appear to render correctly. Whereas if I replace {{flatpage.title}} with a hard-coded value ie. 'home' it works just fine.
{% block navbar %}
{% include 'navbar.html' with active='home' %}
{% endblock %}
Am I not able to do this?
I'm not clear on a way to debug Django templates to check for these values... The way I'm currently checking that the variable is passing the right value is simply to reference {{flatpages.title}} elsewhere, separately in the html - which appears to render the correct 'home' value I'd expect.
<div id="navbar" class="navbar-collapse collapse">
<ul class="nav navbar-nav">
<li class="{% if active == 'home' %}active{% endif %}">Home</li>
{{flatpage.title}}
etc.
</ul>
</div>
You do not need to surround arguments in {{ }} brackets in template tags.
If it's a variable, not a string, then do not use "" quotes.
The following should work:
{% block navbar %}
{% include 'navbar.html' with active=flatpage.title %}
{% endblock %}
see include section to more informations
I'm building a simple blog app using Django.
This app has a main template blog.html which is shared between the following views:
blog (url: /blog/[page number])
Main page of the blog, displays the last articles
search (url: /search/<query>/[page number])
Will display the articles who match the query
category (url: /category/<category name>/[page number])
Will display the articles from the given category
Each a this views provides the template blog.html with an object page obtained using the function Paginator each time with a different objects list (depending on the view).
Here is my problem:
The template blog.html contains a pager
<ul class="pager">
{% if page.has_previous %}
<li class="previous">
<a href="{{ url_previous_page }}" class="btn btn-primary" >← Older</a>
</li>
{% endif %}
{% if page.has_next %}
<li class="next">
<a href="{{ url_next_page }}" class="btn btn-primary" >Newer →</a>
</li>
{% endif %}
</ul>
How can I define in an elegant way the values of url_next_page and url_previous_page in all the views?
You shouldn't really need to supply the links for the next and previous buttons like that. I would suggest changing your pagination code to be something like this:
<div class="pagination-wrap">
<span class="pagination-links">
{% if page_obj.has_previous %}
{% endif %}
<span class="current">
{{ page_obj.number }} of {{ page_obj.paginator.num_pages }}
</span>
{% if page_obj.has_next %}
{% endif %}
</span>
<div>{{ page_obj.start_index }} to {{ page_obj.end_index }} of {{ page_obj.paginator.count }}</div>
</div>
In your views, all you need to specify is the number of objects to paginate by with paginate_by = 15.
If you really want to, you could create a mixin for your list views to use which has a method that could return the url you want.