В этой статье я расскажу, как быстро и бесплатно добавить ярлыки к товарам Virtuemart 2.
Virtuemart 2. Как добавить к товару ярлыки «скидка», «новинка» и т. д.(Кейс #4).

Часто, для привлечения внимания к определенным товарам интернет-магазина, на них добавляются ярлыки. Это может быть «Новинка», «Скидка», «Акция» и другие. Данных трюк позволяет быстрее продавать товары, или, как минимум, заинтересовать пользователей. Все любят скидки, даже если это просто рекламный ход. Virtuemart 2 позволяет достаточно легко реализовать данную функцию, но почему-то в Интернете описаны лишь способы требующие хаков ядра, либо оплаты за дополнительное расширение. В этой статье я расскажу, как самостоятельно, быстро и бесплатно добавить любые ярлыки к товарам Virtuemart 2 не используя дополнительных расширений и не прибегая к хакам.

Добавление ярлыков в Virtuemart 2. Планирование.

Прежде, чем приступать к реализации, было бы неплохо все спланировать. Весь процесс добавления ярлыков будет состоять из следующих этапов:

  1. Выбор и подготовка изображений ярлыков.
  2. Создание дополнительного поля Virtuemart 2 для ярлыков.
  3. Добавление кода вызова дополнительного поля Virtuemart 2 в макетах категории и товара.
  4. Добавление дополнительного поля для определенных товаров.
  5. Оформление ярлыка в контексте товара.

Здесь этапы описаны кратко, но дают возможность понять, что именно требуется сделать. Ниже разберем каждый этап подробно и с примерами.

Добавление ярлыков в Virtuemart 2. Выбор и подготовка изображений ярлыков.

Во-первых, нужно определиться, сколько мы хотим добавить ярлыков, подобрать подходящие изображения и привести их к единому стилю и размерам. Предположим, нам нужно создать три различных ярлыка с возможностью добавлять любой из них к любому товару. Пусть это будет «Скидка», «Новинка» и «Акция». На самом деле ярлыков может быть сколько угодно. Добавить их позже также не составит большого труда.

Вот наши ярлыки:

virtuemart 2 product labels

Они представляют собой три картинки формата PNG размеров 48x48 px. Если вы планируете поместить ярлыки непосредственно на изображения товаров, то картинки ярлыков обязательно должны иметь прозрачный фон, а соответственно быть форматов PNG или GIF.

После того, как ярлыки подготовлены, необходимо загрузить их на сайт. Проще всего сделать так:

  1. Через FTP загрузить изображения ярлыков в папку:
     images\stories\virtuemart\product
  2. Перейти в Медиа-менеджер Virtuemart 2 (Магазин –> Медиа-файлы) и нажать кнопку «Синхронизировать с Virtuemart».

Файлы ярлыков должны появиться в списке:

virtuemart 2 product labels

Когда ярлыки готовы и загружены на сайт можно переходить к следующему этапу.

Добавление ярлыков в Virtuemart 2. Создание дополнительного поля Virtuemart 2 для ярлыков.

Добавлять ярлыки к товарам мы будем с помощью дополнительного поля Virtuemart 2. Причем поле потребуется только одно. Переходим в менеджер дополнительных полей Virtuemart 2 и создаем новые поле типа «Изображение» с настройками, как показано на рисунке ниже:

virtuemart 2 product labels

Не забудьте указать позицию макета. Она должна быть уникальной и использоваться только для этого поля.

После того, как дополнительное поле создано, переходим к добавлению его кода вызова для товаров.

Добавление ярлыков в Virtuemart 2. Добавление кода вызова дополнительного поля Virtuemart 2 в макетах категории и товара.

Предполагается, что ярлыки будут показаться в категории товаров на некоторых товарах категории и в карточке товара. Ниже привожу коды отдельно для макета категории и товара.

Код вызова дополнительного поля ярлыков на странице категории товаров.

1. Копируем файл:

components/com_virtuemart/views/category/tmpl/default.php

в папку:

templates/[ваш_шаблон]/html/com_virtuemart/category/

Если каких-то каталогов не хватает, создаем их самостоятельно. Если файл уже присутствует в конечной папке, то заменять его не нужно.

2. В скопированном файле (который находится в папке с шаблоном), находим код вызова основного изображения и добавляем после него приведенный код:

<div class="product floatleft<?php echo $Browsecellwidth . $show_vertical_separator ?>">
	<div class="spacer">
		<div class="width30 floatleft center">
			<a title="<?php echo $product->product_name ?>" rel="vm-additional-images" href="/<?php echo $product->link; ?>"><?php echo $product->images[0]->displayMediaThumb('class="browseProductImage"', false);?>
			 </a> <!-- Окончание кода основоного изображения. После него нужно вставлять код, который представлен ниже!  -->
 <?php // Код вывода ярлыка
if (!empty($product->customfields)) { //проверяем, есть ли дополнительные поля у текущего товара ?>
<?php foreach ($product->customfields as $field){ // если поля есть, просматриваем все в поисках поля ярлыка
if($field->layout_pos == 'product-label'){ // ищем поля ярлыка через позицию ?> <div class="category-product-label"><?php echo $field->display; //выводим ярлык ?> </div>
<?php }}} ?>

Код вызова дополнительного поля ярлыков на странице товара.

1. Копируем файл:

components/com_virtuemart/views/productdetails/tmpl/default_images.php

в папку:

templates/[ваш_шаблон]/html/com_virtuemart/productdetails/

Если каких-то каталогов не хватает, создаем их самостоятельно. Если файл уже присутствует в конечной папке, то заменять его не нужно.

2. В скопированном файле (который находится в папке с шаблоном), находим код вызова основного изображения и добавляем после него приведенный код:

<div class="main-image"><?php echo $image->displayMediaFull("",true,"rel='vm-additional-images'"); ?>
	 <div class="clear"></div>
	<!-- Окончание кода вывода основного изображения. После него нужно вставлять код, который представлен ниже--> 
 <?php if (!empty($this->product->customfieldsSorted['product-label'])) { // Проверяем, есть ли у товара ярлык 
$this->position = 'product-label'; ?> <div class="product-label"><?php echo $this->loadTemplate('customfields'); //Выводим ярлык ?> </div>
<?php }?>

Перед правкой кода мы переопределяем макеты категории и страницы товара в используемый шаблон Joomla, что предотвратит исчезновение правок в случае обновления Virtuemart 2.

На этом правки кода закончены. Переходим к добавлению ярлыков для определенных товаров.

Добавление ярлыков в Virtuemart 2. Добавление дополнительного поля ярлыков для определенных товаров.

Здесь все очень просто. Выбираем в админке товар, к которому нужно добавить ярлык. Переходим в его настройки. Во вкладке «Настраиваемые поля» выбираем тип поля «Ярлык» и указываем для него необходимое изображение ярлыка.

virtuemart 2 product labels

Сохраняем. Если все сделано правильно, то после этого действия на сайте, в категории и товаре, появится наше изображение. После этого останется лишь красиво его оформить.

Добавление ярлыков в Virtuemart 2. Оформление ярлыка в контексте товара.

Всё, что касалось работы с данными, мы сделали. Осталось исключительно оформление (верстка). Поскольку в коде мы задали уникальные классы, то остается только оформить ярлык с помощью CSS. Ниже я привожу CSS-код, который подходит для стандартного шаблон Virtuemart 2. Его использовать необязательно. Можно все оформить по-своему, но для примера привожу:

.category-product-label {
    left: 30px;
    position: relative;
    top: -25px;}
 .product-label {
    left: 50px;
    position: relative;
    top: -150px;}
 .category-product-label img, .product-label img {width:48px;height:48px;}
 .category-product-label .vm-img-desc, .product-label .vm-img-desc {display:none;}

После этого наши ярлыки выглядят так:

virtuemart 2 product labels

virtuemart 2 product labels

Таким образом, мы получили функционал добавления неограниченного количества ярлыков для товаров без каких-либо дополнительных расширений и хаков. Подобным способом можно добавлять и выводить не только ярлыки, но и любые другие данные в любом месте макетов. Всё удивительное просто :-).

