Вход • Регистрация

Вывести надпись на фото в карточке товаров

  • 27 июля 2016 г.
  • Как вывести надпись надо фото в карточке товара? У меня есть определенная серия товара у которой несколько цветов, которые обозначаются цифрами, мне нужно чтобы покупатель понимал что есть что. Вот сам код вывода

    Код
    //вывод изображений товара
    if (!empty($result["img"]))
    {
    echo '<div class="js_shop_all_img shop_all_img shop-item-big-images">';
    $k = 0;
    foreach ($result["img"] as $img)
    {
    switch ($img["type"])
    {
    case 'animation':
    echo '<a class="js_shop_img shop-item-image'.(empty($k) ? ' active' : '').'" href="'.BASE_PATH.$img["link"].'" rel="prettyPhoto[gallery'.$result["id"].'shop]" style="background-image:url('.BASE_PATH.$img["link"].')" image_id="'.$img["id"].'">';
    break;
    case 'large_image':
    echo '<a class="js_shop_img shop-item-image'.(empty($k) ? ' active' : '').'" href="'.BASE_PATH.$img["link"].'" rel="large_image" width="'.$img["link_width"].'" height="'.$img["link_height"].'" style="background-image:url('.BASE_PATH.$img["link"].')" image_id="'.$img["id"].'">';
    break;
    default:
    echo '<a class="js_shop_img shop-item-image'.(empty($k) ? ' active' : '').'" href="'.BASE_PATH.$img["link"].'" style="background-image:url('.BASE_PATH_HREF.$img["link"].')" image_id="'.$img["id"].'">';
    break;
    }
    echo '<img src="'.BASE_PATH.$img["link"].'" alt="'.$img["alt"].'" title="'.$img["title"].'" image_id="'.$img["id"].'">';
    echo '</a>';
    $k++;
    }
    echo '<span class="shop-photo-labels">';
    if (!empty($result['hit']))
    {
    echo '<img src="'.BASE_PATH.Custom::path('img/label_hot_big.png').'">';
    }
    if (!empty($result['action']))
    {
    echo '<img src="'.BASE_PATH.Custom::path('img/label_special_big.png').'">';
    }
    if (!empty($result['new']))
    {
    echo '<img src="'.BASE_PATH.Custom::path('img/label_new_big.png').'">';
    }
    echo '</span>';

    echo '<span class="icon-zoom">&nbsp;</span>
    <span class="js_shop_wishlist shop_wishlist shop-like'.(! empty($result["wish"]) ? ' active' : '').'">&nbsp;</span>';

    echo '</div>';
    if($result["preview_images"])
    {
    echo '<a class="control-prev shop-previews-control" href="#">&nbsp;</a>
    <a class="control-next shop-previews-control" href="#">&nbsp;</a>';
    echo '<div class="shop_preview_img shop-item-previews items-scroller" data-item-per-screen="3" data-controls="shop-previews-control">';
    foreach ($result["img"] as $img)
    {
    echo ' <a class="js_shop_preview_img item" href="#" style="background-image:url('.$img["preview"].')" image_id="'.$img["id"].'">&nbsp;</a>';
    }
    echo '</div>';
    }
    }

    echo '</div>';

    echo '<div class="shop-item-right">';
    echo '<div class="shop-item-info1">';

    //вывод артикула
    if (!empty($result["article"]))
    {
    echo '<h4 class="shop-item-artikul">'.$this->diafan->_('Артикул').': '.$result["article"].'</h4>';
    }

    //вывод производителя
    if (!empty($result["brand"]))
    {
    echo '<div class="shop_brand">';
    echo $this->diafan->_('Производитель').': ';
    echo '<a href="'.BASE_PATH_HREF.$result["brand"]["link"].'">'.$result["brand"]["name"].'</a>';
    echo '</div>';
    }

    //вывод рейтинга товара
    if (!empty($result["rating"]))
    {
    echo '<div class="shop-item-rate rate">'.$this->diafan->_('Рейтинг').": ";
    echo $result["rating"];
    echo '</div>';
    }


    Что прописать, чтобы над фото (см. скрин) появился Alt или тайтл определенной фото?
    • 27 июля 2016 г. , редакция: 27 июля 2016 г.
    • У вас в приведённом коде выводятся alt и title
      Код
      alt="'.$img["alt"].'" title="'.$img["title"].'"
      Добавьте в шаблон SPAN в нужном месте:
      Код
      echo '<span>'.$img["alt"].'</span>';
      или
      Код
      echo '<span>'.$img["title"].'</span>';
      Код вы привели со страницы карточки товара.

      Изображения в этом шаблоне выводятся в блоке <div class="shop-item-left"></div>. Внутри него и вставляйте.
      Большое изображение размещается в блоке <div class="shop-item-big-images"></div>.
      Превью обёрнуты ссылками <a class="js_shop_preview_img"></a>.
      Вставляйте span внутрь ссылок до тега IMG.

      Позиционирование самого блока span настраивайте в CSS.
      • 27 июля 2016 г.
      • А как добавить этот блок в CSS, какое имя будет?
        • 27 июля 2016 г.
        • да как хотите назовите, откройте файл css и вставьте. Вы уже слишком элементарное спрашиваете. Дайте вон Павлу на чай и пусть тогда назовет и вставит блок

Новости

  • 18 июня
  • В сборке большое обновление demo-шаблона, дополнительная защита от спама, улучшение YML-импорта и еще много важного и интересного.
  • 24 апреля
  • В новой сборке совершили революцию в структурировании кастомизированной информации в шаблонах, добавили авторегистрацию пользователей, усовершенствовали защиту от спама, актуализировали накопительную скидку, а также улучшили производительность и стабильность работы системы.
  • 12 января
  • После выхода сборки 7.1 мы выпустили уже три патча, в каждом из которых улучшаем административную часть сайта. Сборка DIAFAN.CMS 7.1.3 уже доступна к установке. 

Форум