Обновление страницы товара до версии 1.2.1

Инструкция актуальна только для тех, кто имеет изменения в шаблоне магазина "product.html" и хочет их сохранить.

Внимание! Если вы изменяли этот файл, то указанные ниже номера строк могут отличаться от ваших. Используйте их лишь в качестве примерного ориентира.


Шаг 1:

Обновите тему до версии 1.2.1, сохраняя, по желанию, ваши изменения. Изменения должны быть сброшены в обязательном порядке только для файла main.js и main.css.


Шаг 2:

Найдите и удалите строку:

<script src="https://unpkg.com/flickity@2/dist/flickity.pkgd.min.js"></script>

Шаг 3:

Найдите строки №65-123 со следующим содержимым:

<div class="item-pg__slideshow">
 <div class="item-pg__slideshow-main">
        {include file="inc/product.badge.html" product_page=true inline}
        {if !$theme_settings.shop_productpage_show_navblock && $theme_settings.products_show_reviews && !empty($product.rating) && $product.rating > 0}
        <div class="cat-item__rating cat-item__rating--item-page" itemprop="aggregateRating" itemscope itemtype="http://schema.org/AggregateRating">
            <div class="feedback-text">оценка покупателей:</div>
            {include file="inc/product.rating.html" product=$product stars_only=true}
            <div class="feedback-count"><a href="{$wa->shop->productUrl($product, 'reviews')}">({$product.rating_count})</a></div>
        </div>
        {/if}
        <div class="item-pg__slideshow-window">
            <ul class="main-slideshow__list owl-carousel">
            {if $product.images || $video}
                {if $product.images}
                    {foreach $product.images as $image}
                    {if $image@first}
                    <li class="slideshow-owl-item-li is-image"><img src="" class="owl-lazy" id="product-image" itemprop="image" alt="{$product.name|escape}" data-src="{$wa->shop->productImgUrl($product, '970')}" /></li>
                    {else}
                    <li class="slideshow-owl-item-li is-image"><img src="" class="owl-lazy" data-src="{$wa->shop->imgUrl($image, '970')}" alt="{$image.description|escape}" /></li>
                    {/if}
                    {/foreach}
                {/if}
                {if $video}
                    <li class="slideshow-owl-item-li" itemprop="video" itemscope itemtype="http://schema.org/VideoObject">
                        <div itemprop="embedHTML">
                            <iframe src="{$video.url}" width="{$video.width}" height="{$video.height}" frameborder="0" webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe>
                        </div>
                        <meta itemprop="width" content="{$video.width}">
                        <meta itemprop="height" content="{$video.height}">
                        <meta itemprop="name" content="{$product.name|default:""|escape}">
                        <meta itemprop="description" content="{$product.description|default:""|escape}">
                        <meta itemprop="uploadDate" content="{$product.create_datetime|default:""|escape}">
                        {if !empty($video.images[0])}
                            {$_thumb = $video.images[0]}
                            {$_absolute_thumb_uri = "{$wa->url(true)}{$_thumb|substr:1}"}
                            <meta itemprop="thumbnailUrl" content="{$_absolute_thumb_uri|escape}" />
                        {/if}
                    </li>
                {/if}
            {else}
                <li class="slideshow-owl-item-li"><img src="{$wa_parent_theme_url}img/dummy200.png" alt=""></li>
            {/if}
            </ul>
        </div>
 </div>
 {if ($product.images && count($product.images)>1) || ($product.images && $video)}
 <div class="item-pg__slideshow-thumbs">
        <ul class="slideshow-thumbs__list owl-carousel">
        {if $product.images}
            {foreach $product.images as $image}
            <li class="slideshow-thumbs__item" id="product-image-{$image.id}">{$wa->shop->imgHtml($image, '96x96',['alt'=>$image.description|escape])}</li>
            {/foreach}
        {/if}
        {if $video}
            <li class="slideshow-thumbs__item"><img src="{$video.images[0]}" alt=""></li>
        {/if}
        </ul>
 </div>
 {/if}
</div>

Замените их на это:

