I'm trying to apply a parallax template to my django blog but i seem to be running into a snag
class BlogIndex(generic.ListView):
queryset = models.BlogPost.objects.published()
template_name = "blog/blogindex.html"
paginate_by = 5
I have this view in my views for my blog app.
Now the problem is I four divs I want to split this view into and render into the template.
<section class="module parallax parallax-1">
<div class="container">
</div>
</section>
<section class="module content">
<div class="container">
{{ view goes here }}
</section>
<section class="module parallax parallax-2">
<div class="container">
</div>
</section>
<section class="module content">
<div class="container">
{{ view goes here }}
</div>
</section>
<section class="module parallax parallax-3">
<div class="container">
</div>
</section>
<section class="module content">
<div class="container">
{{ view goes here }}
</div>
</section>
<section class="module parallax parallax-4">
<div class="container">
</div>
what would be the best way to render my blog posts in each div?
You may be able to get the desired effect by taking advantage of the for loop counters.
Django's {% for %} template generates custom variables within the loop. These include:
forloop.counter: The current iteration of the loop (1-indexed)
forloop.counter0: The current iteration of the loop (0-indexed)
forloop.revcounter: The number of iterations from the end of the loop (1-indexed)
forloop.revcounter0: The number of iterations from the end of the loop (0-indexed)
forloop.first: True if this is the first time through the loop
forloop.last: True if this is the last time through the loop
forloop.parentloop For nested loops, this is the loop surrounding the current one
(via https://docs.djangoproject.com/en/1.8/ref/templates/builtins/#for)
Using your example, you may be able to do something like this
{% for object in object_list %}
<section class="module parallax parallax-{{ forloop.counter }}">
<div class="container">
</div>
</section>
<section class="module content">
<div class="container">
{{ object }}
</div>
</section>
{% endfor %}
Related
I Need your help please.
My envirenement is:
python 3.6.6
django 2.2
I want to generate some code like this using django template.
<div class="card-deck">
<div class="card">
actu1
</div>
<div class="card">
actu2
</div>
<div class="card">
actu3
</div>
<div class="card">
actu4
</div>
</div>
<!--insert inside a new div (with class card-deck) the 5th actu and next one-->
<div class="card-deck">
<div class="card">
actu5
</div>
<div class="card">
actu6
</div>
<div class="card">
actu7
</div>
<div class="card">
actu8
</div>
</div>
<!--insert inside a new div (with class card-deck) the 9th actu and next one-->
what I manage to do with django templates is as follows:
{% extends 'actu/base_actu.html'%}
{% load static %}
{%block actumain%}
<div class="card-deck">
{%for actu in actu%}
<div class="card">
{ {actu.content }}
</div>
{%endfor%}
</div>
{%endblock%}
which just gives the code as follows:
<div class="card-deck">
<div class="card">
actu1
</div>
<div class="card">
actu2
</div>
<div class="card">
actu3
</div>
<div class="card">
actu4
</div>
<div class="card">
actu5
</div>
<div class="card">
actu7
</div>
<div class="card">
actu8
</div>
<div class="card">
actu9
</div>
<div class="card">
actu10
</div>
<div class="card">
actu11
</div>
<div class="card">
actu...
</div>
</div>
Please, could you give me your idea to be able to generate such a code.
Thank you very much.
Use the forloop.counter0 and the divisibleby tempate tag like this:
{% for actu in actu %}
{% if forloop.counter0|divisibleby:"4" and not forloop.first %}
</div>
{% endif %}
{% if forloop.counter0|divisibleby:"4" %}
<div class="card-deck">
{% endif %}
<div class="card">
{{ actu.content }}
</div>
{% if forloop.last %}
</div>
{% endif %}
{% endfor %}
Here we first check if the loop counter is divisible by 4 and not the first iteration if yes we render the closing div tag.
Next we if the loop counter is divisible by 4 and if so we render the opening div tag.
After this we render the individual cards.
Next we check if this is the last iteration if so we render the closing div tag.
{% for item in actu %}
{% if forloop.counter0|divisableby:4 %}
<div class="card-deck">
{% endif %}
<div class="card">
{{ item.content }}
</div>
{% if forloop.counter0|divisableby:4 or forloop.last %}
</div>
{% endif %}
{% endfor %}
I am new in Django and I am trying to do my project and I have an issue in that project. in my project, I have a view job button and whenever I click on any job or view job then it will redirect to another page and on that page, I want to show a full description of that job so please help me. thank you.
this is my views.py
def BrowseJob(request):
all_job = jobs.objects.all()
myFilter = jobsFilter(request.GET, queryset = all_job)
all_job = myFilter.qs
return render(request,'jobs.html',{'all_job':all_job,'myFilter':myFilter})
this is urls.py
from django.urls import path
from . import views
urlpatterns = [path('',views.index,name='index'),
path('Browse_Job',views.BrowseJob,name='Browse_Job'),
path('contact',views.contact,name='contact'),
path('job_details',views.jobdetails,name="job_details")]
this is my job.html
{% for job in all_job %}
<div class="job_lists">
<div class="row">
<div class="col-lg-12 col-md-12">
<div class="single_jobs white-bg d-flex justify-content-between">
<div class="jobs_left d-flex align-items-center">
<div class="thumb">
<img src="{{job.job_img.url}}" alt="">
</div>
<div class="jobs_conetent">
<h4>{{job.job_name}}</h4>
<div class="links_locat d-flex align-items-center">
<div class="location">
<p> <i></i>{{job.job_Category}}</p>
</div>
<div class="location">
<p> <i></i>{{job.job_Experience}}</p>
</div>
</div>
</div>
</div>
<div class="jobs_right">
<div class="apply_now">
View Job
</div>
<div class="date">
<p>Last Date for Apply: {{job.last_date}}</p>
</div>
</div>
</div>
</div>
</div>
</div>
{% endfor %}
this is my jobdetails.html
{% for job in all_job %}
<img src="{{job.job_details.url}}" alt="">
{% endfor %}
please help me.
Actually to redirect in django using names in urls.py you need to write 'href' like this
<h4>{{job.job_name}}</h4>
Instead of
<h4>{{job.job_name}}</h4>
then it will work as you expected
refer this for more details :https://docs.djangoproject.com/en/3.1/ref/templates/builtins/
I tried filtering some data using the .filter and it doesn't display. When I try displaying all of them without filtering, it displays everything...but when I try filtering, nothing works.
class Part_Time_DM(models.Model):
Location=models.CharField(max_length=15, default="location")
def PartFilterView(request):
qs = Part_Time_DM.objects.all()
location_query= request.GET.get('location')
qs = qs.filter(location__icontains=location_query)
return render(request, 'home.html', {"qs" : qs})
<!-- Team -->
<section id="team" class="pb-5">
<div class="container">
<div class="row">
{% for fulls in qs %}
<!-- Team member -->
<div class="col-xs-12 col-sm-6 col-md-4">
<div class="card two">
<img src="{{ fulls.Profile_picture.url }}" alt="John" style="width:40%">
<h1>{{fulls.Name}}</h1>
<p class="title two">Location : {{fulls.Location}}</p>
<br>
</div>
</div>
<!-- ./Team member -->
{% endfor %}
</div>
</div>
</section>
<!-- Team -->
I'm currently building a blog+portfolio with Django and Bootstrap 4.
The problem is when I try to show two columns, Articles next to my Profile. Both columns are in an HTML table, but for some reason, they do not show correctly.
For example:
How it looks like using HTML,CSS, and Bootstrap
Here is how it looks when I insert everything on my Base_layout.html
How it looks like when it is inserted in my django Base_layout.html
Here is my Base_layout, which has the code inside the table to show the articles of the blog ({% load bootstrap4 %} {% load static from staticfiles %} are included in the top of the document):
<div class="container">
<div class="row">
<!-- Blog Entries Column -->
<div class="col-md-8">
<div class="card mb-4" class="article-detail">
{% block content %}
{% endblock %}
</div>
</div>
<!-- Pagination -->
<ul class="pagination justify-content-center mb-4">
<li class="page-item">
<a class="page-link" href="#">← Older</a>
</li>
<li class="page-item disabled">
<a class="page-link" href="#">Newer →</a>
</li>
</ul>
</div>
<!-- Sidebar Widgets Column -->
<div class="col-md-4">
<div class="card" style="width: 18rem;">
<img src="{% static 'profile.jpg' %}" class="rounded-circle card-img-top" alt="">
<div class="card-body">
<h5 class="card-title">Leandro Fraisinet</h5>
<p class="card-text">Some quick example text to build on the card title and make up the bulk of the card's content.</p>
More
</div>
</div>
</div>
</div>
</div>
Here is the code that is to be shown by Blog Entries Column
Article_list html:
{% extends 'base_layout.html' %}
{% load bootstrap4 %}
{% block content %}
<h1> </h1>
{% for article in articles %}
<div class="card-body" class="article">
<img class="card-img-top" src="{{ article.thumb.url}}" alt="Main post image">
<h2 class="card-title">{{article.title}}</h2>
<p class="card-text">{{article.snippet}}</p>
</div>
<div class="card-footer text-muted">
<p>{{article.date}}</p>
</div>
<h1> </h1>
{% endfor%}
{% endblock %}
I think that my main conflict is in Blog Entries Column but I do not know how to solve this.
Please any extra code that could be useful to solve this let me know.
Django version, 1.11 Phyton version 2.7, Bootstrap version 4.
You sidebar column is outside the row
<div class="row">
<!-- Blog Entries Column -->
<div class="col-md-8">
</div>
<!-- Pagination -->
<ul class="pagination justify-content-center mb-4">
</ul>
</div>
<!-- Sidebar Widgets Column -->
<div class="col-md-4">
</div>
try to put it inside:
<div class="container">
<div class="row">
<!-- Blog Entries Column -->
<div class="col-md-8"></div>
<!-- Sidebar Widgets Column -->
<div class="col-md-4"></div>
</div>
<!-- Pagination -->
<ul class="pagination justify-content-center mb-4"></ul>
</div>
I'm trying to get a bootstrap progress bar to work, but I'm running into a problem. I want to get the progress bar width from a Django variable, I use the templates language for this. The problem is, HTML changes the float variable (i.e 32.54) to a string (i.e 32,54). I'm not sure why this happens (my guess is encoding) but the width attribute will not work if the variable is not a number.
To clarify, this is my code.
Views.py:
def details(request):
estudio = request.GET.get('estudio', '')
uni = request.GET.get('uni', '')
campus = request.GET.get('campus', '')
result = Titulaciones.objects.raw('SELECT * FROM tasas t INNER JOIN titulaciones tit on t.codigo_titulacion = tit.codigo_titulacion INNER JOIN impartida_en imp ON tit.codigo_titulacion = imp.codigo_titulacion INNER JOIN centros cent ON imp.codigo_centro = cent.codigo_centro WHERE cent.universidad = %s and tit.nombre = %s and cent.campus =%s', [uni, estudio, campus]);
return render(request, 'proyecto_uni/details.html', {'result':result})
(If I print here, the variable still shows as a number).
details.html:
{% extends "base.html" %}
{% block content %}
{% for foo in result %}
<ul class="nav nav-tabs">
<li role="presentation"><a href="#tab1" >General</a></li>
<li role="presentation">Asignaturas</li>
<li role="presentation">Resultados</li>
</ul>
<!-- TAB 1 -->
<div id="tab1">
<div class="panel panel-primary">
<!-- Default panel contents -->
<div class="panel-heading">{{foo.nombre}}</div>
<div class="panel-body">
<h4>Universidad:</h4>
<p>{{ foo.universidad }}</p>
<hr class="m-y-2">
<h4>Campus:</h4>
<p>{{ foo.campus }}</p>
<hr class="m-y-2">
<h4>Descripción:</h4>
<p>Aquí debería ir la descripción</p>
<hr class="m-y-2">
<h4>Nota de corte:</h4>
<p>{{ foo.nota_corte }}</p>
</div>
</div>
</div>
<!-- TAB 2 -->
<div id="tab2">
<p>tab2</p>
</div>
<!-- TAB 3 -->
<div id="tab3">
<div class="panel panel-primary">
<div class="panel-heading">{{foo.nombre}}</div>
<div class="panel-body">
<div class="progress">
<div class="progress-bar progress-bar-success" style="width: {{foo.rendimiento}}%">
<span class="sr-only">{{foo.rendimiento}}% Complete (success)</span>
<!-- The problem is right above, in the width style tag -->
</div>
<div class="progress-bar progress-bar-warning" style="width: 2%">
<span class="sr-only">22% Complete (warning)</span>
</div>
<div class="progress-bar progress-bar-danger" style="width: 1%">
<span class="sr-only">1% Complete (danger)</span>
</div>
</div>
</div>
</div>
</div>
{% endfor %}
{% endblock%}
I posted all the code to make it easier to understand, hope I didn't make it more confusing. Anyways, thanks in advance!
Django formats numbers according to your localization settings. You can turn localization off by using:
{% load l10n %}
{% localize off %}
{{ foo.rendimiento }}
{% endlocalize %}
You can also unlocalize one single value:
{% load l10n %}
{{foo.rendimiento|unlocalize}}
Django format localization documentation