Несколько фотографий в описание товара - [VM1] Дизайн, оформление

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

А все намного проще чем вы думаете, и не надо выкладывать деньги когда все под рукой  .

Мануал написан при использовании Joomla 1.5.17 и VirtueMart 1.1.14

Первое: Создаем категорию которая вам нужна - то есть - ( Virtuemart - товары - добавить категорию ) - в открывшемся листе пишем название категории ( на ваш вкус ), затем спускаемся ниже и даем описание ( если нужно ), ниже идут родительские категории, сколько товаров показать в строке, страница отображения категории, и вот теперь самое главное - последний пункт это ( Просмотр представления (fly-страницы) категории: ) и нужно выбрать flypage_images.tpl, и во вкладке изображение загружаем фотографию для этой категории.

Второе: Создаем товар, и я надеюсь как создать товар вы знаете, то есть - добавить товар - и дать ему все характеристики которые ему нужны, незабываем про вкладку добавить изображение - и после всего сохраняем.

Третье: Я опишу действия чтобы вы не ошиблись, - нажимаем на ( товары ) в левом меню, и у вас выйдет весь перечень товаров. Обратите внимание на таблицу и вы увидите после названия товара идет медиа товара с фотографией маленького листочка и рядом цифра то есть количество, обычно если вы добавили фотографию в товаре то там будет цифра 2. ( затем идут артикул, цена категория и так далее, не буду перечислять ). Теперь нажмите на эту иконку с листочком, ----- выйдет окошко Менеджер файлов где вы сможете добавить еще несколько фотографий нажав на иконку плюс ( добавить ). Дальше объеснять не буду, сами разберетесь, главное добавьте несколько фотографий.

Четвертое, последнее: Идем на сайт и радуемся жизни, где все гениально намного проще чем мы думаем, и не забываем поблагодарить создателей VirtueMart ( можно про себя, вслух ( как это делаю я ), или финансово ( не реклама ) ) за хороший и бесплатный продукт.

---------------------------------------

Теперь можно приукрасить наше чудо.

Если вы видите на сайте что размер дополнительных фотографий вас не устраивает, то я нашел решение на этом форуме если я не ошибаюсь от Vendigo, нужно в шаблоне flypage_images.tpl - ( components/com_virtuemart/themes/default/templates/product_details/flypage_images.tpl ) поменять

Это

echo $this->vmlistAdditionalImages( $product_id, $images )

На это ( где вы можете задать точные размеры дополнительных фотографий )

foreach( $images as $image )
         {
            echo "<a href='".$image->file_url."' title='".$image->file_title."' rel='lightbox[product".$product_id."]'><img src='".$image->file_url."' height='70' width='100'/></a>";

         }

Если вы хотите сделать маленькие дополнительные фотографии на пример 100 ширина на 70 высота то таблица в которой они находятся имеет параметр в CSS классах  200px на 200px, и фотографии пойдут в два ряда.

Но если вас не устроит два ряда то находим меняем в файле theme.css ( components/com_virtuemart/themes/default/theme.css ) следующие параметры ширины и высоты окошка.


Это ( - ширина - width: 200px и - высота - height: 200px )

/** Flypage Styles **/
.thumbnailListContainer {
   text-align: center;
   width: 200px;
   height: 200px;
   overflow: auto;
}

Скажем, на это

/** Flypage Styles **/
.thumbnailListContainer {
   text-align: center;
   width: 180px;
}

В принципе все, надеюсь что ничего не пропустил, главное что не надо ничего покупать, писать и дополнять - все уже есть 

Вложил два файла ( чтобы вы не мучились )


Большая просьба администрации сайта, закрепите эту тему где нибудь в видном месте на форуме. Уж очень много людей ищут ( а поверьте везде ответы туманны ) и опускают руки, не найдя ответа.





[вложение удалено Администратором]

Спасибо tall за разжев, но может дашь совет.
Сделал как ты велел, но вот вторая картинка меня не радует скролом и названием,
можно  это как то убрать?

Спасибо, что так подробно объяснили, ну вот меян интересует следующий вопрос:
я все так сделала, и у меня появляются 2 фотографии тогда, когда заходишь подробнее о товаре, жмешь увеличение, и там как бы меняются фотографии. а вот рядом с товаром в общем списке на сайте только одна фотография. а как сделать, чтобы рядом с товаром были 2 фотографии сразу? (уменьшенные)

У меня почему то дополнительные изображения не появляются. И когда жмешь на увеличение, долго грузятся, но не открываются.

Спасибо огромное!

Только тут встала проблема, что дополнительные картинки - не всегда пропорциональные, и причем их большинство. Можно как то сделать - чтобы создавалась миниатюра пропорционально?

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

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

