I have a class based view which shows the data in template having {% extends 'base.html' %}.
My base file folder is in seperate folder called products
My App url
urlpatterns = [
url(r'^contact/', views.contact, name='contact'),
url(r'^product_list/', views.ProductViewList.as_view(), name='ProductViewList'),
]
Template of class based view (product_list.html)
{% extends 'base.html' %}
{% block content %}
{{ object_list }}
{% endblock %}
My base.html
{% load staticfiles %}
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
<meta name="description" content="">
<meta name="author" content="">
<link rel="icon" href="{% static 'img/favicon.ico' %}">
<title>Starter Template for Bootstrap</title>
<link href="{% static 'css/bootstrap.min.css' %}" rel="stylesheet">
<link href="{% static 'css/starter-template.css' %}" rel="stylesheet">
</head>
<body>
{% include 'navbar.html' %}
<div class="container">
{% block content %}
{% endblock %}
</div><!-- /.container -->
<!-- Bootstrap core JavaScript
================================================== -->
<!-- Placed at the end of the document so the pages load faster -->
<script src="{% static 'js/jquery.min.js' %}"></script>
<script>window.jQuery || document.write('<script src="../../assets/js/vendor/jquery.min.js"><\/script>')</script>
<script src="{% static 'js/bootstrap.min.js' %}"></script>
<!-- IE10 viewport hack for Surface/desktop Windows 8 bug -->
<script src="{% static 'js/ie10-viewport-bug-workaround.js' %}></script>
</body>
</html>
When i visit "http://127.0.0.1:8000/product/product_list/" following error pops up
My directory structure, My base.html is in root directory(templates) and product_list.html is in products folder
I think there could be problem with {% extends 'base.html' %}, But not sure how to sole the problem.......Any help is much appreciated
Here's my first urls...which further redirects to my app url.py
from django.conf.urls import url, include
from django.contrib import admin
urlpatterns = [
url(r'^admin/', admin.site.urls),
url(r'^product/', include('products.urls')),
url(r'^accounts/', include('registration.backends.default.urls')),
]
You need to specify a name to the view url that identify when you want to used in the template
from django.conf.urls import url
import myapplication.views
app_urlpatterns = [
url(r'^article/(\d+)/$',views.article_detail,name='article-view-url'),
]
And this is how I use the url name in my html template
{% for article in articles.object_list %}
<article>
<h3>
{{ article.name }}
</h3>
<p>
{{ article.desc }}
</p>
</article>
{% endfor %}
Related
I'm new to django and currently trying to find an effective way to load css files in the django templating language depending on the current page. The url pattern is :
path('invoices/', views.list, name='invoice_list'),
path('invoices/new/', views.create, name='create_invoice'),
path('invoices/<int:pk>/', views.edit, name='edit_invoice'),
path('invoices/<int:pk>/lines/new', views.create_line, name='create_line'),
path('invoices/<int:pk>/lines/<int:fk>', views.update_line, name='update_line'),
In the base.html, this is what i'm doing:
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="{% static 'invoice/css/common.css' %}">
{% if request.path == '/invoices/'%}
<link rel="stylesheet" href="{% static 'invoice/css/invoice_list.css' %}">
{% endif %}
{% if '/invoices/' in request.path and request.path != '/invoices/' and '/line/' not in request.path %}
<link rel="stylesheet" href="{% static 'invoice/css/edit_invoice.css' %}">
{% endif %}
<title>My invoices </title>
</head>
the {% if '/invoices/' in request.path and request.path != '/invoices/' and '/line/' not in request.path %} is not great at all and would like to know if there's a nicer way to do it regexp style maybe?
Thanks in advance.
You should not put such logic in the template. Instead you should use the block and extends template tag for this purpose. See Template inheritance [Django docs]:
In base.html:
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="{% static 'invoice/css/common.css' %}">
{% block extra_css %}
{% endblock extra_css %}
<title>My invoices </title>
</head>
Now in the template which is rendered when if request.path == '/invoices/' is true, you will fill this block as:
{% extends "base.html" %}
...
{% block extra_css %}
<link rel="stylesheet" href="{% static 'invoice/css/invoice_list.css' %}">
{% endblock extra_css %}
Similarly In the template which is rendered when if '/invoices/' in request.path and request.path != '/invoices/' and '/line/' not in request.path is true you you will fill the block as:
{% extends "base.html" %}
...
{% block extra_css %}
<link rel="stylesheet" href="{% static 'invoice/css/edit_invoice.css' %}">
{% endblock extra_css %}
I'm working on a website, where I want to show all my django project.
So, I have a main app, where i'm generating template for all my projects
my home template when we access to the website:
<!doctype html>
{% load static %}
<html lang="fr">
<head>
<meta charset="UTF-8">
<title></title>
<link rel="stylesheet" type="text/css" href="{% static 'home/css/style.css' %}">
<link rel="preconnect" href="https://fonts.gstatic.com">
<link href="https://fonts.googleapis.com/css2?family=Nerko+One&family=Roboto&display=swap&family=Open+Sans&display=swap" rel="stylesheet">
<meta name="viewport" content="width=device-width"/>
</head>
<body>
<header>
<h1></h1>
<span class="separator"></span>
<h2></h2>
<img src="{% static '/home/pictures/logo.png' %}" alt="logo" title="Ceci est mon logo" id="logo">
</header>
<nav>
<ul>
<li>Accueil</li>
<li>Projets</li>
<li>Contact</li>
</ul>
</nav>
<div class="contener">
<section>
<h3>Projets</h3>
<!-- conteneur -->
<div id="projects">
{% for projet in projets %}
<div class="project">
<a href="{% url 'projet-detail' projet.nom_lien %}">
<div class="picture">
<img src="{% static '' %}{{ projet.lien_image_presentation }}" alt="Présentation {{ projet.nom }}">
</div>
<span>{{ projet.nom }}</span>
<span class="date-project">{{ projet.date }}</span>
</a>
</div>
{% endfor %}
</div>
</section>
<section>
<h3>Contact</h3>
<div id="contact">
<p>Si vous désirez me contacter, n'hésitez pas à m'écrire à l'adresse <b>aymerick.cotche#hotmail.fr</b></p>
</div>
</section>
</div>
<footer>
<span>2020 © - Aymerick Cotche</span>
</footer>
</body>
</html>
template to see my project description :
{% load static %}
<html lang="fr">
<head>
<meta charset="UTF-8">
<title>{{ projet.nom }} | {{ projet.auteur }}</title>
<link rel="stylesheet" type="text/css" href="{% static 'home/css/style.css' %}">
<link rel="preconnect" href="https://fonts.gstatic.com">
<link href="https://fonts.googleapis.com/css2?family=Nerko+One&family=Roboto&display=swap&family=Open+Sans&display=swap" rel="stylesheet">
<meta name="viewport" content="width=device-width"/>
</head>
<body>
<header>
<h1></h1>
<span class="separator"></span>
<h2>{{ projet.nom }}</h2>
</header>
<nav>
<ul>
<li>Accueil</li>
<li>Projets</li>
<li>Contact</li>
</ul>
</nav>
<div class="contener">
<section>
<h3>Introduction</h3>
<p> {{ projet.description }} </p>
</section>
<section id="production_project">
<h3>Production</h3>
<img src="{% static '' %}{{ projet.lien_image_production }}" alt="mon premier projet">
voir le projet
</section>
</div>
</body>
</html>
my urls file for this app:
from django.urls import path
from home import views
urlpatterns = [
path('', views.home),
path('<str:nom_lien>/', views.projet_detail, name='projet-detail'),
]
My views file for this app :
from django.shortcuts import render, redirect
from home.models import Projet
def home(request):
projets = Projet.objects.all().order_by('numero')
return render(request, 'home/index.html', {'projets': projets})
def projet_detail(request, nom_lien):
projet = Projet.objects.get(nom_lien=nom_lien)
context = {
'projet': projet
}
return render(request, 'home/projets_base.html', context)
That I want to do it's to have a link in my project description template, to go to the project, and use the project. The project it's another django app in the same project. and this link should be like "/nom-lien/voirprojet/"
For example in my app "pizza mama" I have this url and views file:
from django.urls import path
from . import views
app_name = "main"
urlpatterns = [
path('pizzamama/voirprojet/', views.index, name="index"),
]
The link have to use the Projet.nom_lien field in my database and redirect to the the project page.
Could someone help me please, I'm stuck and can't make it works.
you want to store the link in the database
define in models.py a class Project
class Project(models.Model):
link_to_app = models.CharField(max_length=50)
register it in the admin.py
in the admin panel enter the what you want Links
then you can access it like this in urls.py
from .models import Link
link = Projects.objects.get(pk=1)
my_link = link.link_to_app
then pass my_link to the url path
urlpatterns += [
path(my_link, views.index, name='index')),
]
I'm working with Django1.8.
I can't overtwrite the version_tag block in my base.html file. It always appears the default content.
This is a simplified version of my base.html:
{% load staticfiles %}
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link href="{% static 'myApp/img/favicon.png' %}" rel="icon" type="image/png" />
<title>{% block title %}{% endblock %}</title>
<link rel="stylesheet" type="text/css" href="{% static 'myApp/lib/css/bootstrap.min.css' %}" />
<link rel="stylesheet" type="text/css" href="{% static 'myApp/lib/css/themes/bootstrap.min.css' %}" />
<script type="text/javascript" src="{% static 'myApp/lib/js/jquery.min.js' %}"></script>
</script>
</head>
<body>
<div id="main">
{% block menu %}
{% include "myApp/menu.html" %}
{% endblock menu %}
<div id="container" class="container-fluid">
{% block content %}
{% endblock content %}
</div>
</div>
{% block version_tag %}Default Version{% endblock version_tag %}
</body>
</html>
On the same folder I have the version_tag.html file:
{% extends 'myApp/base.html' %}
{% block version_tag %}
V. 1.2.3
{% endblock %}
What am I missing or doing wrong? Why does it always appear Default Version instead of V. 1.2.3?
There are only two possible causes I can think of:
Your view is still trying to render base.html instead of your inherited html template.
Simply change the view to call the correct one (version_tag.html)
The template you're really trying to display is still inheriting from base.html instead of version_tag.html
I am getting an error message while adding a template to base.html with include tag. All other templates are rendered properly with no issues but this got issues while I try to add it. The error is:
RuntimeError at /
maximum recursion depth exceeded in __instancecheck__
Request Method: GET
Request URL: http://127.0.0.1:8000/
Django Version: 1.8.5
Exception Type: RuntimeError
Exception Value:
maximum recursion depth exceeded in __instancecheck__
Exception Location: C:\Python27\lib\site-packages\django\template\base.py in __init__, line 743
Python Executable: C:\Python27\python.exe
Python Version: 2.7.11
Python Path:
['C:\\Users\\TOSHIBA\\market\\market',
'C:\\WINDOWS\\SYSTEM32\\python27.zip',
'C:\\Python27\\DLLs',
'C:\\Python27\\lib',
'C:\\Python27\\lib\\plat-win',
'C:\\Python27\\lib\\lib-tk',
'C:\\Python27',
'C:\\Python27\\lib\\site-packages',
'c:\\python27\\lib\\site-packages']
My template I am trying to add includes:
{% extends 'base.html' %}
{% block content %}
<!-- recommend slider -->
<section class="recommend container">
<div class="recommend-product-slider small-pr-slider wow bounceInUp">
<div class="slider-items-products">
<fieldset class="box-title">
<legend>Recommended </legend>
</fieldset>
<div id="recommend-slider" class="product-flexslider hidden-buttons">
<div class="slider-items slider-width-col3">
{% include 'products/product.html' with object_list=products col_class_set="col-sm-2" %}
</div>
</div>
</div>
</div>
</section>
<!-- End Recommend slider -->
{% endblock content %}
My base.html code is as follows:
{% load static %}
{% load staticfiles %}
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<!--[if IE]>
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<![endif]-->
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="Dressika Theme">
<meta name="author" content="Harira Ijaz">
<title>Dressika Online Shopping Store</title>
<!-- Favicons Icon -->
<link rel="icon" href="{% static 'images/favicon.png' %}" type="image/x-icon" />
<link rel="shortcut icon" href="{% static 'images/favicon.png' %}" type="image/x-icon" />
<!-- Mobile Specific -->
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<!-- CSS Style -->
<link rel="stylesheet" href="{% static 'css/animate.css' %}" type="text/css">
<link rel="stylesheet" href="{% static 'css/bootstrap.min.css' %}" type="text/css">
<link rel="stylesheet" href="{% static 'css/style.css' %}" type="text/css">
<link rel="stylesheet" href="{% static 'css/revslider.css' %}" type="text/css">
<link rel="stylesheet" href="{% static 'css/owl.carousel.css' %}" type="text/css">
<link rel="stylesheet" href="{% static 'css/owl.theme.css' %}" type="text/css">
<link rel="stylesheet" href="{% static 'css/font-awesome.css' %}" type="text/css">
<link rel="stylesheet" href="{% static 'css/product-detail.css' %}" type="text/css">
<link href="//maxcdn.bootstrapcdn.com/font-awesome/4.1.0/css/font-awesome.min.css" rel="stylesheet">
<!-- Google Fonts -->
<link href='https://fonts.googleapis.com/css?family=Open+Sans:300italic,400italic,600italic,700italic,800italic,300,700,800,400,600' rel='stylesheet' type='text/css'>
</head>
<body class="cms-index-index">
<div class="page">
{% include 'header.html' %}
{% include 'navbar.html' %}
</div>
<!-- header service -->
<!-- end header service -->
{% include 'slider.html' %}
{% include 'offerbanner.html' %}
{% include 'container.html' %}
{% include 'featured.html' %}
{% include 'trending.html' %}
{% include 'middleslider.html' %}
{% include 'recommend.html' %}
{% include 'latestblog.html' %}
{% include 'footer.html' %}
</div>
{% include 'java.html' %}
</body>
</html>
Your template extends from base.html which then needs to include the template, which then needs to extend from base.html which then needs to include the template, which then needs to extend from base.html then needs to include the template, which then needs to extend from base.html...
Remove {% extends 'base.html' %} from the template you're trying to include as well as any reference to blocks.
I've 2 templates. Here is the listing:
1)base.html
<!DOCTYPE html>
<html>
<head>
{% load staticfiles %}
<link type="text/css" rel="stylesheet" href={% static 'resume/stylesheet.css'%}/>
<title>{% block title %}{% endblock %}</title>
</head>
<body>
<div id=header> some info </div>
{% block content %}{% endblock %}
</body>
</html>
2)person.html
{% extends "base.html" %}
{% block title %}Personal info{% endblock %}
{% block content %}
<div>{{person.first_name}}</div>
{% endblock %}
I use template "person.html" in my view
def person_view(request):
person = get_object_or_404(Person, pk=1)
return render(request, "resume/person.html", {'person': person})
urls.py:
url(r'^$', views.person_view, name='person'),
The problem is, when I run the server, and trying to open page with this url, there is only text and information from "person.html" template(meaning of "person.first_name"). Information from "base.html" and css styles don't used.
You forgot double quotes:
<link type="text/css" rel="stylesheet" href={% static 'resume/stylesheet.css'%}/>
should be:
<link type="text/css" rel="stylesheet" href="{% static 'resume/stylesheet.css'%}"/>
Edit
here as well:
<div id=header>
should be:
<div id="header">