---------

Если вам надоело читать подобные статьи и ковыряться в коде, то ваш вариант - изготовление сайтов на заказ(http://www.savsolution.ru/). Можете воспользоваться услугами этой студии.

Об авторе
Об авторе
Wedal (Виталий). Веб-разработчик полного цикла (Full Stack). Создатель и автор сайта Wedal.ru.
Основной профиль – создание сайтов и расширений на CMS Joomla.

Добавить комментарий

Для отправки комментария введите код с картинки:
Защитный код
Обновить

Комментарии  

+1 # Sergey_on 04.10.2013 12:21
У Вас отличные и полезные статьи, приятный блог, сейчас же куплю у вас вечную ссылку :) По-больше бы про VM 2, интересная тема.
Ответить | Ответить с цитатой | Цитировать
0 # Станислав 04.10.2013 18:20
Здравствуйте Виталий. Благодарю за полезную статью. Сделал все по вашим рекомендациям НО в карточке товаре, кроме ярлыка, выводит еще и название настраиваемого поля, т.е. "Ярлык". В категории все нормально отображается. Подскажите как исправить.
Ответить | Ответить с цитатой | Цитировать
0 # Станислав 04.10.2013 19:16
Нашел решение, дополнив последнюю строку SCC:
.category-product-label .vm-img-desc, .product-label .vm-img-desc, .product-fields-title {display:none;}
Ответить | Ответить с цитатой | Цитировать
-1 # Полина 09.10.2013 12:27
Спасибо большое за гайд, но есть один вопрос, как повесить ярлык в модуле виртуамарт-товары. Вероятно, это надо делать как-то по аналогии с описанием, но я, увы, не сильна в кодах. Попыталась добавить дефолтный файл модуля в шаблон и вставить туда код ярлыка, но ничего не получилось =) Хелп ми, плиз =)
Ответить | Ответить с цитатой | Цитировать
-2 # Wedal 10.10.2013 02:38
Полина, используйте код вызова для категории. Он работает. Проверил лично.
Ответить | Ответить с цитатой | Цитировать
0 # Полина 10.10.2013 12:37
А подскажите, пожалуйста, правильный путь директории, создаваемой в шаблоне. И еще, после чего ставить код ярлыка и что надо добавить в CSS? :-*
Ответить | Ответить с цитатой | Цитировать
0 # Wedal 11.10.2013 02:29
Полина, директория:
templates/ваш_шаблон/modules/имя_модуля/

Код нужно ставить туда, где удобнее. Там посмотрите по коду макета, посмотрите на сайте через Firebug.

