Вывод меток в OkayCMS Lite

Правила раздела: faq.php?mode=okay
Модератор: Модераторы

Vitaly
Аватара
Vitaly
Репутация: 20
Сообщения: 109
Зарегистрирован: 15.08.2016
С нами: 7 лет 7 месяцев

Сообщение #1 Vitaly » 24.08.2016, 20:38

Сделал простенький, автоматический вывод меток к товарам для версии Lite
Выводятся ХИТЫ, АКЦИЯ - если есть старая цена, и НОВЫЙ - 30 дней от даты создания.

Из плюсов:
Реализовано на уровне шаблона, хотелось максимально простое решение.
Не нужно править код шаблона, только добавить маленький кусочек.
Можно "регулировать" сколько дней товар будет новым.

У меня всё на CSS, без изображений, но при желании можно заморочиться. Со стилями не парился, это тоже на вкус и цвет...

В файл \design\default_lite_1\html\tiny_products.tpl (учтите название вашего шаблона) дописываем в низу код:

Код: Выделить всё

<div class="metki">
   {if $product->featured}
      <div style="background: #f17a3c;">ХИТ</div>
   {/if}
   {if $product->variant->compare_price}
      <div style="background: #f24941;">АКЦИЯ</div>
   {/if}
   {if $product->created|date_format:'%Y-%m-%d' > "-30 days"|date_format:'%Y-%m-%d'}
      <div style="background: #57bac7;">НОВЫЙ</div>
   {/if}
</div>

И в шаблоне подключаем стиль:

Код: Выделить всё

<style>
.metki {
    position: absolute;
    top: 8%;
    left: 16px;
    z-index: 1;
}
.metki div + div {
    margin-top: 2px;
}
.metki div {
    text-align: center;
    color: #fff;
    font-size: 15px;
    font-weight: 400;
    padding: 0 10px 0 5px;
    width: 75px;
    clip-path: polygon(0% 0%, 88% 0%, 100% 50%, 88% 100%, 0% 100%);
    -webkit-clip-path: polygon(0% 0%, 88% 0%, 100% 50%, 88% 100%, 0% 100%);
}
</style>

У меня выглядит это так - http://piccy.info/view3/10200294/536611af87b72d91e9d5a4d84b2437ab/orig/

UPD: Вывод метки со скидкой в процентах:
Заменяем строку <div style="background: #f24941;">АКЦИЯ</div>
на код

Код: Выделить всё

{if $product->variant->compare_price > $product->variant->price}
      <div style="background: #f24941;">-{100-($product->variant->price/$product->variant->compare_price*100)|string_format:"%d"}%</div>
{/if}
Последний раз редактировалось Vitaly 25.08.2016, 15:18, всего редактировалось 3 раза.

m1hasik M
Аватара
m1hasik M
Возраст: 32
Репутация: 31
Сообщения: 200
Зарегистрирован: 12.11.2015
С нами: 8 лет 4 месяца
Откуда: Днепр
Skype

Сообщение #2 m1hasik » 25.08.2016, 05:49

Классное решение, и действительно, для тех кто знает, все можно решать в шаблоне парой-тройкой строк)

Vitaly
Аватара
Vitaly
Репутация: 20
Сообщения: 109
Зарегистрирован: 15.08.2016
С нами: 7 лет 7 месяцев

Сообщение #3 Vitaly » 25.08.2016, 06:45

Ох, если бы так) Умные дядьки придумали шаблонизаторы типа Smarty. И теперь всё, что угодно в шаблоне делать нельзя. Но эта идеология правильная.

Добавлено спустя 6 часов 23 минуты:
В продолжение темы, есть возможность вместо слова АКЦИЯ, выводить скидку в процентах.
Для этого строку <div style="background: #f24941;">АКЦИЯ</div>
Меняем на <div style="background: #f24941;">-{100-($product->variant->price/$product->variant->compare_price*100)}%</div>

korshunov
korshunov
Репутация: 146
Сообщения: 1854
Зарегистрирован: 03.12.2015
С нами: 8 лет 3 месяца
Skype

Сообщение #4 korshunov » 25.08.2016, 14:54

И будет шикарный типовой вывод примерно в таком виде: -37.108348378158%
Оно конечно, точность вычисления хорошая, только простой покупатель вряд ли это оценит...

Vitaly
Аватара
Vitaly
Репутация: 20
Сообщения: 109
Зарегистрирован: 15.08.2016
С нами: 7 лет 7 месяцев

Сообщение #5 Vitaly » 25.08.2016, 15:07

ОК
Тогда так - <div style="background: #f24941;">-{100-($product->variant->price/$product->variant->compare_price*100)|string_format:"%d"}%</div>

Но наверняка есть такие, кто скажет - а что если у меня новая цена будет выше старой...
Тогда лучше так:

Код: Выделить всё

{if $product->variant->compare_price > $product->variant->price}
      <div style="background: #f24941;">-{100-($product->variant->price/$product->variant->compare_price*100)|string_format:"%d"}%</div>
{/if}


Название раздела: Полезные решения для OkayCMS
Правила раздела: faq.php?mode=okay

Быстрый ответ


Введите код в точности так, как вы его видите. Регистр символов не имеет значения.
Код подтверждения

   

Вернуться в «Полезные решения для OkayCMS»

Кто сейчас на форуме (по активности за 5 минут)

Сейчас этот раздел просматривают: 15 гостей