Не отображается изображение товар с переменной $MIDDL$

голоса: 0

Здравствуйте.

Есть код в котором я прописал что при просмотре через мобильный должна выводится уменьшеная фотография товарапри помощи переменной $MIDDL$, но почемуто он не срабатывает, работает только $THUMB$, что не так?

<a class="product-image" href="$ENTRY_URL$">
<img class="b-lazy" alt="$NAME$" src="/images/blank-1-.gif" data-src-mobile="<?if($MIDDL$)?>$MIDDL$<?else?>/img404/big.svg<?endif?>" data-src="<?if($THUMB$)?>$THUMB$<?else?>/img404/big.svg<?endif?>" class="gphoto" id="$BLOCK_PREF$-gphoto-$ID$" title="$NAME$">
</a>

| Автор: | Категория: Интернет-магазин

Ответов: 1

голоса: 0

В данной ситуации более корректно сделать такое условие для вывода уменьшенного изображения:

<?if($MIDDL$)?>$MIDDL$<?else?><?if($THUMB$)?>$THUMB$<?else?>/img404/big.svg<?endif?><?endif?>

если нет уменьшенного, выводится превью, если нет превью, тогда выводится img404.

| Автор:

в данном варианте вообще ничего не отображается ни $MIDDL$ ни $THUMB$ и уж тем более /img404/big.svg.

Суть была не в том чтобы: выводить одно изображение если нет другого, а в том что  есть скрипт который вызывает данное изображение если  просматривается с мобильного.

Скрипт:

<script>
var bLazy = new Blazy({
    breakpoints: [{
           width: 480, // Max width
           src: 'data-src-mobile' // Name atribut
       }]
});
</script>

  То что он должен вызывать, но суть даже не в этом, а в том что сама переменная если даже в коде убрать $THUMB$, а оставить $MIDDL$ ничего не отображается почемуто.

aksshop,
  1. По поводу работы переменной $MIDDL$, у вас она работает следующим образом, если оригинал фото товара размерами больше 480х480, тогда формируется уменьшенное фото и оператор $MIDDL$ выводит ссылку на уменьшенное фото.
  2. Если оригинал фото размерами меньше чем 480х480 тогда уменьшенное фото не формируется и ничего не выводится согласно тем настройкам которые вы задали для уменьшенного фото.
Yuri_Geruk,
Хорошо, я это понял, а как прописать чтобы выводилось наименьшее изображение $SMALL$ при просмотре на мобильном, а если десктоп или планшет тогда $THUMB$.
aksshop,

Попробуйте использовать условие:

<?if($USER_AGENT_PDA$)?>здесь код для мобильного<?else?>для компьютера<?endif?>

в итоге можно попробовать через это условие настроить отображение изображения.

Yuri_Geruk,

Я что то не правильно прописал:

<a class="product-image" href="$ENTRY_URL$">
<img class="b-lazy" alt="$NAME$" src="/images/blank-1-.gif" <?if($USER_AGENT_PDA$)?>data-src="<?if($MIDDL$)?>$MIDDL$<?else?>/img404/big.svg<?endif?>" <?else?> data-src="<?if($THUMB$)?>$THUMB$<?else?>/img404/big.svg<?endif?>"  <?endif?>  class="gphoto" id="$BLOCK_PREF$-gphoto-$ID$" title="$NAME$">
</a>

При просмотре на мобильном постоянно  отображает только /img404/big.svg

aksshop,
Как вижу через исходник, подгружается: data-src-mobile="/_sh/192418/19241865s.jpg". Извините,в данной ситуации не подскажу как исправить скрипт для data-src-mobile так как не понимаю как работают  эти атрибуты (data-src-mobile).
Yuri_Geruk,

Да подгружается только через раз, постоянно раза два три нужно обновить страницу.

А принцип работы переменной $SMALL$, что нужно прописать исходя из того кода котрый есть чтобы выводилась $SMALL$

<script>
var bLazy = new Blazy({
 breakpoints: [{
 width: 570, // Max width
 src: 'data-src-mobile' // Name atribut
 }]
});
</script>

 

aksshop,
По поводу $SMALL$, чтобы формировалось превью, должно соблюдаться условие, оригинал фото должен превышать размеры 300х300, тогда превью формируется, если оригинал размерами меньше, превью не формируется, смотрите свои настройки для изображений в настройках модуля ( Настройка загрузчика изображений ).
...