С CSS опять же поможет Firebug.
Ответить | Ответить с цитатой | Цитировать
0 # Полина 11.10.2013 15:54
Спасибо! Правда, пришлось немного поковыряться, учитывая мою "пряморукость", но получилось 8)
Ответить | Ответить с цитатой | Цитировать
0 # Полина 11.10.2013 17:03
Я не могу найти нужное место для вставки кода, даже если получается поставить картинку, то под изображением товара образуется огромный отступ.
Ответить | Ответить с цитатой | Цитировать
0 # Полина 11.10.2013 17:08
http://microshef.ru/magazin.html
Ответить | Ответить с цитатой | Цитировать
0 # Полина 11.10.2013 18:13
Кстати, оказывается, отступ и в остальных местах тоже появляется.
Ответить | Ответить с цитатой | Цитировать
-1 # Wedal 12.10.2013 01:29
Полина, это вопрос CSS. DIV с ярлыком должен находится в DIV'е c товаром. При этом у родительского DIV'а должен быть CSS-стиль position:relative, а у дочернего: position:absolute.
Ответить | Ответить с цитатой | Цитировать
0 # Полина 11.10.2013 16:22
Хотя, не совсем... В модуле Рекомендованные товары выводится, а в Случайных товарах почему-то нет...
Ответить | Ответить с цитатой | Цитировать
+1 # Мария111 21.01.2015 11:12
Эту директорию надо создавать ил она должна быть?
Ответить | Ответить с цитатой | Цитировать
0 # Полина 10.10.2013 12:48
Кстати, может что-то я сделала не так: в опере ярлыки отображаются отлично, а вот в других браузерах (Фокс, Яндекс, Хром) картинка выводится под изображением товара, а под ней еще и имя файла... Как будто на нее CSS не действует.
Ответить | Ответить с цитатой | Цитировать
0 # Полина 10.10.2013 13:11
С браузерами разобралась, просто почистила в них кэш :oops: А вот насчет кода для модуля, жду ответа :-)
Ответить | Ответить с цитатой | Цитировать
0 # Ветал 10.09.2015 10:02
Цитирую Wedal:
Полина, используйте код вызова для категории. Он работает. Проверил лично.

Сорри за -, все работает
Ответить | Ответить с цитатой | Цитировать
0 # Terra 19.11.2013 08:31
Все доброго времени суток, у меня не получается, может с добавлением кодом что то не так делаю, добавлял код ниже где начиналось эта тема в коде, и даже заменял.страница с товаром вообще не открывается, в коде не чего не менял просто копировал вставлял. ПОМОГИТЕ! очень надо!
Ответить | Ответить с цитатой | Цитировать
-1 # Wedal 20.11.2013 03:47
Terra, если страница не открывается, должна быть какая-то ошибка. Если она не отображается, то нужно включить отображение ошибок. Напишите ошибку, тогда можно будет разобраться.
Ответить | Ответить с цитатой | Цитировать
0 # chaban 04.12.2013 11:01
В коде действительно есть некоторые опечатки:
1. комментарии (попробуйте аккуратно удалить комментарии автора)
2. пробелы между ключевыми словами
phpif => php if)
А вообще отличная идея, спасибо автору!!!
Ответить | Ответить с цитатой | Цитировать
-1 # Wedal 05.12.2013 02:58
chaban, поправил код. Спасибо, что написали.
Ответить | Ответить с цитатой | Цитировать
0 # Даниил 16.12.2013 16:42
Здравствуйте! в категории товара все отлично. А вот в карточке выдает ошибку.
Warning: Invalid argument supplied for foreach() \www\components\com_virtuemart\views\productdetails\tmpl\default_customfields.php on line 26

