HELP! I need full sizes images not just thumbnails!!!!

201 views
Skip to first unread message

Zero Alpha

unread,
Feb 10, 2022, 6:27:35 AM2/10/22
to django-oscar
I used the default pip install django-oscar[sorl-thumbnail]

but the product thumbnail images are too small...

How can I have the original image size instead of a thumbnail?

Can I disable thumbnails or is it possible for the user to click on the thumbnail to see a full size image.

Sebastian Jung

unread,
Feb 10, 2022, 6:41:40 AM2/10/22
to django...@googlegroups.com
Hello,

Django oscar save images in original size.

In catalogue/partial/gallery.html template sorl are used to make from original size template a thumb and rendered it. When you want original size then don't use sorl..

Regards

--
https://github.com/django-oscar/django-oscar
http://django-oscar.readthedocs.org/en/latest/
---
You received this message because you are subscribed to the Google Groups "django-oscar" group.
To unsubscribe from this group and stop receiving emails from it, send an email to django-oscar...@googlegroups.com.
To view this discussion on the web, visit https://groups.google.com/d/msgid/django-oscar/45049839-231d-494a-883c-ee6716f4ad87n%40googlegroups.com.

Zero Alpha

unread,
Feb 10, 2022, 7:27:49 PM2/10/22
to django-oscar
I've tried a new install without sorl (pip install django-oscar) but then I was getting errors that sorl wasn't installed when I added a product.

If I edit this template file /oscar/templates/oscar/catalogue/partials/gallery.html How can I remove sorl? There are tags mentioned in the manual (https://django-oscar.readthedocs.io/en/latest/ref/templatetags.html
I've tried editing the  <img src="{% oscar_thumbnail image.original '440x400' upscale=False %}" /> tag but im getting nowhere :(

van...@gmail.com

unread,
Feb 11, 2022, 12:53:24 PM2/11/22
to django-oscar
Dear Zero Alpha,
You should customise templates by follow this document.
In the new template, you change  <img src="{% oscar_thumbnail image.original '440x400' upscale=False %}" /> to <img src="{{ image.original }}" />

Hope this help.


Vào lúc 07:27:49 UTC+7 ngày Thứ Sáu, 11 tháng 2, 2022, Zero Alpha đã viết:

Zero Alpha

unread,
Feb 11, 2022, 10:18:00 PM2/11/22
to django-oscar
Thanks!!! I tried your example but it turns out there are other forces at play preventing me from escaping the 440x400 rendered size so I decided to just make the thumbnail a clickable link to the full sized image. 


I edited my forked copy of templates/oscar/catalogue/partials/gallery.html

                {% for image in all_images %}
                    <div class="carousel-item {% if forloop.first %}active{% endif %}">
                        {% oscar_thumbnail image.original '440x400' upscale=False as thumb %}
                        <a href="/media/{{ image.original }}"><img src="{{ thumb.url }}" alt="{{ product.get_title }}" /></a>
                    </div>
                {% endfor %}

HERE IS MY FULL CODE FOR GALLERY.HTML:
{% load i18n %}
{% load image_tags %}

{% with all_images=product.get_all_images %}
    {# use length rather then count as the images get queried anyways #}

    {% if all_images|length > 1 %}

        <div id="product_gallery" class="carousel slide">

            <div class="img-thumbnail mb-3">
                <div class="carousel-inner">
                {% for image in all_images %}
                    <div class="carousel-item {% if forloop.first %}active{% endif %}">
                        {% oscar_thumbnail image.original '440x400' upscale=False as thumb %}
                        <a href="/media/{{ image.original }}"><img src="{{ thumb.url }}" alt="{{ product.get_title }}" /></a>
                    </div>
                {% endfor %}
                </div>
                <a class="carousel-control-prev" href="#product_gallery" role="button" data-slide="prev">
                    <span class="carousel-control-prev-icon" aria-hidden="true"></span>
                    <span class="sr-only">{% trans "Previous" %}</span>
                </a>
                <a class="carousel-control-next" href="#product_gallery" role="button" data-slide="next">
                    <span class="carousel-control-next-icon" aria-hidden="true"></span>
                    <span class="sr-only">{% trans "Next" %}</span>
                </a>
            </div>

            <ol class="carousel-indicators img-thumbnail">
                {% for image in all_images %}
                    <li data-target="#product_gallery" data-slide-to="{{ forloop.counter0 }}" class="{% if forloop.first %}active{% endif %}">
                        {% oscar_thumbnail image.original "65x55" crop="center" as thumb %}
                        <img src="{{ thumb.url }}" alt="{{ product.get_title }}" />
                    </li>
                {% endfor %}
            </ol>
        </div>

    {% else %}

        {# Only one image to show #}
        <div id="product_gallery" class="carousel">
            <div class="img-thumbnail">
                <div class="carousel-inner">
                    <div class="carousel-item active">
                    {% with image=product.primary_image %}
                        {% oscar_thumbnail image.original "440x400" upscale=False as thumb %}
                        <a href="/media/{{ image.original }}"><img src="{{ thumb.url }}" alt="{{ product.get_title }}" /></a>
                    {% endwith %}
                    </div>
                </div>
            </div>
        </div>

    {% endif %}
{% endwith %}


Sebastian Jung

unread,
Feb 12, 2022, 2:28:58 AM2/12/22
to django...@googlegroups.com
Hello,

I try it later on my own project. Then i write you

Regards

Reply all
Reply to author
Forward
0 new messages