<div class="item-pg__slideshow">
    <div class="item-pg__slideshow-main">
        {include file="inc/product.badge.html" product_page=true inline}
        {if !$theme_settings.shop_productpage_show_navblock && $theme_settings.products_show_reviews && !empty($product.rating) && $product.rating > 0}
        <div class="cat-item__rating cat-item__rating--item-page" itemprop="aggregateRating" itemscope itemtype="http://schema.org/AggregateRating">
            <div class="feedback-text">оценка покупателей:</div>
            {include file="inc/product.rating.html" product=$product stars_only=true}
            <div class="feedback-count"><a href="{$wa->shop->productUrl($product, 'reviews')}">({$product.rating_count})</a></div>
        </div>
        {/if}
        <div class="item-pg__slideshow-window">
            <div id="switching-image"></div>
            <ul class="main-slideshow__list">
            {if $product.images || $video}
                {if $product.images}
                    <li class="slideshow-owl-item-li" id="product-core-image"><img src="{$wa->shop->productImgUrl($product, '970')}" id="product-image" itemprop="image" alt="{$product.name|escape}" /></li>
                {/if}
                {if $video}
                    <li class="slideshow-owl-item-li" id="video-container"{if $product.images} style="display:none;"{/if} itemprop="video" itemscope itemtype="http://schema.org/VideoObject">
                        <div itemprop="embedHTML">
                            <iframe src="{$video.url}" width="{$video.width}" height="{$video.height}" frameborder="0" webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe>
                        </div>
                        <meta itemprop="width" content="{$video.width}">
                        <meta itemprop="height" content="{$video.height}">
                        <meta itemprop="name" content="{$product.name|default:""|escape}">
                        <meta itemprop="description" content="{$product.description|default:""|escape}">
                        <meta itemprop="uploadDate" content="{$product.create_datetime|default:""|escape}">
                        {if !empty($video.images[0])}
                            {$_thumb = $video.images[0]}
                            {$_absolute_thumb_uri = "{$wa->url(true)}{$_thumb|substr:1}"}
                            <meta itemprop="thumbnailUrl" content="{$_absolute_thumb_uri|escape}" />
                        {/if}
                    </li>
                {/if}
            {else}
                <li class="slideshow-owl-item-li"><img src="{$wa_parent_theme_url}img/dummy200.png" class="is-default" alt=""></li>
            {/if}
            </ul>
        </div>
    </div>
    {if ($product.images && count($product.images)>1) || ($product.images && $video)}
    <div class="item-pg__slideshow-thumbs">
        <ul class="slideshow-thumbs__list owl-carousel">
        {if $product.images}
            {foreach $product.images as $image}
            <li class="slideshow-thumbs__item is-image" id="product-image-{$image.id}">{$wa->shop->imgHtml($image, '96x96',['alt'=>$image.description|escape,'data-src'=>$wa->shop->imgUrl($image, '970')])}</li>
            {/foreach}
        {/if}
        {if $video}
            <li class="slideshow-thumbs__item is-video"><img src="{$video.images[0]}" alt=""></li>
        {/if}
        </ul>
    </div>
    {/if}
</div>


3 ответа
a
Евгений Леман
programmer
#
29 марта 2018 13:37

Стоит отметить, что версия 1.2.1 в данный момент еще не опубликована, т.к. проходит модерацию. Инструкцию пришлось опубликовать раньше, чтобы иметь ссылку на неё, которую можно было бы вставить в changelog. Последний заполняется перед отправкой на публикацию.

a
Георгий
#
30 марта 2018 12:19

Спасибо за подробную инструкцию по обновлению. Обновления коснулись только этих 3-х файлов?

product.html, main.js и main.css.

a
Евгений Леман
programmer
#
30 марта 2018 12:29

Нет, просто в product.html в большинстве случаев администраторы вносят свои модификации. Поэтому для этого файла написана инструкция. Изменения еще коснулись и других файлов:

  • page.html всех приложений
  • search.html магазина
  • home.slider.html магазина
  • blog.js и несколько других шаблонов блога
Чтобы добавить комментарий, зарегистрируйтесь или войдите