проблема в этом куске
Ответить | Ответить с цитатой | Цитировать
0 # Даниил 16.12.2013 17:02
вот echo $this->loadTemplate('customfields');
Ответить | Ответить с цитатой | Цитировать
-1 # Wedal 17.12.2013 02:29
Даниил, что в файле components\com_virtuemart\views\productdetails\tmpl\default_customfields.php в 26 строчке?
Ответить | Ответить с цитатой | Цитировать
0 # Даниил 17.12.2013 17:45
foreach ($this->product->customfieldsSorted[$this->position] as $field) {
Ответить | Ответить с цитатой | Цитировать
-1 # Wedal 18.12.2013 02:53
Даниил, у меня только одно предположение. Название позиции в коде перед
Код:echo $this->loadTemplate('customfields');
не
Код:$this->position = 'product-label';
либо в настройках дополнительного поля указана другая позиция.
Ответить | Ответить с цитатой | Цитировать
0 # Даниил 18.12.2013 05:05
Огромное спасибо! Проблема решилась просто!) В куске кода который вставляем в default_images.php просто закоменчен был
// Проверяем, есть ли у товара ярлык $this->position = 'product-label'; :lol:
Ответить | Ответить с цитатой | Цитировать
0 # Мария111 21.12.2013 18:40
Добрый день. подскажите пожалуйста. очень надо!!!. всё поставила. всё работает. на странице категорий вообще отлично, но в карточке товара изображение ярлыка деформируется (сжимается и растягивается) - так понимаю что где-то прописаны размеры этой позиции - но вот только где? ПОЖАЛУЙСТА, ПОДСКАЖИТЕ
:cry:
Ответить | Ответить с цитатой | Цитировать
0 # Мария111 21.12.2013 19:22
а методом "перемещения кода" к сожалению ничего не получилось - картинка стала в правильных пропорциях - но очень большая
Ответить | Ответить с цитатой | Цитировать
-1 # Wedal 23.12.2013 02:57
Мария, чтобы изображение не деформировалось, задайте ему размеры через CSS. Пример есть в этой статье. Не забывайте про пропорцию ширины и высоты.
Ответить | Ответить с цитатой | Цитировать
0 # Мария111 23.12.2013 23:05
дело в том что именно это я сразу и сделала, но это никак не повлияло(((
если убрать эти строчки - пропорции восстанавливаются , но картинка становится таким размером как заданы миниатюры в шаблоне VM2.category-product-label img, .product-label img {width:60px;height:60px;}
.category-product-label .vm-img-desc, .product-label .vm-img-desc {width:60px;height:60px;}.
А может быть проблема default.php ведь проблема появляется именно в карточке товара, на странице категорий всё отлично
Ответить | Ответить с цитатой | Цитировать
0 # Мария111 24.12.2013 00:08
Вобщем-то в проблеме так и не разобралась. уже доделаю. сайт - тогда буду искать в чём беда. НО В ИТОГЕ ДЛЯ ТОГО ЧТОБЫ ЯРЛЫК БЫЛ 60Х60. Я ПРОПИСАЛА {width:40px;height:190px;}. ЯРЛЫК КОНЕЧНО НЕМНОГО больше чем задуман - но хотя бы в правильных пропорциях (квадратный). Как так получилось - не пойму - но вот может кто-то подскажет. СПАСИБО И АВТОРУ И ТОМУ, КОМУ НЕ ЛЕНЬ БУДЬ ПОДСКАЗАТЬ
Ответить | Ответить с цитатой | Цитировать
0 # Wedal 24.12.2013 03:17
Мария, если есть живой пример - покажите. Тогда сразу объясню в чем дело. Если нет, то посмотрите через Firebug, все станет много понятнее.
Ответить | Ответить с цитатой | Цитировать
0 # Мария111 24.12.2013 00:55
и если можно :cry: поясните немного подробнее как уменьшить расстояние после ярлыка. спасибо
Ответить | Ответить с цитатой | Цитировать
0 # Snake 60 31.03.2014 12:04
Решение конечно интересное, я до него не додумался, но немножко фейковое :) Объясню почему. Например возьмем ярлык "Скидка". По идее он должен вешаться на товар, автоматически если у товара есть скидка. А это не так. Мы просто вручную на любой товар, лепим любую картинку, что не совсем правильно. Моё ИМХО, лучше развить идею, создать разные поля и добавить код например проверки есть скидка на товар или нет, товар по акции(рекомендованный) или нет и т.д.
Ну а так, для общего развитию - спасибо за инфу =)
Ответить | Ответить с цитатой | Цитировать
0 # Wedal 01.04.2014 03:35
Snake 60, в целом с вами согласен, однако, как показывает практика, чаще владельцы магазина хотят делать это именно вручную, чтобы привлечь внимание покупателей к определенным товарам. Но вообще, вы подали хорошую идею для нового кейса. Постараюсь написать howto, как это сделать.
Ответить | Ответить с цитатой | Цитировать
0 # ficsa 28.04.2014 17:10
Виталий здравствуйте! А можно ли тоже самое сделать применительно к вирту1, а не 2?
Ответить | Ответить с цитатой | Цитировать
0 # Wedal 30.04.2014 03:39
ficsa, теоретически - можно, используя типы полей. Но реально не уверен, что получится без хаков, да и реализация будет совсем другой.
Ответить | Ответить с цитатой | Цитировать
0 # Константин 01.05.2014 13:31
Не выводиться ярлык в категории товара, показывается только в самом товаре, в чем может быть проблема?
Ответить | Ответить с цитатой | Цитировать
0 # Константин 01.05.2014 13:45
Вот здесь показывается:
http://lindtextil.cz/ru/magazin/gotovye-shtory/cerame-1-detail

Здесь нет:
http://lindtextil.cz/ru/magazin/gotovye-shtory
Ответить | Ответить с цитатой | Цитировать
0 # Wedal 02.05.2014 07:01
Константин, какой код вставляли в категории?
Ответить | Ответить с цитатой | Цитировать
0 # Константин 02.05.2014 09:09
Вот этот:
Ответить | Ответить с цитатой | Цитировать
0 # Wedal 03.05.2014 03:51
Константин, используйте кнопку "Код" для вставки. И еще, вы указали в настройках поля позицию макета product-label?
Ответить | Ответить с цитатой | Цитировать
0 # ruskost 03.05.2014 08:19
Здравствуйте, спасибо за прекрасную статью! Есть один вопрос: подскажите какой файл css нужно редактировать на последнем шаге (желательно еще и путь к файлу)? Заранее спасибо
Ответить | Ответить с цитатой | Цитировать
0 # Wedal 05.05.2014 03:14
ruskost, кликните на странице вашего сайта правой кнопкой мыши и выберите пункт "Просмотр исходного кода"(или аналогичный). Откроется исходный html-код страницы. В нем вы увидите все подключенные CSS-файлы и пути к ним. Можете добавить в любой, но лучше в тот, который содержится в используемом вами шаблоне.
Ответить | Ответить с цитатой | Цитировать
0 # ruskost 05.05.2014 04:40
Wedal, спасибо, что откликнулись! Я поправил файл template.css в папке css шаблона.
Все прекрасно работает за исключением двух моментов:
1) в товаре не отображается ярлык и,
2) в рекомендуемых товарах также нет этих значков.
Вы не можете подсказать как добавить ярлыки на указанные страницы?
Ответить | Ответить с цитатой | Цитировать
0 # Константин 05.05.2014 10:25
Спасибо разобрался. Подскажите еще вот такой момент, может кому-то тоже пригодится.
Если в карточке товара несколько изображений, то при переходе по ним, меняется изображения встраимого ярлыка на маленькие изображения самих фото, вот пример:http://lindtextil.cz/cz/obchod/hotove-zaclony/cerame-1-detail
1) http://screencast.com/t/4ifI4OuoV
2) http://screencast.com/t/EweG0yHIyJxc
Ответить | Ответить с цитатой | Цитировать
0 # Wedal 06.05.2014 03:07
Константин, интересно. Такого быть не должно. Тут дело уже в скриптах. Видимо скрипт собирает все картинки по img на странице, или в определенном блоке. Нужно его поправить, либо попробовать вставить код вывода дополнительного поля лейбла в другом месте, подогнав через CSS.
Ответить | Ответить с цитатой | Цитировать
+1 # Рома 10.05.2014 00:24
Добрый день! Спасибо за хорошие уроки! Подскажите пожалуйста как картинки можно вставить в рекомендуемые товары, новинки?
Ответить | Ответить с цитатой | Цитировать
0 # Рома 10.05.2014 08:36
Подскажите пожалуйста куда именно надо вставлять код для вывода в модулях картинки? В файле default.php в директории mod_virtuemart_product. Я никак не могу ее вывести уже все перепробовал? Вы пишите сверху что код можно вставить тот же что и для вывода в категории или его надо также редактировать? Заранее спасибо!
Ответить | Ответить с цитатой | Цитировать
0 # артем2007 19.06.2014 09:02
КАК оформить ярлык с помощью CSS не могу понять в каком именно css надо поправить размеры и где он находится. ОТВЕТЬТЕ пожалуйста очень хочу доделать.
Ответить | Ответить с цитатой | Цитировать
-1 # Wedal 20.06.2014 03:29
артем, это поможет ответить на все ваши вопросы: http://wedal.ru/internet/rukovodstvo-po-firebug.html
Ответить | Ответить с цитатой | Цитировать
0 # Runb8 24.06.2014 12:03
Добрый день!
В категориях сработало, а вот в карточке товара не получилось. Даже, не знаю, в чем может быть загвоздка, помогите разобраться. Смотрю html-код, div с классом product-label есть, но он пустой.
Сайт пока на локальном хостинге.
Ответить | Ответить с цитатой | Цитировать
0 # Runb8 24.06.2014 12:13
Спасибо!!! Все получилось! Вопрос решила, час промучавшись, как только написала Вам)
Код:<?php if (!empty($this->product->customfieldsSorted['product-label'])) { // Проверяем, есть ли у товара ярлык $this->position = 'product-label'; ?>
Копировала код из статьи, а там фрагмент кода идет подряд за комментом, то есть тоже закомментирован. Надо было лишь нажать Enter)
Ответить | Ответить с цитатой | Цитировать
0 # ruskost 08.07.2014 11:52
Цитирую Wedal:
Полина, это вопрос CSS. DIV с ярлыком должен находится в DIV'е c товаром. При этом у родительского DIV'а должен быть CSS-стиль position:relative, а у дочернего: position:absolute.


