как поменять название файла для мобильной версии

Question

Нужно прописать условие для вывода изображений под разные устройства

{$slide.image_url} - базовое изображение.

Суть - что бы на экранах меньше 480px подставлялись другие рисунки. Они уже предварительно подготовлены и имеют имена *_mobil.jpg

Например: 1.jpg а на мобильном будет показывать 1_mobil.jpg

Answer 1

Используйте picture

<picture>
 <source srcset="{$slide.image_url|replace:'.jpg':'_mobil.jpg')}" media="(max-width: 480px)">
 <img src="{$slide.image_url}">
</picture>

Answer 2

Сработаал следующий код

<picture>
<source srcset="{$slide.image_url|replace:'.jpg':'_mobil.jpg'}" media="(max-width: 480px)">
 <img src="{$slide.image_url}">
</picture>