Здравствуйте! Поставил loading=“lazy” в /public_html/design/themes/abt__unitheme2/templates/common/image.tpl
62 строке <img class=“ty-pict {$valign} {$class} {if $lazy_load}lazyOwl{/if} {if $generate_image}ty-spinner{/if} cm-image” {$image_attributes|render_tag_attrs nofilter} />
добавляем после img просто loading=“lazy”
<img loading=“lazy” class=“ty-pict {$valign} {$class} {if $lazy_load}lazyOwl{/if} {if $generate_image}ty-spinner{/if} cm-image” {$image_attributes|render_tag_attrs nofilter} />
Получилось! Но есть одна проблема как теперь сделать для первой фотографии товара loading=“auto”?
Там в шаблоне в цикле foreach?
Тогда циклу надо задать имя (параметр name в {foreach …} и используете свойство first (пример с оф.сайта)
{* отображаем "НОВОЕ" напротив первого элемента, иначе id *}
<table>
{foreach from=$items key=myId item=i name=foo}
<tr>
<td>{if $smarty.foreach.foo.first}НОВОЕ{else}{$myId}{/if}</td>
<td>{$i.label}</td>
</tr>
{/foreach}
</table>
В зависимости от того, первый проход цикла или нет, ставите auto или lazy
Это вы на каком файле так сделали? Можете прописать путь
Я показал принцип, который вам надо использовать в своём файле, относительно которого был задан вопрос. Найдите foreach, который вызывает image.tpl, передавайте в image.tpl переменную lazy равную true или false.
Сделал как вы сказали не получилось
Сейчас за компьютером, могу более подробно. Темы АБ у меня нет, но принцип то один. Во-первых, не сказали, где вы хотите это применить? Как я понимаю, в выводе товаров категории? Или где? Потому что надо найти тот шаблон, где в цикле перебираются товары, и из него вызывается шаблон image.tpl
в вызывающем шаблоне
{foreach ..... name="foreach_products"}
........
{if $smarty.foreach.foreach_first}
{$lazy=false}
{else}
{$lazy=true}
{/if}
{include file="common/image.tpl" .......... lazy=$lazy}
........
{/foreach}
в файле
design/themes/abt__unitheme2/templates/common/image.tpl
<img loading=“{if $lazy}lazy{else}auto{/if}” .........
так сделали?
Он может не работать, если есть еще модули на работу с изображениями. Попробуйте выключить и проверьте.
Других модулей нет, как проверить скажите пожалуйста? )) проверяю как тут https://web.dev/i18n/ru/browser-level-image-lazy-loading/ они разом все прогружаются, могу ли ссылку на сайт кинуть? Как раз скажите работает ли ваш модуль?
Работает, у нас все модули работают. Напишите в личку, посмотрим.
Написал.
Нет Я как увидел foreach начал искать файл с Product.view потом product_images
и так делал
Плохо работает
То есть это для страницы одного товара? Тогда для изображений товара? или для какого-то блока?
Правильно/полностью поставленная задача - 90% ее решения.
Этот модуль просто напросто дает значение всем фотографиям loading=“lazy”, нам нужно чтобы она видела первое отображение фотографий
Всех товаров и банеров хочу сделать)
Блоги и тд я не трогал, просто отложенная загрузка блока и там добавляешь класс с анимацией
По задумке видимая область товара это большое изображение имеет значение loading=“auto” или вообще удалить бы loading. А скрытые изображенения loading=“lazy”
смотрим шаблон страницы товара
/design/themes/ТЕМА/templates/blocks/product_templates/default_template.tpl
это в респонсив, тема АБ как я понимаю перезаписывает его поэтому смотрим у них в теме
находим
{include file="views/products/components/product_images.tpl" ........
идем в
/design/themes/ТЕМА/templates/views/products/components/product_images.tpl (если в вашей теме нет этого шаблога, то только тогда идем в респонсив и ищем там)
находим что-то типа
{foreach from=$product.image_pairs item="image_pair"}
{if $image_pair}
{if $image_pair.image_id}
{assign var="img_id" value=$image_pair.image_id}
{else}
{assign var="img_id" value=$image_pair.detailed_id}
{/if}
{include file="common/image.tpl" images=$image_pair link_class="cm-image-previewer hidden" obj_id="`$preview_id`_`$img_id`" image_width=$image_width image_height=$image_height image_id="preview[product_images_`$preview_id`]"}
{/if}
{/foreach}
дописываем
{foreach from=$product.image_pairs item="image_pair" name="foreach_images"}
{if $smarty.foreach.foreach_images.first}
{$lazy="auto"}
{else}
{$lazy="lazy"}
{/if}
{if $image_pair}
{if $image_pair.image_id}
{assign var="img_id" value=$image_pair.image_id}
{else}
{assign var="img_id" value=$image_pair.detailed_id}
{/if}
{include file="common/image.tpl" lazy=$lazy images=$image_pair link_class="cm-image-previewer hidden" obj_id="`$preview_id`_`$img_id`" image_width=$image_width image_height=$image_height image_id="preview[product_images_`$preview_id`]"}
{/if}
{/foreach}
теперь идем в
/design/themes/abt__unitheme2/templates/common/image.tpl
<img loading=“{$lazy}” class=“ty-pict {$valign} {$class} {if $lazy_load}lazyOwl{/if} {if $generate_image}ty-spinner{/if} cm-image” {$image_attributes|render_tag_attrs nofilter} />
Теперь она показывает во всех товарах <img loading="“”"
В чем может быть ошибка?