Друзья, кто знает как правильно избавится от пробелов? Правильно ли я вставляю код?
Код:<div class="product-images" style="position:relative">
<?php /** @todo make image popup */
echo $product->images[0]->displayMediaThumb('class="browseProductImage" border="10" title="'.$product->product_name.'" ',true,'class="modal"');
?>
<?php // Код вывода ярлыка
if (!empty($product->customfields)) { //проверяем, есть ли дополнительные поля у текущего товара ?>
<?php foreach ($product->customfields as $field){ // если поля есть, просматриваем все в поисках поля ярлыка
if($field->layout_pos == 'product-label'){ // ищем поля ярлыка через позицию ?>
<div class="category-product-label" style="position: absolute"><?php echo $field->display; //выводим ярлык ?>
</div>
<?php }}} ?>
</div>
Ответить | Ответить с цитатой | Цитировать
+1 # Wedal 09.07.2014 05:10
ruskost, код в статье поправил.
Ответить | Ответить с цитатой | Цитировать
0 # ruskost 11.07.2014 06:47
Спасибо, Wedal, помогло! Сайт классный!
Ответить | Ответить с цитатой | Цитировать
0 # Nika 01.08.2014 15:41
Здравствуйте, подскажите пожалуйста, как избавиться от пробела под фото. И как поставить ярлык в карточку товара. Спасибо. Всё сделано как вы написали. Большое спасибо Вам за статью!!!
Ответить | Ответить с цитатой | Цитировать
0 # Nika 10.08.2014 10:18
Здравствуйте, подскажите пожалуйста как убрать отспупы. (www.vitalinna.com.ua)
Спасибо Вам огромное за Ваши статьи.
Ответить | Ответить с цитатой | Цитировать
0 # arte12 29.11.2014 22:51
у меня картинка получается ниже и размером 250 на 250 в какой css вставлять этот код подскажите

.category-product-label {
left: 30px;
position: relative;
top: -25px;}
.product-label {
left: 50px;
position: relative;
top: -150px;}
.category-product-label img, .product-label img {width:48px;height:48px;}
.category-product-label .vm-img-desc, .product-label .vm-img-desc {display:none;}
Ответить | Ответить с цитатой | Цитировать
0 # artem2008 30.11.2014 18:42
в карточке товаров картинка ХИТ получилась под основной. как её перенести на передний план. вот ссылка на страницу пробную на неё я немного поигрался позицией но все равно вверху видно

http://онлайн31.рф/katalog/kraska-dlya-volos-prestige-vip-s-rosaimpex-bolgariya/prestizh-balzam-ottenochnyj-silver-effect-detail
Ответить | Ответить с цитатой | Цитировать
0 # Wedal 01.12.2014 08:44
artem2008, в класс:
.product-label
добавьте стиль:
z-index:65000;
Ответить | Ответить с цитатой | Цитировать
0 # artem2008 01.12.2014 18:18
стиль: z-index:65000; помог,но появилась надпись ярлык
Ответить | Ответить с цитатой | Цитировать
0 # Wedal 02.12.2014 05:18
artem2008, добавьте в CCS:

