Повна назва товару

[hristkni_kopaion]

Як вивести повну назву товару при наведенні курсора, як ось тут:

https://www.yakaboo.ua/

[sasha3337774]

ну можливо ви відправите посилання на свій сайт?

[hristkni_kopaion]

В 15.07.2023 в 12:54, sasha3337774 сказав:

ну можливо ви відправите посилання на свій сайт?

На моєму сайті товари виведені на вітрину через модуль "Рекомендовані".
Відповідно у файлі /system/storage/modification/catalog/controller/extension/module/featured.php

в блоці $data['products'][] = array(

прописано 'name'        => $product_info['name'] = strlen($product_info['name']) > 80 ? substr($product_info['name'],0,80)."..." : $product_info['name'], - виводиться скорочена назва товару, якщо вона задовга.
Якщо залишити 'name'        => $product_info['name'] тоді виводиться повна назва товару. Все.

[hristkni_kopaion]

Пробувала робити ось так - нічого не вийшло.

 

[sasha3337774]

В 17.07.2023 в 12:07, hristkni_kopaion сказав:

Пробувала робити ось так - нічого не вийшло.

якщо у вас якийсь супер секретний сайт, то сидіть і гадайте дальші самі, або до екстрасенсів

[hristkni_kopaion]

В 17.07.2023 в 12:57, sasha3337774 сказав:

якщо у вас якийсь супер секретний сайт, то сидіть і гадайте дальші самі, або до екстрасенсів

https://samaritan-book.in.ua/

[rb2]

On 7/17/2023 at 1:17 PM, hristkni_kopaion said:

https://samaritan-book.in.ua/

Якось так:
 

.product-thumb h4 a
{
  text-wrap: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.product-thumb h4 a:hover
{
    white-space: normal;
}

 

 

Змінено 17 липня 2023 користувачем rb2
+ demo video

[hristkni_kopaion]

В 17.07.2023 в 14:39, rb2 сказав:

Якось так:
 

.product-thumb h4 a
{
  text-wrap: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.product-thumb h4 a:hover
{
    white-space: normal;
}

 

sambook.avi 2 \u041c\u0431 · 2 downloads  

 

На жаль, чомусь не працює. Пише 

text-wrap: nowrap неприпустима назва властивості.

[hristkni_kopaion]

В 17.07.2023 в 14:39, rb2 сказав:

Якось так:
 

.product-thumb h4 a
{
  text-wrap: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.product-thumb h4 a:hover
{
    white-space: normal;
}

 

sambook.avi 2 \u041c\u0431 · 2 downloads  

 

Все вийшло, якщо прописати ось так:

 white-space: nowrap;

overflow: hidden;

text-overflow: ellipsis; 

 

Але скорочує назву до одного рядка, а мені потрібно, щоб назва поміщалася у двох рядках і скорочувалася лише тоді, коли виходить за межі другого рядка.

[hristkni_kopaion]

В 17.07.2023 в 14:39, rb2 сказав:

Якось так:
 

.product-thumb h4 a
{
  text-wrap: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.product-thumb h4 a:hover
{
    white-space: normal;
}

 

sambook.avi 2 \u041c\u0431 · 3 downloads  

 

На "Якабу" дійсно зроблено саме так - прописано в стилях.

Але цей стиль поширюється на всі товари, а мені потрібно тільки в модулі "Рекомендовані". Тому я прописала стиль у файлі featured.php.

Було:

<div class="caption">

<h4><a href="<?php echo $product['href']; ?>"><?php echo $product['name']; ?></a></h4>

Стало:

<div class="caption">

<h4 style="white-space: normal;overflow: hidden;text-overflow: ellipsis;height: 35px;"><a href="<?php echo $product['href']; ?>"><?php echo $product['name']; ?></a></h4>

На жаль, мені не вдалося прописати функцію hover для цього елемента.