I am a semi-noob to Django web development. I've managed to add a File field that actually allows me to upload an image into the post (The image is displayed in post-list and post-detail) but what if I wanted to add several images in a post?
I am currently writing a tutorial post and would like to insert images under each instruction for the benefit of the user. I don't want the tutorials to be purely text, how do I go about doing this?
Below is my models.py
from __future__ import unicode_literals
from django.db import models
from django.core.urlresolvers import reverse
from django.utils import timezone
#from taggit.managers import TaggableManager
class Post(models.Model):
author = models.ForeignKey('auth.User')
title = models.CharField(max_length=200)
text = models.TextField()
created_date = models.DateTimeField(default=timezone.now)
published_date = models.DateTimeField(blank=True, null=True)
image = models.FileField(null=True, blank=True)
#tags = TaggableManager()
def publish(self):
self.published_date = timezone.now()
self.save()
def __str__(self):
return self.title
def approved_comments(self):
return self.comments.filter(approved_comment=True)
class Meta:
ordering = ["-pk"]
class Comment(models.Model):
post = models.ForeignKey('blog.Post', related_name='comments')
author = models.CharField(max_length=200)
text = models.TextField()
created_date = models.DateTimeField(default=timezone.now)
approved_comment = models.BooleanField(default=False)
def approve(self):
self.approved_comment = True
self.save()
def approved_comments(self):
return self.comments.filter(approved_comment=True)
def __str__(self):
return self.text
And here's my forms.py
from django import forms
from .models import Post, Comment
class PostForm(forms.ModelForm):
class Meta:
model = Post
fields = ('image','title', 'text')
class CommentForm(forms.ModelForm):
class Meta:
model = Comment
fields = ('author', 'text',)
Here's a screen shot of my blog post, as you can see it's just posting the link when I include the HTML file
And finally below is a snippet of the post detail;
{% extends 'blog/base.html' %}
{% block content %}
{% if user.is_authenticated %}
<a class="btn btn-default pull-left" href="{% url 'post_edit' pk=post.pk %}"><span class="glyphicon glyphicon-pencil"></span></a>
{% endif %}
<div id="post_det">
{% if post.published_date %}
<div class="date">
{{ post.published_date }}
</div>
{% endif %}
<h1 class="post-title">{{ post.title }}</h1>
<img src="{{post.image.url}}" class="img-responsive blog-img"/>
<p class="post_text">{{ post.text|linebreaksbr }}</p>
</div>
<hr>
<a class="btn comment_button" href="{% url 'add_comment_to_post' pk=post.pk %}">Add comment</a>
<div>
{% for comment in post.comments.all %}
{% if user.is_authenticated or comment.approved_comment %}
<div class="comment">
<div class="date">
{{ comment.created_date }}
{% if not comment.approved_comment %}
<a class="btn btn-default" href="{% url 'comment_remove' pk=comment.pk %}"><span class="glyphicon glyphicon-remove"></span></a>
<a class="btn btn-default" href="{% url 'comment_approve' pk=comment.pk %}"><span class="glyphicon glyphicon-ok"></span></a>
{% endif %}
</div>
<strong>{{ comment.author }}</strong>
<p>{{ comment.text|linebreaks }}</p>
</div>
{% endif %}
{% empty %}
<p>No comments here yet :(</p>
{% endfor %}
</div>
{% endblock %}This seems like such a menial task and I am struggling to insert a simple image under some text. Can anybody help? Will greatly appreciate it.
Thank you
Sam
