How to open generated files?

[NeosKsen]

In my model I have

image = PictureField(upload_to='news/%Y/%m/%d',
                        blank=True,
                        verbose_name='test_img',
                        aspect_ratios=[None, "1/1", "3/2", "16/9"],
                         )

my settings.py media route

MEDIA_URL = '/media/'
MEDIA_ROOT = '/home/test/www/media'

my urls.py

urlpatterns = [
    path('admin/', admin.site.urls),
    path('', include('dogs.urls')),
    path('ckeditor/', include('ckeditor_uploader.urls')),
    path('', include("pictures.urls")),
]+ static(settings.MEDIA_URL, document_root=settings.MEDIA_ROOT) + static(settings.STATIC_URL, document_root=settings.STATIC_ROOT)

my main image is saved and displayed as usual, but the path to the generated one is displayed incorrectly
main image path: /media/news/2022/12/26/Vaza_uyutnaya.max-800x600_F1aHcA7.jpg
wrong generated path: https://test/None/16x9/600w.WEBP (srcset="/None/16x9/100w.WEBP, ...)
real path: /media/news/2022/12/26/Vaza_uyutnaya.max-800x600_F1aHcA7/16x9/600w.WEBP
call in HTML file:
{% picture item.image ratio="16/9" lg=6 xl=4 %}

[codingjoe]

Hi @NeosKsen,

Thank you for reaching out. django-pictures has a placeholder feature.
It'll render generic placeholders dynamically, if enabled, instead of using the actual files. This feature is mean to simplify local development. The placeholders include the alt text, have identical dimension and a random color. They also feature lines from edge to edge, to help developers identify if the image dimension matches their layout.
Here, an example:

For the placeholders to work, you will probably need to add a better path prefix to your URL include, e.g.: path("__placeholders__/", include("pictures.urls")),

If you want to serve the original files, you will need to set PICTURES["USE_PLACEHOLDERS"] to False. By default, this will fall back to your DEBUG setting. Which must be off in production, to avoid exposing sensitive data.

I hope my explanation helps.

Cheers!
Joe

BTW: Don't forget to pass an img_alt attribute to the template tag, to provide a fallback text for the visually impaired.

[slavenja]

Hi, I wanted to switch from django-versatileimagefield, due to the fact that I need webp, I did everything according to the instructions, but for some reason the images are not generated. Then I saw that I needed a celery task, but it would be nice to write an example in the instructions at least. So it's too difficult for me. Although I already have Celery set up.

class ProductImage(models.Model):
product = models.ForeignKey('Product', related_name='images', on_delete=models.CASCADE)
image = PictureField(upload_to=get_upload_path)
alt = models.CharField(max_length=255, blank=True)
order = models.PositiveIntegerField(default=0, blank=False, null=False)

[codingjoe]

Hi @slavenja, thanks for reaching out.

You don't need to write your task to get things running on celery. You can also run this package synchronously without Celery. However, if you have Celery installed, you will need to make sure you have a worker listening to the pictures queue.

We don't send tasks to the default queue because you might want to have specialized workers processing images. But since it's not the first time someone is struggling, maybe we need to extend the documentation. Please don't hesitate to provide suggestions on how we could improve the docs.

Best! Joe

[slavenja]

Without Celery nothing works, or rather there is no webp generation

[slavenja]

Tell me a working config for generating without Celery. But it would also be nice to make an example for Celery to make an optimal .

[codingjoe]

Hi,

So, there is a bit in the documentation that explains how you can override a setting to swap in your processor: https://github.com/codingjoe/django-pictures?tab=readme-ov-file#async-image-processing
The package does work without Celery (installed), but if you have it installed, you need to use it. Unless you change the setting above.

I'd be happy to improve the documentation or provide you with an example. However, I would require a bit more information on your use case.

Cheers!
Joe