Displaying multiple images in a blog post

[hbat]

Suppose I have two images, "\media\images\image1.jpg" and
"\media\images\image2.jpg". I want to display them in a blog post that I've
written. I thought I should create a model for images but with multiple
images I cannot figure out how to add them to the body of my blog post. It
seems like I have to write full locations to the body like this:

instead of something like this:

I prefer a method like the latter one.

Here is my app structure:








--
View this message in context: http://python.6.x6.nabble.com/Displaying-multiple-images-in-a-blog-post-tp5213133.html
Sent from the django-users mailing list archive at Nabble.com.

[HBat]

(I don't know what happened to original post.)

Suppose I have two images, "\media\images\image1.jpg" and "\media\images\image2.jpg". I want to display them in a blog post that I've written. I thought I should create a model for images but with multiple images I cannot figure out how to add them to the body of my blog post. It seems like I have to write full locations to the body like this:

<img src="\media\images\image1.jpg" alt="My Desrciption" />

instead of something like this:

<img src="{{ post.images.image.url[1] }}" alt="{{ post.images.image.url[2] }}" />

I prefer a method like the latter one. 

 

Here is my app structure:

# models.py:
class Post(models.Model):
    title = models.CharField(max_length=250)
    body = models.TextField()
    slug = models.SlugField(max_length=250)
    publish = models.DateTimeField(default=timezone.now)

class Images(models.Model):
    post = models.ForeignKey(Post, default=None, related_name='images')
    description = models.TextField()
    image = models.ImageField()


# views.py:
def post_detail_view(request, year, month, day, postslug):
    post = get_object_or_404(Post,
                             slug=postslug,
                             publish__year=year,
                             publish__month=month,
                             publish__day=day
                             )
    return render(request=request,
                  template_name='blogapp/post/detail.html',
                  context={'post': post})

 

# detail.html:
{% extends "blogapp/base.html" %}
{% block title %}{{ post.title }}{% endblock %}
{% block content %}
    <h1>{{ post.title }}</h1>
    {{ post.body|safe }}
{% endblock %}

post.body = """
<h2>Example blog post</h2>
  <p>Here is some text. And image for this part:</p>
  <img src="{{ post.image1.filename }}" alt="{{ post.image1.description }}" />
  <p>Here is some other text and image for this part:</p>
  <img src="{{ post.image2.filename }}" alt="{{ post.image2.description }}" />
  <p>I'm ending my blog post here.</p>
"""

[ludovic coues]

I would be a bit wary of a django blog making use of template tag.

Anyway, I believe your code should be more like that: {{
post.images[2].image.url }}.

Personally, I would delegate fetching the url to another part of the code.
Something like one endpoint would return a list of images. A piece of
javascript query that list and store it. When the user press a button,
put an image tag at the cursor position.

Or I would write a custom tag which would be used like {% image 2 %}
and would return the url of the second image of the current post.

> --
> You received this message because you are subscribed to the Google Groups
> "Django users" group.
> To unsubscribe from this group and stop receiving emails from it, send an
> email to django-users...@googlegroups.com.
> To post to this group, send email to django...@googlegroups.com.
> Visit this group at https://groups.google.com/group/django-users.
> To view this discussion on the web visit
> https://groups.google.com/d/msgid/django-users/2f098a0a-d711-44af-b22a-058447872f22%40googlegroups.com.
>
> For more options, visit https://groups.google.com/d/optout.



--

Cordialement, Ludovic Coues
+33 6 14 87 43 42

[HBat]

Thanks for the response. 

If I put a template tag within the post.body then the tags might not be rendered because only detail.html will be rendered the tags within the post.body will be seen as raw texts. 

Currently, I'm thinking about using an approach like Markdown images. And then, as the example you gave in your reply, put something like ![<slug of image 2>] to insert the <img src="<image2's url>" alt="<image2's description>" />. I don't know how to do this either but that's the direction I'm heading. Any input will be appreciated. 

[Srinivas Nyayapati]

Hello 

I was wondering if you were able to get this to work? I was thinking of having  a many to many relationship with the images class with the addition to having a name field to describe the image. Use the name field in the Post body  using some sort of non-django tag to spread my multiple images in the blog post. Then write a method to the Post class to return the body contents with the images in html.

-Srini