如何插入多个图像到博客文章中没有文件字段上传(Django博客)

问题描述:

我是Django网站开发的半透明小插件。我设法添加一个File字段,它实际上允许我将图像上传到帖子中(图像显示在帖子列表和帖子后),但是如果我想在帖子中添加几张图片怎么办?如何插入多个图像到博客文章中没有文件字段上传(Django博客)

我目前正在编写一篇教程文章,并希望在每条说明下插入图像以便为用户带来好处。我不希望教程是纯文本的,我该如何去做这件事?

下面是我的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 

这是我的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',) 

这里是我的博客文章的屏幕截图,你可以看到它只是张贴的链接时,我包括HTML文件

My blog post

最后下面是一个SNI邮政细节的地址;

{% extends 'blog/base.html' %} 
 

 
{% block content %} 
 
  
 

 
\t \t {% if user.is_authenticated %} 
 
     \t \t <a class="btn btn-default pull-left" href="{% url 'post_edit' pk=post.pk %}"><span class="glyphicon glyphicon-pencil"></span></a> 
 
\t \t {% endif %} 
 

 
\t \t <div id="post_det"> 
 
\t \t \t {% if post.published_date %} 
 
\t \t \t \t <div class="date"> 
 
\t \t \t \t \t {{ post.published_date }} 
 
\t \t \t \t </div> 
 
\t \t \t {% endif %} 
 

 
\t \t \t <h1 class="post-title">{{ post.title }}</h1> 
 
\t \t \t \t <img src="{{post.image.url}}" class="img-responsive blog-img"/> 
 
\t \t \t \t &nbsp; 
 
\t \t \t \t 
 
\t \t \t <p class="post_text">{{ post.text|linebreaksbr }}</p> 
 
\t \t \t 
 
\t \t \t 
 
\t \t </div> 
 
\t &nbsp; 
 
\t 
 
\t <hr> 
 
\t \t <a class="btn comment_button" href="{% url 'add_comment_to_post' pk=post.pk %}">Add comment</a> 
 
\t \t 
 
\t 
 
\t <div> 
 
\t &nbsp; 
 
\t 
 
\t \t {% for comment in post.comments.all %} 
 
\t \t {% if user.is_authenticated or comment.approved_comment %} 
 
\t \t \t <div class="comment"> 
 
\t \t \t <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 %} 
 
\t \t \t </div> 
 
\t \t \t <strong>{{ comment.author }}</strong> 
 
\t \t \t <p>{{ comment.text|linebreaks }}</p> 
 
\t \t \t </div> 
 
\t \t {% endif %} 
 
\t \t \t {% empty %} 
 
\t \t \t \t <p>No comments here yet :(</p> 
 
\t \t \t {% endfor %} 
 
\t </div> 
 
{% endblock %}

这似乎是这样的卑贱的任务,我很努力在一些文本中插入一个简单的图像。任何人都可以帮忙吗?将不胜感激。

谢谢

山姆

+0

所以,你的问题是,你想添加多个图像?或者图像显示不正确? –

+0

@ alfonso.kim我想在博客文章中插入多个图像。现在我只知道如何上传一个,并使其出现在帖子的顶部,从我的帖子详细信息片段可以看出我需要编辑models.py文件吗?谢谢 – Curly77

您可以手动在文本字段为HTML添加相似图片<img src="#">。然后在模板中使用“安全”过滤器。所以post.text|safe。这将呈现您的HTML。

但是这只能解决你的问题的一部分,因为你需要一种简单的方式将图像上传到服务器并将它们插入到博客文章中。

你真正需要的是一个所见即所得的编辑器。这里有一个列表https://djangopackages.org/grids/g/wysiwyg/

Django-ckeditor和tinymce都很好。你可以找到如何在各自的文档中设置这些教程的教程。

+0

啊,正是我需要的,非常感谢你! – Curly77

+0

很高兴听到我的回答帮助了Curly77,你能否给我一个赞成票并将答案标记为解决你的问题? – chasmani

+0

我已经标记了答案,并且upvoted,你看不到upvote,因为我是新的*。再次感谢! – Curly77