Код:product-label .product-fields .product-field span.product-fields-title{
display:none;
}
Ответить | Ответить с цитатой | Цитировать
0 # artem2008 02.12.2014 19:16
извините за тупость. включив голову допер за 5 минут теперь всё работает
Ответить | Ответить с цитатой | Цитировать
0 # zuzu 08.12.2014 19:21
Что-то *.png прозрачность теряет при загрузке в магазин. Как победить? В первом вирте можно было по ftp перезагрузить файл. Как здесь быть?
Ответить | Ответить с цитатой | Цитировать
0 # Wedal 09.12.2014 05:18
zuzu, здесь также. Ну и убедитесь, что в PNG действительно нет фона, а он не белый, например.
Ответить | Ответить с цитатой | Цитировать
0 # zuzu 09.12.2014 07:23
Фона нет (он становится черным). Пробовал выкачать по ftp файл и миниатюру обратно на компьютер после инициализации магазином - фон прозрачный. Т.е. получается, что файл просто некоректоно обрабатывается магазином. Если файл загрузить не в папку images\stories\virtuemart\product, а в соседнюю папку производителей, то файл подхватывается магазином в нормальном виде.
Ответить | Ответить с цитатой | Цитировать
0 # Wedal 10.12.2014 04:54
zuzu, посмотрите это:
http://forum.virtuemart.net/index.php?topic=119971.0
Но не сказать, что хорошее решение.

