I have problem with Django templates. I want to create a base html, which I will use to display posts. I call a template from view, which includes an html file, where the file extends the base html.
view
def main(request):
all_posts = News.objects.all()
return render_to_response("index.html", {'all_posts': all_posts})
template -- index.html
<div id="content">
{% include 'content.html' with posts=all_posts%}
</div>
content.html
{% extends "content_base.html" %}
{% for post in posts %}
{% block date_of_post %} {{ post.date }} {% endblock %}
{% block post_author %} {{ post.author }} {% endblock %}
{% block post %} {{ post.content }} {% endblock %}
{% endfor %}
content_base.html
<div class="post">
<h2 class="title">{% block blabla %}{% endblock %}</h2>
<p class="meta"><span class="date">{% block date_of_post %}{% endblock %}</span><span class="posted">Posted by {% block post_author %}{% endblock %}</span></p>
<div style="clear: both;"> </div>
<div class="entry">
<p>
{% block post %} {% endblock %}
</p>
<p class="links">
Read More
Comments
</p>
</div>
</div>
But it seems like I cannot pass the *all_posts* variable to content.html. What is the problem here? Am I doing something wrong?
Thanks in advance.
You should move the loop into index.html, and include content_base.html directly. So index.html becomes:
<div id="content">
{% for post in posts %}
{% include 'content_base.html' %}
{% endfor %}
</div>
and content_base.html is
<div class="post">
<h2 class="title">{{ post.title }}</h2>
<p class="meta"><span class="date">{{ post.date }}</span><span class="posted">Posted by {{{ post.author }}</span></p>
<div style="clear: both;"> </div>
<div class="entry">
<p>
{{ post.content }}
</p>
<p class="links">
Read More
Comments
</p>
</div>
</div>
You're using blocks with identical names, because you're using them in a loop:
{% for post in posts %}
{% block date_of_post %} {{ post.date }} {% endblock %}
{% block post_author %} {{ post.author }} {% endblock %}
{% block post %} {{ post.content }} {% endblock %}
{% endfor %}
You can't do that. Look here.
Sometimes too much normalization is not so good. You can simply have index.html and all of your code can go there (avoiding unnecessary blocks).
<div id="content">
{% for post in all_posts %}
<div class="post">
<h2 class="title">{{post.title}}</h2>
<p class="meta"><span class="date">{{post.date}}</span><span class="posted">Posted by {{post.post_author}}</span></p>
<div style="clear: both;"> </div>
<div class="entry">
<p>
{{post.content}}
</p>
<p class="links">
Read More
Comments
</p>
</div>
</div>
{% endfor %}
</div>
Related
ASK
I'm trying to recreate bootstrap cards row layout with Tailwind within django framework
BLOCKER
However the tailwind attempt results in below
index.html -- bootstrap
{% extends 'base.html' %}
{% block title %}Home{% endblock title %}
{% block content %}
<div class="py-2">
<div class="row">
{% for t in object_list %}
<div class="col-md-3">
<div class="card mb-4 box-shadow bg-green-500">
<div class="card-body">
<h2 style="font-size:18px;font-weight:bold;min-height:42px;"><a class="text-dark" href="#">
{{t.currency|truncatechars:50}}</a></h2>
<div class="d-flex justify-content-between align-items-center">
<small class="text-muted">{{t.country|truncatechars:25}}</small>
</div>
</div>
</div>
</a>
</div>
{% endfor %}
</div>
{% endblock content %}
index.html -- tailwind
{% extends 'base.html' %}
{% block title %}Home{% endblock title %}
{% block content %}
<div class="p-10 ">
<div class="max-w-sm rounded overflow-hidden shadow-lg">
{% for t in object_list %}
<div class="px-6 py-4">
<div class="font-bold text-xl mb-2">{{t.country}}</div>
<p class="text-gray-700 text-base">
{{ t.currency }}
</p>
</div>
{% endfor %}
</div>
</div>
{% endblock content %}
You're starting the for loop a tag too late on the Tailwind version so all of your items are in a single card. And to recreate a 4 column grid layout in Tailwind I recommend using the grid utilities, specifically grid which is display: grid and grid-cols-4 which is grid-template-columns: repeat(4, minmax(0, 1fr)).
Your code might look like this:
{% extends 'base.html' %}
{% block title %}Home{% endblock title %}
{% block content %}
<div class="p-10 grid sm:grid-cols-2 md:grid-cols-4 gap-5">
{% for t in object_list %}
<div class="bg-green-500 rounded overflow-hidden shadow-lg">
<div class="px-6 py-4">
<div class="font-bold text-xl mb-2">{{t.country}}</div>
<p class="text-gray-700 text-base">
{{ t.currency }}
</p>
</div>
</div>
{% endfor %}
</div>
{% endblock content %}
Here's a visual of what the expected output would be https://play.tailwindcss.com/AWK45UcOug
Django 3.0.8
django-comments-xtd==2.6.2
I'm studyint this section of the tutorial:
https://django-comments-xtd.readthedocs.io/en/latest/tutorial.html#removal-suggestion
post_detail.html
{% extends "base.html" %}
{% load comments %}
{% load comments_xtd %}
{% block title %}{{ object.title }}{% endblock %}
{% block content %}
<div class="pb-3">
<h1 class="text-center">{{ object.title }}</h1>
<p class="small text-center">{{ object.publish|date:"l, j F Y" }}</p>
</div>
<div>
{{ object.body|linebreaks }}
</div>
{% get_comment_count for object as comment_count %}
<div class="py-4 text-center">
Back to the post list
⋅
{{ comment_count }} comment{{ comment_count|pluralize }}
ha{{ comment_count|pluralize:"s,ve" }} been posted.
</div>
{% if object.allow_comments %}
<div class="card card-block mb-5">
<div class="card-body">
<h4 class="card-title text-center pb-3">Post your comment</h4>
{% render_comment_form for object %}
</div>
</div>
{% endif %}
{% if comment_count %}
<ul class="media-list">
{% render_xtdcomment_tree for object allow_flagging allow_feedback %}
</ul>
{% endif %}
{% endblock %}
settings.py
COMMENTS_XTD_APP_MODEL_OPTIONS = {
'blog.post': {
'allow_flagging': True,
'allow_feedback': False,
'show_feedback': False,
}
}
Full code at Github: https://github.com/Kifsif/comments
Problem
I have loged in. But I can't see any flag at the right side of every comment’s header.
Could you give me a hint where the problem may be hiding?
I think you will have to import the font awesome stylesheet:
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.3.1/css/all.css" integrity="sha384-mzrmE5qonljUremFsqc01SB46JvROS7bZs3IO2EmfFsd15uHvIt+Y8vEf7N7fWAU" crossorigin="anonymous">
doing a site and i need some help with the block tags. It seems that django doesn't render {% block home %} {%endblock home %}. Let's suppose in my block code i have this div and if i put the div inside my base.html as per below example it doesn't appear. It appears only when i put the source code inside the base.html, so is not including my tags. What should i do? PS i have the extended code in my block e.g. {% extends "base.html" %}
<div>
<H1>Aici trebuie adaugat restul</H1>
</div>
My base.html:
{% load staticfiles %}
<!--DOCTYPE html -->
<html>
<head>
<title>{% block head_title %}Advancing the Blog{% endblock head_title %}</title>
<!-- Latest compiled and minified CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" integrity="sha384-1q8mTJOASx8j1Au+a5WDVnPi2lkFfwwEAa8hDDdjZlpLegxhjVME1fgjWPGmkzs7" crossorigin="anonymous">
<!-- Optional theme -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap-theme.min.css" integrity="sha384-fLW2N01lMqjakBkx3l/M9EahuwpSfeNvV63J5ezn3uZzapT0u7EYsXMjQV+0En5r" crossorigin="anonymous">
<link rel='stylesheet' href='https://maxcdn.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css' >
<link rel='stylesheet' href='{% static "css/base.css" %}' />
<style>
{% block style %}{% endblock style %}
</style>
{% block head_extra %} {% endblock head_extra %}
</head>
<body>
<div id="fb-root"></div>
<script>(function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) return;
js = d.createElement(s); js.id = id;
js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.5";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
{% include "messages_display.html" %}
<div class='container'>
<ol class='breadcrumb'>
<li><a href='{% url "posts:list" %}'>Home</a></li>
{% block post_detail_link %}
{% endblock %}
<!-- {% block index %}
{% endblock %} -->
{% if not request.user.is_authenticated %}
<li class='pull-right'><a href='{% url "register" %}'>Register</a></li>
<li class='pull-right'><a href='{% url "login" %}'>Login</a></li>
{% else %}
<li class='pull-right'><a href='{% url "logout" %}'>Logout</a></li>
{% endif %}
</ol>
<div>
<H1>Aici trebuie adaugat restul</H1>
</div>
{% block home %} {%endblock home %}
{% block content %}{% endblock content %}
</div>
<!-- Latest compiled and minified JavaScript -->
<script src="http://code.jquery.com/jquery-1.12.2.min.js" integrity="sha256-lZFHibXzMHo3GGeehn1hudTAP3Sc0uKXBXAzHX1sjtk=" crossorigin="anonymous"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js" integrity="sha384-0mSbJDEHialfmuBBQP6A4Qrprq5OVfW37PRR3j5ELqxss1yVqOtnepnHVP9aJ7xS" crossorigin="anonymous"></script>
<script src='https://cdnjs.cloudflare.com/ajax/libs/marked/0.3.5/marked.min.js'></script>
<script type="text/javascript">
$(document).ready(function(){
$(".content-markdown").each(function(){
var content = $(this).text()
var markedContent = marked(content)
$(this).html(markedContent)
})
$(".post-detail-item img").each(function(){
$(this).addClass("img-responsive");
})
var contentInput = $("#id_content");
function setContent(value){
var markedContent = marked(value)
$("#preview-content").html(markedContent)
$("#preview-content img").each(function(){
$(this).addClass("img-responsive")
})
}
setContent(contentInput.val())
contentInput.keyup(function(){
var newContent = $(this).val()
setContent(newContent)
})
var titleInput = $("#id_title");
function setTitle(value) {
$("#preview-title").text(value)
}
setTitle(titleInput.val())
titleInput.keyup(function(){
var newContent = $(this).val()
setTitle(newContent)
})
$(".comment-reply-btn").click(function(event){
event.preventDefault();
$(this).parent().next(".comment-reply").fadeToggle();
})
// preview-title
// preview-content
})
</script>
</body>
</html>
comment_thread.html
{% extends "base.html" %}
{% load urlify %}
{% load crispy_forms_tags %}
{% block head_title %}
{{ instance.title }} | {{ block.super }}
{% endblock head_title %}
<H1>TEST </H1>
{% block content %}
{{ object }}
<div class='col-sm-6 col-sm-offset-3'>
<p>{{ comment.content }}</p>
<footer>via {{ comment.user }} | {{ comment.timestamp|timesince }} ago | {% if comment.children.count > 0 %}{{ comment.children.count }} Comment{% if comment.children.count > 1 %}s{% endif %} {% endif %} {% if request.user == comment.user %}<a href='{{ comment.get_delete_url }}'>Delete</a> {% endif %}</footer>
<hr/>
<div>
{% for child_comment in comment.children %}
<blockquote>
<p>{{ child_comment.content }}</p>
<footer>via {{ child_comment.user }} | {{ child_comment.timestamp|timesince }} ago | {% if request.user == child_comment.user %}<a href='{{ child_comment.get_delete_url }}'>Delete</a>{% endif %}</footer>
</blockquote>
{% endfor %}
{% if request.user.is_authenticated %}
<form method="POST" action="."> {% csrf_token %}
{{ form|crispy }}
<input type='hidden' name='parent_id' value='{{ comment.id }}'>
<input type='submit' value='Reply' class='btn btn-default'>
</form>
{% else %}
<p>You must login to comment </p>
{% endif %}
</div>
<hr/>
</div>
{% endblock content %}
confirm_delete.html
{% extends "base.html" %}
{% load urlify %}
{% load crispy_forms_tags %}
{% block head_title %}
{{ instance.title }} | {{ block.super }}
{% endblock head_title %}
{% block content %}
<div class='col-sm-6 col-sm-offset-3'>
<h1>Confirm Delete</h1>
<form method="POST" action="."> {% csrf_token %}
<p>A re you sure you want to delete: "{{ object.content }}"?</p>
<input type='submit' value='Confirm' class='btn btn-warning'>
<a href='{{ object.get_absolute_url }}' class='btn btn-default'>Cancel</a>
</form>
</div>
<hr/>
</div>
{% endblock content %}
form.html
{% extends "base.html" %}
{% load crispy_forms_tags %}
{% block content %}
<!-- {% block index_home %}
{% endblock %} -->
<div class='col-sm-6 col-sm-offset-3'>
<h1>{{ title }}</h1>
<hr/>
<form method='POST' action='' enctype='multipart/form-data'>{% csrf_token %}
{{ form|crispy }}
<input type='submit' class='btn btn-default' value='{{ title }}' />
</form>
</div>
{% endblock content %}
messages_display.html
{% if messages %}
<div class='messages'>
<ul class="messages">
{% for message in messages %}
<li{% if message.tags %} class="{{ message.tags }}"{% endif %}>{% if "html_safe" in message.tags %}{{ message|safe }}{% else %}{{ message }}{% endif %}</li>
{% endfor %}
</ul>
</div>
{% endif %}
post_detail.html
{% extends "base.html" %}
{% load urlify %}
{% load crispy_forms_tags %}
{% block head_title %}
{{ instance.title }} | {{ block.super }}
{% endblock head_title %}
{% block post_detail_link %}
<li><a href='{{ instance.get_absolute_url }}'>{{ instance.title }}</a></li>
{% endblock %}
{% block content %}
<div class='col-sm-6 col-sm-offset-3'>
{% if instance.image %}
<img src='{{ instance.image.url }}' class='img-responsive' />
{% endif %}
<h1>{{ title }} <small>{% if instance.draft %}<span style='color:red;'>Draft</span> {% endif %}{{ instance.publish }}</small></h1>
<!-- {% if instance.read_time|time:"i" <= "01" %} < 1 minute {% else %}{{ instance.read_time|time:"i" }} minutes {% endif %} -->
<p>Read time: {% if instance.read_time <= 1 %} < 1 Minute {% else %}{{ instance.read_time }} minutes {% endif %}</p>
{% if instance.user.get_full_name %}
<p>Author: {{ instance.user.get_full_name }}</p>
{% endif %}
<p><div class="fb-like" data-href="{{ request.build_absolute_uri }}" data-layout="button_count" data-action="like" data-show-faces="true" data-share="true"></div>
<hr/>
</p>
<p>
<a href="https://www.facebook.com/sharer/sharer.php?u={{ request.build_absolute_uri }}">
Facebook
</a>
<a href="https://twitter.com/home?status={{ instance.content|truncatechars:80|urlify }}%20{{ request.build_absolute_uri }}">
Twitter
</a>
<a href='https://plus.google.com/share?url={{ request.build_absolute_uri }}'>
<a href="https://www.linkedin.com/shareArticle?mini=true&url={{ request.build_absolute_uri }}&title={{ instance.title }}&summary={{ share_string }}&source={{ request.build_absolute_uri }}">
Linkedin
</a>
Reddit
</p>
<div class='row'>
<div class='col-sm-12 '>
<div class='post-detail-item'>{{ instance.get_markdown }}</div>
<hr/>
<br/>
<div>
<p class='lead'>Comments</p>
{% if request.user.is_authenticated %}
<form method="POST" action="."> {% csrf_token %}
{{ comment_form|crispy }}
<input type='submit' value='Post comment' class='btn btn-default'>
</form>
{% else %}
<p>You must login to comment </p>
{% endif %}
<hr/>
{% for comment in comments %}
<blockquote>
<p>{{ comment.content }}</p>
<footer>via {{ comment.user }} | {{ comment.timestamp|timesince }} ago | {% if comment.children.count > 0 %}{{ comment.children.count }} Comment{% if comment.children.count > 1 %}s{% endif %} | {% endif %} <a class='comment-reply-btn' href='#'>Reply</a> | <a class='' href='{{ comment.get_absolute_url }}'>Thread</a></footer>
<div class='comment-reply'>
{% for child_comment in comment.children %}
<blockquote>
<p>{{ child_comment.content }}</p>
<footer>via {{ child_comment.user }} | {{ child_comment.timestamp|timesince }} ago</footer>
</blockquote>
{% endfor %}
{% if request.user.is_authenticated %}
<form method="POST" action="."> {% csrf_token %}
{{ comment_form|crispy }}
<input type='hidden' name='parent_id' value='{{ comment.id }}'>
<input type='submit' value='Reply' class='btn btn-default'>
</form>
{% else %}
<p>You must login to comment </p>
{% endif %}
</div>
</blockquote>
<hr/>
{% endfor %}
</div>
</div>
</div>
</div>
{% endblock content %}
post_form.html
{% extends "base.html" %}
{% load crispy_forms_tags %}
{% block head_extra %}
{{ form.media }}
{% endblock head_extra %}
{% block content %}
<div class='col-sm-6'>
<h1>Preview</h1>
<hr/>
<div class='content-preview'>
<h3 id='preview-title'></h3>
<p id='preview-content'></p>
</div>
</div>
<div class='col-sm-6'>
<h1>Form</h1>
<hr/>
<form method='POST' action='' enctype='multipart/form-data'>{% csrf_token %}
{{ form|crispy }}
<input type='submit' class='btn btn-default' value='Create Post' />
</form>
</div>
{% endblock content %}
post_list.html
{% extends "base.html" %}
{% block content %}
<div class='col-sm-6 col-sm-offset-3'>
<h1>{{ title }}</h1>
<form method='GET' action='' class='row'>
<div class='col-sm-6'>
<div class='input-group'>
<input class='form-control' type='text' name='q' placeholder='Search posts' value='{{ request.GET.q }}'/>
<span class='input-group-btn'>
<!-- <input class='btn btn-default' type='submit' value='Search' /> -->
<button class='btn btn-default' type='submit'>Search <i class="fa fa-search"></i></button>
</span>
</div>
</div>
</form>
{% for obj in object_list %}
<div class="row">
<div class="col-sm-12">
<div class="thumbnail">
{% if obj.image %}
<img src='{{ obj.image.url }}' class='img-responsive' />
{% endif %}
<div class="caption post-detail-item">
{% if obj.draft %}<h3>Staff only: Draft</h3>{% endif %} {% if obj.publish > today %}<h3>Staff Only: Future Post</h3>{% endif %}
<h3><a href='{{ obj.get_absolute_url }}'>{{ obj.title }}</a> <small>{{ obj.publish }}</small></h3>
{% if obj.user.get_full_name %}<p>Author: {{ obj.user.get_full_name }}</p>{% endif %}
{{ obj.get_markdown|truncatechars_html:120 }}
<p>View</p>
</div>
</div>
</div>
<hr/>
</div>
{% endfor %}
<div class="pagination">
<span class="step-links">
{% if object_list.has_previous %}
previous
{% endif %}
<span class="current">
Page {{ object_list.number }} of {{ object_list.paginator.num_pages }}.
</span>
{% if object_list.has_next %}
next
{% endif %}
</span>
</div>
</div>
{% endblock content %}
Could you try having {% endblock home %} instead of {%endblock home %}. The lack of space can sometimes mess things up.
If this does not work, try simply have {% endblock %} instead.
Hope this helps!
I am trying to use django tinymce in my project but the font is too small. I have googled it and learned I am meant to use content_css but without proper step by step approaches as to how exactly this should be done.
I am wondering if there was another way and if there isn't, could someone give me a simple step by step approach to solving it using the content_css.
Below is the forms.py
class PostForm(forms.ModelForm):
text = forms.CharField(help_text='Enter your Post here', widget=TinyMCE(attrs={'cols': 80, 'rows': 10}))
name = forms.CharField(widget=forms.HiddenInput(), initial='User')
created_on = forms.DateTimeField(widget=forms.HiddenInput(), initial=timezone.now())
class Meta:
model = Post
fields = ('title', 'text',)
{% extends 'blog/base.html' %}
{% load staticfiles %}
{% block body_block %}
<!-- <h1>TinyMCE Quick Start Guide</h1>
<form method='post'>
<textarea id = 'mytextarea'>Hello, World!</textarea>
</form> -->
{% if post %}
<div class="single">
<div class="container">
<div class="col-md-8 single-main">
<div class="single-grid">
<h4>{{ post.title|safe }}</h4>
<img src="{% static 'images/post1.jpg' %}" alt=""/>
<p>{{ post.text|safe }}</p>
</div>
<div class="comments">
<h2><u>Comments</u></h2>
{% if comments %}
{% for comment in comments %}
<h3>~{{ comment.commenter.first_name|title}} {{comment.commenter.last_name|title }}</h3>
<ul>
<li>
{{ comment.text|safe }}
</</li><br>
</ul>
<span class="hidden-xs"style="margin-left:70%;, font-family:Arial">Published: {{ comment.created_on }}</span >
{% if comment.commenter == request.user or user.is_superuser %}
<button style="margin-left:90%;,line-height: .9;color: red;, font-family:Arial;" type="button" name="button">Delete</button>
{% endif %}
{% endfor %}
{% else %}
No comments available
{% endif %}
</div>
<div class="content-form">
<h3>Leave a comment</h3>
{% if user.is_authenticated %}
<form id="comment_form" action="{% url 'blog:detail' post.slug %}" method="post">
{% csrf_token %}
{% for hidden in form.hidden_fields %}
{{ hidden }}
{% endfor %}
{% for field in form.visible_fields %}
{{ field.errors }}
{{ field }}<br/><br/>
{% endfor %}
<input class="btn btn-primary" type="submit" name="submit" value="submit">
</form>
{% else %}
You must be logged in to comment
{% endif %}
</div>
<ul class="comment-list " >
<h5 class="post-author_head">Written by {{ post.author.first_name|title }} {{ post.author.last_name|title }}</h5>
<li><img src="{% static 'images/avatar.png' %}" class="img-responsive" alt="">
<div class="desc">
<p>View all posts by: {{ post.author.first_name|title }} {{ post.author.last_name|title }}</p>
</div>
<div class="clearfix"></div>
</li>
</ul>
</div>
<div class="col-md-4 side-content">
<div class="recent">
<h3>RECENT POSTS</h3>
{% if recent_posts %}
<ul>
{% for post in recent_posts %}
<li>{{post.title|title }}</li>
{% endfor %}
</ul>
{% else %}
<li>No post has been posted</li>
{% endif %}
</div>
<div class="comments">
<h3>RECENT COMMENTS</h3>
{% if recent_comments %}
<ul>
{% for comment in recent_comments %}
<li>{{comment.commenter|title}} on {{comment.post|title}}</li>
{% endfor %}
</ul>
{% else %}
<li>No comments at the moment</li>
{% endif %}
</div>
<div class="clearfix"></div>
<div class="archives">
<h3>ARCHIVES</h3>
<ul>
<li>October 2013</li>
<li>September 2013</li>
<li>August 2013</li>
<li>July 2013</li>
</ul>
</div>
<div class="clearfix"></div>
</div>
<div class="clearfix"></div>
</div>
</div>
{% if comment.commenter == request.user or user.is_superuser %}
<button style="margin-left:90%;,line-height: .9;color: red;, font-family:Arial;" type="button" name="button">Delete Post</button>
<button style="margin-left:90%;,line-height: .9;color: red;, font-family:Arial;" type="button" name="button">Edit Post</button>
{% endif %}
{% else %}
asadsh
{% endif %}
{% endblock %}
To add content css files to tinymce, you have to change the tinymce.init object value to include your content_css.
Search for the initialization call in your script and add a line to your object like in this example:
tinymce.init({
...
content_css: [
'//example.com/js/your-css-here.css'
],
...
});
If a content_css part is already present, just add the URL to the array, i.e.
['url 1 here', 'url 2 here', 'your new url here']
In your custom css file, you can now set your desired font size, i.e.
body { font-size: 14px; }
I have the following code. The first works, however the second throws a "MultiValueDictKeyError". I've tweaked the code around a bit but I haven't been able to fix it. Any and all help is greatly appreciated!
Working Code:
{% extends "base.html" %}
{% block base_content %}
<link rel="stylesheet" href="/media/themes/txt/css/employee_summary/report.css" />
<form id="myForm" method="post">
{% csrf_token %}
{% for field in form %}
<div class=box>
<div class="row">
<div class="2u">
<h1>{{ field.label_tag }}:</h1>
</div>
<div class="10u">
{{ field }}
</div>
</div>
</div>
{% endfor %}
{% for formset in inlines %}
<div class=box>
{% for form in formset %}
<div class="row">
<div class="12u">
<h1>{{ form }}</h1>
</div>
</div>
{% endfor %}
</div>
{% endfor %}
{% for formset in inlines %}
{{ formset.management_form }}
{% endfor %}
<input type="submit" value="Save Changes">
</form>
{% endblock %}
Non-Working Code:
{% extends "base.html" %}
{% block base_content %}
<link rel="stylesheet" href="/media/themes/txt/css/employee_summary/report.css" />
<div id="main-wrapper">
<div class="strongborder">
<div id="main" class="container boldtext">
<form id="myForm" method="post" class="12u">
{% csrf_token %}
{% for field in form %}
<div class="row">
<div class="2u">
<h1>{{ field.label_tag }}:</h1>
</div>
<div class="10u">
{{ field }}
</div>
</div>
{% endfor %}
{% for formset in inlines %}
{% for form in formset %}
<br>
<br>
<h1>{{ form.instance.form_name }}</h1>
{% for field in form %}
<div class="row">
{% if field.label != "Employee" and field.label != "Id" and field.label != "Delete" %}
<label class="2u">{{ field.label }}:</label>
<div class="10u">{{ field }}</div>
{% endif %}
</div>
{% endfor %}
{% endfor %}
{% endfor %}
{% for formset in inlines %}
{{ formset.management_form }}
{% endfor %}
<br>
<br>
<input type="submit" value="Save Changes">
</form>
</div>
</div>
</div>
{% endblock %}
Solved by myself: for some reason it wasn't liking the ID skip in
{% if field.label != "Employee" and field.label != "Id" and field.label != "Delete" %}
... yet it was fine with skipping the employee and delete fields.