посмотрите что в 108 строке файла X:\home\bestandquality.loc\www\administrator\components\com_virtuemart\html\product.file_form.php
Не хватает времени  выполнения

Я непонял зачем в коде менять размеры дополнительных изображений, если их можно задать при дополнении их, там вводишь размеры какие надо и будет у тебя превьюшка соответствующего размера.
У меня главная картинка идет превью 180 на 180, а дополнительные 90 на 90, а большие все 500 на 450 открываются.
Когда добавляешь дополнительную картинку к товару все указывается и размер большой и размер превью, и описание даже.

В результате этого действия:

 "Третье: Я опишу действия чтобы вы не ошиблись, - нажимаем на ( товары ) в левом меню, и у вас выйдет весь перечень товаров. Обратите внимание на таблицу и вы увидите после названия товара идет медиа товара с фотографией маленького листочка и рядом цифра то есть количество, обычно если вы добавили фотографию в товаре то там будет цифра 2. ( затем идут артикул, цена категория и так далее, не буду перечислять ). Теперь нажмите на эту иконку с листочком, ----- выйдет окошко Менеджер файлов где вы сможете добавить еще несколько фотографий нажав на иконку плюс ( добавить ). Дальше объеснять не буду, сами разберетесь, главное добавьте несколько фотографий."

дополнительные  фотографии товара создаются почему то с абсолютным путем (через внешний адрес http  а не внутренний по папкам). И при переносе сайта с локалхоста в интернет связи с изображениями не работают(указывают на старый адрес)

Вопрос1: где и что изменить чтоб ссылки сохраняли работоспособность
Вопрос2: где может на сайте переключаться абсолютный/относительный путь к файлам
Вопрос3: использую jomlapack для создания бэкапов сайта. время от времени переношу сайт в новые папки на локалхосте (денвер). Мож при переносе чето не так встало? ( хотя везде в других местах все в норме)

У меня при добавлении новых файлов есть кнопка Обзор, при нажатии которой я выбираю файл у себя на диске и он загружается на сайт, и все прописывается как надо, и хоть запереносись сайт, картинки сохраняются, так как они загружены на сайт и пути к ним прописаны в базе.

Как переделать относительный путь к дополнительному изображению товара в абсолютный?
За отображение картинок на странице товара отвечает файл components\com_virtuemart\themes\default\templates\product_details\flypage_images.tpl   вот кусок его кода:

<?php

if( !defined( '_VALID_MOS' ) && !defined( '_JEXEC' ) ) die( 'Direct Access to '.basename(__FILE__).' is not allowed.' );


// Build a clickable grid with more product images
$maxcolumns = 4;   // Number of products per row

