Как отобразить галерею изображений товара после щелчка на первом изображении?

Вкратце, у меня есть ListView в Django, который отображает картинки с таблицами на сайте. Затем у меня есть DetailView, где я размещаю вторую веб-страницу для использования со слизнями, но я думаю, что моя логика неправильная. Я хочу иметь возможность нажать на определенную картинку/таблицу, и это перенаправит меня на другую страницу (возможно, созданную с помощью slug), где я могу отобразить больше картинок той же таблицы. Я уже все создал, но мне кажется, что моя логика неверна. Вам не нужно писать код, просто, пожалуйста, объясните, что является правильным способом сделать это, поскольку я делаю это в первый раз.

Сначала я создал модель Categories, в которой перечислены такие категории, как: столы, кухни, шкафы, спальни. Затем я создал категорию Image, где у меня будет заголовок, изображение и так далее, но это было нормально для одного из представлений, но для этого представления я хочу отобразить несколько изображений, как я уже упоминал, и я увидел код, который позволил мне иметь несколько изображений.

views.py

    class TableCategoryListView(ListView):
        model = Images
        template_name = 'main/projects/tables.html'
        context_object_name = 'category_images'
    
        queryset = Images.objects.filter(category__category_title="tables")
    
    
    class TablesDetailView(DetailView):
        model = Images
        template_name = "main/projects/tables_slug.html"

url.py

    path('proekti/masi/', TableCategoryListView.as_view(), name='tables'),
    path('proekti/masi/<slug:slug>', TablesDetailView.as_view(), name='table'),

models.py

class Category(models.Model):
    category_title = models.CharField(
        max_length=50
    )

    def __str__(self):
        return self.category_title


class Images(models.Model):
    title = models.CharField(
        blank=True,
        null=True,
        max_length=50,
    )

    category_image = models.ImageField(
        blank=True,
        null=True,
    )
    category = models.ForeignKey(
        Category,
        on_delete=models.CASCADE)

    def __str__(self):
        return self.title

    def __unicode__(self):
        return self.title

    slug = models.SlugField(
        null=True,
    )

    def get_absolute_url(self):
        return reverse("article-detail", kwargs={"slug": self.slug})


class PhotoAlbum(models.Model):
    menu = models.ForeignKey(Images, on_delete=models.CASCADE)

    image = models.ImageField()

    order = models.IntegerField(
        blank=True,
        null=True,
    )

    def __unicode__(self):
        return self.menu

    class Meta:
        ordering = ('order',)

Я прочитал, что это поможет мне легко добавить несколько фотографий.

admin.py

@admin.register(Category)
class CategoryAdmin(admin.ModelAdmin):
    pass

class ImagesForm(forms.ModelForm):
    model = Images

    class Media:
        js = (
            '/static/js/jquery-latest.js',
            '/static/js/ui.base.js',
            '/static/js/ui.sortable.js',
            '/static/js/menu-sort.js',
        )


class PhotoAlbumInline(admin.StackedInline):
    model = PhotoAlbum


admin.site.register(
    Images,
    inlines=[PhotoAlbumInline],
    form=ImagesForm,
    list_filter=('category',),
    search_fields=('title',)
)

"""
/* menu-sort.js */

jQuery(function($) {
    $('div.inline-group').sortable({
        /*containment: 'parent',
        zindex: 10, */
        items: 'div.inline-related',
        handle: 'h3:first',
        update: function() {
            $(this).find('div.inline-related').each(function(i) {
                if ($(this).find('input[id$=name]').val()) {
                    $(this).find('input[id$=order]').val(i+1);
                }
            });
        }
    });
    $('div.inline-related h3').css('cursor', 'move');
    $('div.inline-related').find('input[id$=order]').parent('div').hide();
});
"""

шаблон tables.html

{% extends 'base.html' %}
{% block page_content %}
    {% load static %}

    <link rel="stylesheet" type="text/css" href="{% static 'css/masi.css' %}">

    <div class="row">
{% for image in object_list %}
            {% if forloop.counter0|divisibleby:1 %}
                <div class="column" style="background-color: whitesmoke">
                    <a href="{{ image.get_absolute_url }}"><img src="{{ image.category_image.url }}" alt="pic"></a>
                    <p>
                </div>
            {% endif %}
        {% endfor %}


    </div>
{% endblock %}

template tables_slug.html --> где я хочу отобразить все изображения определенной таблицы, не показывает мне одну из таблиц и не показывает все изображения, которые я загрузил на странице администратора.

{% extends 'base.html' %}
{% block page_content %}

    {% for image in category_images %}
        <div>
            <h2>{{ object.title }} </h2>
            <img src="{{ object.category_image.url }}" alt="pic">
        </div>
    {% endfor %}
{% endblock %}

{{ image.imageurl }}

{% for image in images %}
    {{image.url }}
{% endfor %} 

class PhotoAlbum(models.Model):
    menu = models.ForeignKey(
        Images,
        on_delete=models.CASCADE,
        related_name="child_images",
        )

    image = models.ImageField()

    order = models.IntegerField(
        blank=True,
        null=True,
    )

    def __unicode__(self):
        return self.menu

    class Meta:
        ordering = ('order',)

{% extends 'base.html' %}
{% block page_content %}
    {% load static %}

    <link rel="stylesheet" type="text/css" href="{% static 'css/masi.css' %}">

    {% for image in image.child_images.all %}

            <div class="column">
                <p>
                    <img src="{{ image.image.url }}" alt="pic">
                </p>
            </div>

    {% endfor %}
{% endblock %}