Вообще дело, как я понял, в некорректной обработке при создании миниатюр изображений. Самое простое решение - использовать JPG.
Ответить | Ответить с цитатой | Цитировать
0 # Мария111 21.01.2015 11:08
Подскажите пожалуйста как поставить в модуль это счастье((( Выше уже этот вопрос задавался -но не могу разобраться((
Ответить | Ответить с цитатой | Цитировать
0 # Михаилус 23.02.2015 21:51
Подскажете, как сделать чтоб ярлык был внутри тега Код:<a> в котором лежит большая картинка чтоб при клике на этот ярлык открывалось увеличенное изображение в попапе.
Ответить | Ответить с цитатой | Цитировать
0 # Михаилус 24.02.2015 09:31
ну т.е. если ярлык перекрывает изображение то получается что область ссылки под ним не активна, а надо сделать чтоб была активна
Ответить | Ответить с цитатой | Цитировать
0 # Wedal 25.02.2015 04:22
Михаилус, это не так просто. Вам нужно разобрать конструкцию:
Код:$image->displayMediaFull("",true,"rel='vm-additional-images'");
Т.е. отдельно получить путь к изображению, отдельно получить ссылку на полное изображение и изобразить примерно то, что вы видите в html странице в коде макета. После этого вы сможете подсунуть в тег картинку ярлыка.
Ответить | Ответить с цитатой | Цитировать
0 # Борман 05.06.2015 23:08
Кто-нибудь знает как то же самое сделать только в VM3???
Спасибо!
Ответить | Ответить с цитатой | Цитировать
0 # Ветал 09.09.2015 10:57
что-то в модуле товара не выводится ярлык ((
Ответить | Ответить с цитатой | Цитировать
0 # Ветал 10.09.2015 09:54
Все хорошо, но вот трабл, когда картинки меняются, скидка пропадает и вместо нее, на ее месте, мини-картинка (((
Как это можно исправить?
Ответить | Ответить с цитатой | Цитировать
0 # yuri46.7 17.03.2016 19:14
Вознаграждение!
Нужна помощь. Сделать вывод иконок статуса товара в модуле, категории и карточке товара выше описанным способом.
Joomla! 2.5 / VM 2.0.20b
Код:e-mail: ; skype: yuri46.7; тел: +79067435440;<br />Юрий
Возможно кто знает альтернативные расширения, как платные так и халяву. Буду признателен в советах.
Ответить | Ответить с цитатой | Цитировать
0 # Константин 29.03.2016 20:21
Всё отлично! Всё работает! СПАСИБО!!!
но есть маленький нюанс - как убрать лишние пробелы после вывода в категориях?
Ответить | Ответить с цитатой | Цитировать
0 # Wedal 30.03.2016 04:42
Константин, что за лишние пробелы?
Ответить | Ответить с цитатой | Цитировать
0 # Константин 30.03.2016 14:40
появляется куча пустого места в категориях. после рисунка.http://lukar-mag.org/zhilety-iz-ovchiny.html
рядом картинка без стикера и сразу внизу название, артикул, цена.
а если со стикером, то получается куча пустого мета между картинкой и названием товара
Ответить | Ответить с цитатой | Цитировать
0 # Wedal 31.03.2016 04:56
Константин, замените в CSS-коде лейбла position: relative; на position: absolute;. Также блок, дочерний к блоку лейбла, должен иметь стиль position: relative;. Это будет означать, что лейбл позиционируется относительно родительского блока, накладывается на него, и не занимает места в общей структуре блоков. После этого вам останется только выставить его в нужное место с помощью стилей left и top.
Ответить | Ответить с цитатой | Цитировать
0 # Константин 31.03.2016 18:31
Спасибо. Способ хороший. Но если товар присутствует в других категориях то position: absolute; не подходит - всё сбивается. Т.е. (в моем случае) если товар присутствует в категории жилеты и женские жилеты, то просто в жилетах всё ок, а в женских жилетках всё сбивается)
Ответить | Ответить с цитатой | Цитировать
0 # Wedal 01.04.2016 05:26
Константин, положение кнопки не зависит от контента, на который она накладывается, но зависит от макета, который группирует этот контент по странице. Возможно для женских жилеток используется другой макет, либо просто макет построен таким образом, что позволяет контенту (например, изображению товара) "скакать" на странице, из-за чего всё сбивается. Конкретнее нужно уже смотреть. Напишите обе страницы, на которые есть такая разница - я подскажу.
Ответить | Ответить с цитатой | Цитировать
0 # Guest 30.03.2016 08:14
А на VM3 есть решение?
Ответить | Ответить с цитатой | Цитировать
0 # Wedal 31.03.2016 04:47
Guest, на VM3 все точно также, только изменились некоторые названия полей. Точно изменилось $product->customfields на $product->customfieldsSorted. Посмотрите в коде и поправьте по аналогии с другими полями, которые уже выводятся в макете.
Ответить | Ответить с цитатой | Цитировать
0 # alex 10.05.2016 07:31
Добрый день
подскажите, пожалуйста, куда нужно скопировать последний CSS-код?
.category-product-label {
left: 30px;
position: relative;
top: -25px;}
.product-label {
left: 50px;
position: relative;
top: -150px;}
.category-product-label img, .product-label img {width:48px;height:48px;}
.category-product-label .vm-img-desc, .product-label .vm-img-desc {display:none;}

все делал по Вашей инструкции кроме: Код вызова дополнительного поля ярлыков на странице товара.
у меня в карточке товара есть поле Ярлык и уже можно выбрать закруженные картинки

спасибо
Ответить | Ответить с цитатой | Цитировать
0 # Wedal 11.05.2016 06:01
alex, код CSS нужно вставить в файл CSS вашего шаблона Joomla. В каждом шаблоне эти файлы разные, а потому не могу сказать точно. Посмотрите исходный html-код страницы в браузере. Там вы увидите CSS-файлы, подключенные в шаблоне. Поиском найдите их: ".css".
Ответить | Ответить с цитатой | Цитировать
0 # jeka 24.01.2017 21:38
все это прекрасно конечно, но Вы бы еще научили как экспортировать такие поля через csvi
Ответить | Ответить с цитатой | Цитировать
0 # Wedal 25.01.2017 05:49
jeka, экспортировать или все-таки импортировать?
Ярлыки и экспортируются и импортируются точно также, как и любое другое дополнительное поле VM. На сайте CSVI есть подробная инструкция по экспорту/импорту custom fields.
Ответить | Ответить с цитатой | Цитировать
0 # Arta 04.08.2017 16:57
Здравствуйте, возникла некоторая проблема.
Товары стоят в определенном порядке. Например, стул 1 красный - стул 1 синий - стул 1 зеленый. На всех стоит ярлык "в наличии" (бесспорно, большое спасибо Вам за этот метод, все прекрасно работало до определенного момент), но вот возникла проблема. При добавлении сопутствующих товаров (в моем случае - похожих товаров) всплыло кое-что. Если я добавляю к красному стулу синий и зеленый в сопутствующие (и по этому же методу добавлю сопутствующие к синему и зеленому) , то ярлык только у красного (в категории, не использую ярлыки в карточке товара), если поставить сопутствующие к синему и зеленому без красного, то будут отображаться у первых двух и тд. То есть, сопутствующие товары "отрубают" ярлык у последующих по списку товаров в категории. Вы с таким не сталкивались?
Ответить | Ответить с цитатой | Цитировать
0 # Wedal 14.08.2017 08:46
Arta, мудрено... Я вообще не могу представить, как может повлиять "сопутствие" того или иного товара на ярлыки других. Попробуйте вывести $product->customfields через print_r в категории. Посмотрите какие дополнительные поля выводятся для каждого из товаров. Есть ли среди них ярлыки.
Ответить | Ответить с цитатой | Цитировать
0 # Sawell 09.10.2022 07:13
Без особой надежды, но все же спрошу. Нашли решение? )))
Ответить | Ответить с цитатой | Цитировать
0 # Wedal 10.10.2022 07:11
Sawell, опишите вашу проблему, по-возможности, более простым языком, чем в комментарии выше. Возможно подскажу.
Ответить | Ответить с цитатой | Цитировать
0 # Sawell 10.10.2022 07:39
Здравствуйте, Виталий! Есть "Товар 1" и "Товар 2". "Товар 1" в сопутствующих у "Товар 2". И "Товар 2" в сопутствующих у "Товар 1". Т.е. перелинковка между товарами. При таком кейсе, кода у товаров есть сопутствующие, и эти оба товара ("Товар 1" и "Товар 2") выводятся на одной странице категории, то, дополнительные поля подгружаются только у того товара, который был загружен первый. У второго товара просто отсутствует массив "customfields". И дело здесь не в шаблоне.
Ответить | Ответить с цитатой | Цитировать
0 # Wedal 10.10.2022 07:49
Sawell, думается мне, что это сделано умышленно. Ведь если в customfields есть сопутствующий товар, у которого в customfields есть исходный, то это получается объект бесконечного размера. Вроде "У попа была собака...". Конечно, я могу ошибаться, но почему-то логика видится именно такой.
Ответить | Ответить с цитатой | Цитировать
0 # Sawell 10.10.2022 08:05
Не думаю. В ведь в customfields идут только доп. поля. А вот в customfieldsRelatedProducts уже есть вложенные товары. Но! в customfieldsRelatedProducts тоже нет массива customfields. Это первый аргумент. Второй, на странице товара доп. поля прекрасно выводятся, даже с наличием сопутствующих товаров. И третье, даже если Товар 2 в сопутствующих у Товар 1, а Товар 1 нигде не присутствует, то, при выводе в порядке: Товар 1, Товар 2. Товар 2 снова, не будет иметь массива customfields . И в случае вывода в порядке: Товар 2, Товар 1, теперь Товар 1 будет без массива customfields.
Ответить | Ответить с цитатой | Цитировать
0 # Wedal 11.10.2022 05:46
Sawell, по пунктам:

Цитата:
customfieldsRelatedProducts тоже нет массива customfields
Его там и не должно быть. Слишком жирно грузить поля сопутствующих товаров в категории товаров.

Цитата:
Второй, на странице товара доп. поля прекрасно выводятся, даже с наличием сопутствующих товаров.
Это совсем другая страница и другая история. Это никак не связано со страницей категории.

Цитата:
даже если Товар 2 в сопутствующих у Товар 1, а Товар 1 нигде не присутствует, то, при выводе в порядке: Товар 1, Товар 2. Товар 2 снова, не будет иметь массива customfields . И в случае вывода в порядке: Товар 2, Товар 1, теперь Товар 1 будет без массива customfields.
Если все так, то это похоже на баг, хотя я никогда с ним не сталкивался, сколько работал с VM. В том числе часто использую и сопутствующие товары. Какая у вас версия VM? Также проверьте, что в настройках VM, на вкладке "Внешний вид", в разделе "Список товаров" стоит галочка у опции "Показывать произвольные поля товаров в представлении списков". Хотя она должна там быть, иначе бы поля вообще не показывались в категории.
Ответить | Ответить с цитатой | Цитировать
0 # Sawell 11.10.2022 10:46
Виталий здравствуйте!

Цитата:
Какая у вас версия VM?
VirtueMart 2.6.6

Цитата:
Также проверьте, что в настройках VM, на вкладке "Внешний вид", в разделе "Список товаров" стоит галочка у опции "Показывать произвольные поля товаров в представлении списков".
У меня вообще, нет такой настройки.

Я рассматривал решение с прямым обращение в БД для загрузки доп. полей. Но, в моём случае, это не сработает. Т.к. мне нужно выводить плагин. Плагин считает стоимость комплекта. Видимо остаётся только получать данные из плагина и производить расчёт на странице категории. Но, это конечно тот ещё костыль. Может подскажете более элегантное решение?
Ответить | Ответить с цитатой | Цитировать
0 # Wedal 12.10.2022 06:09
Sawell,

Цитата:
VirtueMart 2.6.6
2.6.6?, не 3.6.6? Елки-палки, что мы тогда обсуждаем? Это же древняя версия, после выпуска которой были исправлены уже тонны ошибок. Обновляйте VM. Либо можете сначала проверить на тестовом сайте с последней версией VM ветки 3(!) (VM 3.8.8), работают ли поля.
Ответить | Ответить с цитатой | Цитировать
0 # Sawell 12.10.2022 13:02
Виталий, безусловно, пора обновлять. Пока пытаюсь закрыть некоторые задачи. Т.к. обновление и реализация всего функционала старого сайта займёт не один месяц. Не говоря уже о переносе номенклатуры.
Ответить | Ответить с цитатой | Цитировать
0 # Wedal 13.10.2022 05:24
Sawell, если я правильно помню, обновление с VM2 на VM3 проходит более-менее гладко, без миграций. Но вот если у вас много хаков, то там да, беда будет.
Ответить | Ответить с цитатой | Цитировать
0 # Ярик 25.01.2018 12:16
На станице категории не выводится ярлык, хотя на другом сайт все получалось...
Что может быть?
Вот код:
Ответить | Ответить с цитатой | Цитировать
0 # Wedal 26.01.2018 07:27
Ярик, может быть что угодно. Нужно больше информации.
Ответить | Ответить с цитатой | Цитировать
0 # Виктор 02.03.2019 12:15
Добрый день, Виталий. На vm3 не работает, не выводятся ярлыки. Изменил $product->customfields на $product->customfieldsSorted. В чем еще может быть причина?
Ответить | Ответить с цитатой | Цитировать
0 # Wedal 04.03.2019 06:52
Виктор, временно добавьте в макете вывода строчки:
Код:<pre><?php print_r($product->customfields); ?></pre>
Код:<pre><?php print_r($product->customfieldsSorted); ?></pre>
Вы увидите, как хранятся данные. Найдите то, что вам нужно, и сможете вывести. Главное понимать, что если тип - объект, то нужно использовать ->поле, а если тип - массив, то ['поле'].
Ответить | Ответить с цитатой | Цитировать
0 # Валерий 05.03.2019 14:43
Здравствуйте.
VirtueMart 3.2.2
вставляю предложенный Вами код в файл "шаблон/html/com_virtuemart/category/default.php" ничего не меняется. В этом файле нет кода вызова основного изображения
Код:<div class="product floatleft<?php echo $Browsecellwidth . $show_vertical_separator ?>"> <div class="spacer"> <div class="width30 floatleft center">
икал этот код в \components\com_virtuemart\views\category\tmpl\default.php
Вероятно я не правильно понял - подскажите решение.
Возможно в VirtueMart3 другой файл отвечает за изображение на странице категорий - подскажите куда вставлять предложенный Вами код.
Спасибо
Ответить | Ответить с цитатой | Цитировать
0 # Wedal 06.03.2019 09:08
Валерий, в Virtuemart 3 слегка изменили макеты. Нужный вам файл для категории:
/components/com_virtuemart/sublayouts/products.php
Ответить | Ответить с цитатой | Цитировать
0 # Wedal 06.03.2019 09:09
Не забудьте перед правкой переопределить(скопировать) его в шаблон Joomla и вносите изменения уже там.
Ответить | Ответить с цитатой | Цитировать
0 # Валерий 06.03.2019 16:05
Спасибо за участие.
Код не выводит настраиваемое поле в ViruteMart3

Код:<a title="<?php echo $product->product_name ?>" href="<?php echo $product->link.$ItemidStr; ?>"> <?php echo $product->images[0]->displayMediaThumb('class="browseProductImage"', false); ?> </a> <?php // Код вывода ярлыка if (!empty($product->customfieldsSorted)) { //проверяем, есть ли дополнительные поля у текущего товара ?> <?php foreach ($product->customfieldsSorted as $field){ // если поля есть, просматриваем все в поисках поля ярлыка if($field->layout_pos == 'product-label'){ // ищем поля ярлыка через позицию ?> <div class="category-product-label"><?php echo $field->display; //выводим ярлык ?> </div> <?php }}} ?>
Подскажите пожалуйста, как правильно сделать.
В категории все товары одинаковые, а один особенный. Повесить на него ярлычок-картинку для выделения.
Ответить | Ответить с цитатой | Цитировать