$html = '<div style="clear:both;border-top:1px solid #eeeeee"><table class="product-thumbs" width="100%" cellpadding="0" cellspacing="0"><tr>';
$html .= '<td><div class="thumb-wrap"><img src="'.$mm_action_url.'components/com_virtuemart/shop_image/product/'.$product_full_image.'" width="60" height="60" onmouseover="javascript:document.getElementById(\'zoomoo\').src = this.src"; /></div></td>';  !здесь путь к основному изображению товара абсолютный!
$col=1;
foreach ($images as $image) {
   if ($image->file_is_image != 1) continue;
   $html .= '<td><div class="thumb-wrap"><img src="'.$image->file_url.'" width="60" height="60" !вот в этой строке путь к доп. картинке товара относительный!
 onmouseover="javascript:document.getElementById(\'zoomoo\').src = this.src"; /></div></td>';
   if (++$col == $maxcolumns) {
      $html .= '</tr><tr>';
      $col=0;
   }

Как и где найти название переменной типа $product_full_image только для дополнительных изображений товара?

src="'.$mm_action_url.'components/com_virtuemart/shop_image/product/'.$product_full_image.'" = src="'.$image->file_url.'"
ответ на
Как переделать относительный путь к дополнительному изображению товара в абсолютный?

Подскажите пожалуйста, как сделать, что бы vmlistAdditionalImages выводил картинки с отступами между ними
А это я вообще хочу убрать,
что бы выводились только доп. картинки.

Товарищи, я повторю вопросик, его тут уже задавали. Основная картинка товара отображается нормально при увеличении, подпись на русском, дополнительные изображения открываются тоже нормально, НО подпись в левой какой-то кодировочке. Что сделать. Подскажите плиииз = горююю((

Я вот так исправил, непомню на какой уж версии, но только на одном сайте такое заметил.
1) В файле \components\com_virtuemart\themes\default\theme.php ищем строку (у меня 121) и добавляем utf-8:
$html .= vmCommonHTML::getLightboxImageLink( $image->file_url, $thumbtag, $title ? $title : stripslashes(htmlentities($image->file_title,ENT_QUOTES,'utf-8')), 'product'.$product_id );

Автор: Dron с forum.virtuemart.ru

Я вот так исправил, непомню на какой уж версии, но только на одном сайте такое заметил.
1) В файле \components\com_virtuemart\themes\default\theme.php ищем строку (у меня 121) и добавляем utf-8:
$html .= vmCommonHTML::getLightboxImageLink( $image->file_url, $thumbtag, $title ? $title : stripslashes(htmlentities($image->file_title,ENT_QUOTES,'utf-8')), 'product'.$product_id );

Автор: Dron с forum.virtuemart.ru

+1

dark_star тоже от меня +1
..................................................

У меня тоже сразу не появились дополнительные фото.
Здесь не написали самое главное!

После того, как вы добавили новые фотографии в товар и у вас в медиа изменилось кол-во фотографий идём в настройки категорий. а точнее Список категорий, выбираем нашу категорию и там есть две настройки:

-Страница отображения категории: (это выбор шаблона для самой категории)
-Просмотр представления - это нам и нужно. У меня стоял flypage-ask.tpl
В нём, похоже не предусмотрены доп. фото. Я выбрал flypage.tpl и дополнительные изображения появились.

Ещё момент. У меня Опера и в ней F5 не обновляет страницу (что я только не перепробовал, берёт из кеша) Нужно выйти в категорию магазина и снова зайти по товару, тогда я только увидел изменения

Про главное не написано, потому что каждый шаблон делает под себя, у меня при работе, всегда по умолчанию ставится flypage.tpl, в котором доп картинки предусмотрены. Хотя собственно, никто не мешает ведь вывести перемененные доп картинок в свой шаблон.

Если вы видите на сайте что размер дополнительных фотографий вас не устраивает, то я нашел решение на этом форуме если я не ошибаюсь от Vendigo, нужно в шаблоне flypage_images.tpl - ( components/com_virtuemart/themes/default/templates/product_details/flypage_images.tpl ) поменять

Это

Код

echo $this->vmlistAdditionalImages( $product_id, $images )

На это ( где вы можете задать точные размеры дополнительных фотографий )

Код

foreach( $images as $image )
         {
            echo "<a href='".$image->file_url."' title='".$image->file_title."' rel='lightbox[product".$product_id."]'><img src='".$image->file_url."' height='70' width='100'/></a>";

         }

После этого загружаются оригинальные фотографии, уменьшенные браузером, а не созданные миниатюры! Ни кто с таким не сталкивался?

А как изменить очередность вывода дополнительных фотографий? В медиа-менеджере такого не предусмотрено.

Такая проблема возникла(   Добавил ещё изображения, рамочки появились, но без изображений,  а кода нажимаешь увеличить то всё нормально показывает.

Точно не помню, но вроде такая проблема у меня была. У меня превьюшка чуть большего размера не выводилась. Делал определенного размера под шаблон (gk_yourshop) и превьюшка появляется. Вроде ксс подправил и все стало работать.

Здравствуйте.
Не получился описанным способом "каменный цветок".
Загруженная в самом товаре картинка ложится - components/com_virtuemart/shop_image/product/resized/poni_90x141.png
А вот из списка которая грузится через медиа-менеджер попадает в другое место и не отображается привьюха - components/com_virtuemart/shop_image/product/components/com_virtuemart/shop_image/product/poni2.png
Не могу понять.. откуда такие "ноги вырорсли?"

Подскажите, пожалуйста.

Я решил проблему следующим образом:
в php.ini Maximum execution time of each script, in seconds (Максимальное время выполнения каждого сценария в секундах) поставил 60 (max_execution_time = 60)
И заменил в product.file_form.php $downloadRootFiles = vmReadDirectory (DOWNLOADROOT, '.', True) на $downloadRootFiles = vmReadDirectory (DOWNLOADROOT, '.', True, True);
І в мене вийшло

sasha987654321 в каком ты документе max_execution_time нашел?

Я решил проблему следующим образом:
в php.ini Maximum execution time of each script, in seconds (Максимальное время выполнения каждого сценария в секундах) поставил 60 (max_execution_time = 60)
И заменил в product.file_form.php $downloadRootFiles = vmReadDirectory (DOWNLOADROOT, '.', True) на $downloadRootFiles = vmReadDirectory (DOWNLOADROOT, '.', True, True);
І в мене вийшло

в php.ini Maximum execution time of each script,
Надеюсь понятно что такое php.ini

Подскажите пожалуйста, как сделать, что бы vmlistAdditionalImages выводил картинки с отступами между ними

Тот же вопрос. Сделал вывод дополнительных картинок по горизонтали. как теперь сделать между ними отступ?