How to make the main image of the article displayed in the preview?

Question

Django

I am writing a website in Django. It is necessary that the announcement of articles with a picture is displayed. I don't know how to implement it. I am using ckeditor. The picture is not displayed in the news preview, but is visible only when you go to the page of a particular article.



models.py

class News(models.Model):
title = models.CharField(max_length=250)
slug = models.SlugField(max_length=50,unique=True)
author = models.ForeignKey(User,on_delete=models.CASCADE,
related_name='news_posts', null=True, blank=True)
anons = models.CharField(max_length=350)
body = RichTextUploadingField(null=True, blank=True)
date_added = models.DateTimeField(auto_now_add=True)
# Возврат понятного отображения заголовка в панель администрирования
def __str__(self):
    return self.title
class Meta:
    verbose_name = u"Новость"
    verbose_name_plural = u"Новости"

urls.py

from django.conf.urls import url
from . import views
from django.conf import settings
from django.conf.urls.static import static
from django.conf.urls import include, url
from django.urls import path
from .views import AboutUs,Mission,Index,Contacts, Cooperation, News
# -*- coding: utf-8 -*-
urlpatterns = [
   
     #Домашняя страница
    path('index/', Index.as_view(), name='index'), #Домашняя страница
    path (r'', views. articles, name = 'news'),#Лента новостей
    path('ckeditor/', include('ckeditor_uploader.urls')),#редактор статей
    path(r'new/<el_id>', views.el, name='el'),#Вывод отдельной новости
    ]

vews.py

from django.shortcuts import render
from django.views.generic import TemplateView
from django.utils import timezone
from .models import News 

class Index(TemplateView):
    #Домашняя страница приложения
    template_name = 'index.html'

def articles(request):#Страница новостей
        news = News.objects.order_by('-date_added') 
        context = {'new': news}
        return render(request, 'prosvet_logs/news.html', context)

def el(request, el_id): #Вывод отдельной новости
    news = News.objects.get(id=el_id)
    context = {'news':news}
    return render(request, 'prosvet_logs/article.html', context)

news.html

{% extends "prosvet_logs/base.html" %}
{% block content %}
<div class="News">
    {% if new %}
        {% for el in new %}
    <div class="articles">
        <h3><a href="{% url 'el' el.id %}">{{ el }}</a></h3>
        <p>{{ el.anons }}</p>
    </div>
        {% endfor %}
    {% else %}
        <p>Новостей нет</p>
    {% endif %}
    {#Так выглядит комментарий в теле html#}
</div>
{% endblock content %}