Перейти к содержимому


Можно Ли Сделать Увеличение Фото Категорий Товаров


  • Авторизуйтесь для ответа в теме
Сообщений в теме: 16

#1 алексколомна

алексколомна

    Пользователь

  • Пользователи
  • PipPip
  • 20 сообщений

Отправлено 31 Январь 2014 - 13:56

Добрый день. На данном этапе несколько вопросов. http://plitkanadom.storeland.ru
1. Подскажите, можно ли сделать увеличение фото категорий товаров при наведении курсора или по клику на избражение ( только отображение без дополнительной отдельной вкладки)  и добалять несколько фото для просмотра именно фото самой категории до входа в саму катрочку товара. Планируем магазин керамической плитки, на фото категории будет представлен возможный интреьер, а при входе в данную категорию будут уже представлены товары, из которых состоит данный интерьер Получается основное фото представлено в категории, а фото в карточке товаров уже не так информативно, сейчас как вариант просто в качесте товара добаляю фото интрьеров чтобы их можно было просмотреть при увеличении.
2. Можно ли вообще закрыть просмотр товаров в виде списка , оставив только в табличной форме.  По карточке товара убрать кнопку подробнее, т.е. никаких характеристик не будет, а это будет покупателей немного отвлекать,  а добавить возможность выводить на странице товара дополнительные характеристики- например размер, и т.д.
3. Убрать кнопку сортировки при просмотре карточки товаров.  Заранее спасибо за ответы.

#2 miyako

miyako

    Активный участник

  • Модератоpы
  • 5 372 сообщений

Отправлено 31 Январь 2014 - 14:50

Просмотр сообщенияалексколомна (31 Январь 2014 - 13:56) писал:

Добрый день. На данном этапе несколько вопросов. http://plitkanadom.storeland.ru
1. Подскажите, можно ли сделать увеличение фото категорий товаров при наведении курсора или по клику на избражение ( только отображение без дополнительной отдельной вкладки)  и добалять несколько фото для просмотра именно фото самой категории до входа в саму катрочку товара. Планируем магазин керамической плитки, на фото категории будет представлен возможный интреьер, а при входе в данную категорию будут уже представлены товары, из которых состоит данный интерьер Получается основное фото представлено в категории, а фото в карточке товаров уже не так информативно, сейчас как вариант просто в качесте товара добаляю фото интрьеров чтобы их можно было просмотреть при увеличении.
2. Можно ли вообще закрыть просмотр товаров в виде списка , оставив только в табличной форме.  По карточке товара убрать кнопку подробнее, т.е. никаких характеристик не будет, а это будет покупателей немного отвлекать,  а добавить возможность выводить на странице товара дополнительные характеристики- например размер, и т.д.
3. Убрать кнопку сортировки при просмотре карточки товаров.  Заранее спасибо за ответы.

1) Инструкция - http://forum.storela...__20#entry86532

3) Убрать сортировку можно в Настройках - Основных

#3 алексколомна

алексколомна

    Пользователь

  • Пользователи
  • PipPip
  • 20 сообщений

Отправлено 01 Февраль 2014 - 11:26

Спасибо за ответ. Но если честно, я спрашивал немного о другом.
1.Меня интересует увеличение изображения, которое прикреплено к категории товаров ( Например в плитке для ванны и стен, серзанит, релах - интересует возможность увеличения именно этой картинки, до входа в категорию товаров).
2. Сделал увеличение при наведении кртинки как Вы написали, в принципе, понравилось такая возможность, но есть вопрос- можно ли при просмотре табличного варианта как-то задавать расположение картинки относительно экрана монитора, а не относительно картинки ( самые левые картинки отображаются нормально, а если открывать самые правые то изображение съезжант за экран).
3.Можно ли сделать увеличение картинки простым кликом на фоне в карточке товаров, не заходя в карточку подробнее, где потом можно сделать увеличение картинки кликом ( т.е. анологично, но находясь в табличной форме товаров)
4. Так и не ответили- можно ли убрать просмотр списком и возможность входить в карточку товаров через кнопку подробнее.
Заранее благодарен.

#4 алексколомна

алексколомна

    Пользователь

  • Пользователи
  • PipPip
  • 20 сообщений

Отправлено 01 Февраль 2014 - 11:33

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

#5 алексколомна

алексколомна

    Пользователь

  • Пользователи
  • PipPip
  • 20 сообщений

Отправлено 05 Февраль 2014 - 08:41

Что-то никто не отвечает.  Мои фантазии вообще можно воплотить в жизнь????

#6 Castiel

Castiel

    Активный участник

  • Модераторы
  • 3 519 сообщений
  • ГородНижний Новгород

Отправлено 05 Февраль 2014 - 16:08

Просмотр сообщенияалексколомна (05 Февраль 2014 - 08:41) писал:

Что-то никто не отвечает.  Мои фантазии вообще можно воплотить в жизнь????

Увеличение изображения каталога при наведении
Редактируем шаблон Товары
Находим 40-42 строку
								  <div class="img txtalgncnt">
										<a href="{nested_categories_list.URL}" title="Перейти на страницу &amp;laquo;{nested_categories_list.NAME}&amp;raquo;"><img {% IF nested_categories_list.IMAGE_EMPTY %}src="{ASSETS_IMAGES_PATH}no-photo-small.png" width="130"{% ELSE %}src="{nested_categories_list.IMAGE_MEDIUM}"{% ENDIF %} alt="{nested_categories_list.NAME}" /></a>
								  </div>

Заменить на
<div class="img txtalgncnt">
										<div class="prd-image">
  <a href="{nested_categories_list.URL}" title="{nested_categories_list.NAME}"  class="product_img_link">
		<img class="product_image" src="{% IF nested_categories_list.IMAGE_EMPTY %}{ASSETS_IMAGES_PATH}no-photo-small.png{% ELSE %}{nested_categories_list.IMAGE_MEDIUM}{% ENDIF %}" alt="{nested_categories_list.NAME}" />
  </a>
<div class="goods_images_list">
  <div style="display: none;"><img src="{nested_categories_list.IMAGE_MEDIUM}" alt="{nested_categories_list.NAME}" /></div>
</div>
</div>
								  </div>

Редактируем main.css
Находим
.goods_images_list > div {
display: none;
position: absolute;
z-index: 100;
background: #FFFFFF;
border: 3px solid #CCCCCC;
border-radius: 4px;
left: -208px;
padding: 2px;
top: -35px;
max-height: 512px;
max-width: 750px;
}

Заменяем на
.goods_images_list > div {
display: none;
position: absolute;
z-index: 100;
background: #FFFFFF;
border: 3px solid #CCCCCC;
border-radius: 4px;
padding: 2px;
top: -15px;
max-height: 300px;
max-width: 400px;
}

4. Убираем товары списком.
Редактируем шаблон Товары
Находим 152 строку
  {% IF GOODS_VIEW_TYPE=1 %}
Заменяем на
  {% IF GOODS_VIEW_TYPE=2 %}

Если вы хотите полностью удалить вывод списком, то находим и удаляем
				<ul>
				  {% IF GOODS_VIEW_TYPE=1 %}
						<li><a href="?goods_view_type=2" class="table"></a></li>
						<li><a href="?goods_view_type=1" class="list current"></a></li>
				  {% ENDIF %}
				  {% IF GOODS_VIEW_TYPE=2 %}
						<li><a href="?goods_view_type=2" class="table current"></a></li>
						<li><a href="?goods_view_type=1" class="list"></a></li>
				  {% ENDIF %}
				</ul>

Удаляем
<!-- Вывод каталога списком -->
		{% FOR goods %}
		  <div class="hr"></div>
		  <div class="box padd">
				<div class="titlebox txtalgnlft">
				  <ul>
						<li class="blue fnt11b">
						  <h2><a href="{goods.URL}" title="Перейти на страницу &amp;laquo;{goods.NAME}&amp;raquo;">
						  {% IF goods.MAX_REST_VALUE=0 %}{% ENDIF %}
						  {% IF goods.MAX_REST_VALUE>0 %}{% ENDIF %}
						  </a></h2>
						</li>
						<li class="default fnt12b "><a href="{goods.URL}" title="Перейти на страницу &amp;laquo;{goods.NAME}&amp;raquo;">{goods.NAME}</a></li>
				  </ul>
				</div>
				<div class="ulproduct">
				  <div class="img txtalgncnt">
					   <div class="prd-image">
  <a href="{goods.URL | url_amp}" title="{goods.NAME}"  class="product_img_link">
		<img class="product_image" src="{% IF goods.IMAGE_EMPTY %}{ASSETS_IMAGES_PATH}no-photo-other.png{% ELSE %}{goods.IMAGE_OTHER}{% ENDIF %}" alt="{goods.NAME}" />
  </a>
<div class="goods_images_list">
{% FOR images %}
  <div style="display: none;"><img src="{goods.images.LARGE}" alt="{goods.images.NAME}" /></div>
{% ENDFOR %}
</div>
</div>
				  </div>
				  <div class="infoproduct">
						<div class="name fnt14b">
						  <a href="{goods.URL}" title="Перейти на страницу &amp;laquo;{goods.NAME}&amp;raquo;">{goods.NAME}</a>
						</div>
						<div class="info fnt11n txtalgnlft">
						  {goods.DESCRIPTION_SHORT}
						</div>
						<div class="buttons">
						  {% IF goods.MAX_REST_VALUE>0 %}
								<form action="{CART_ADD_GOODS_MODIFICATION_URL | url_amp}" method="post" id="goodsListFormId{goods.MIN_PRICE_NOW_ID}" class="goodsListForm">
								  <div>
										<input type="hidden" name="hash" value="{HASH}" />
										<input type="hidden" name="form[goods_from]" value="{goods.GOODS_FROM}" />
										<input type="hidden" name="form[goods_mod_id]" value="{goods.MIN_PRICE_NOW_ID}" />
										<a class="whtgray" onclick="$('#goodsListFormId{goods.MIN_PRICE_NOW_ID}').submit(); return false;" href="{CART_ADD_GOODS_MODIFICATION_URL | url_amp}?hash={HASH | url_amp}&amp;amp;form%5Bgoods_from%5D={goods.GOODS_FROM}&amp;amp;form%5Bgoods_mod_id%5D={goods.MIN_PRICE_NOW_ID}" title="Положить &amp;laquo;{goods.NAME}&amp;raquo; в корзину">Купить сейчас</a>
										<a href="{goods.URL}" class="whtgray" title="Подробнее о товаре &amp;laquo;{goods.NAME}&amp;raquo;">Подробнее</a>
								  </div>
								</form>
						  {% ENDIF %}
						  {% IF goods.MAX_REST_VALUE=0 %}<a href="{goods.URL}" class="whtgray" title="Подробнее о товаре &amp;laquo;{goods.NAME}&amp;raquo;">Подробнее</a>{% ENDIF %}
						</div>
						<div class="price fnt12b txtalgnlft">
						  Цена:
						  {% IF goods.MIN_PRICE_NOW_WITHOUT_DISCOUNT>goods.MIN_PRICE_NOW %}
								<span>{goods.MIN_PRICE_NOW_WITHOUT_DISCOUNT | number_format("0", ",", " ")}</span>
						  {% ELSEIF goods.MIN_PRICE_OLD>goods.MIN_PRICE_NOW %}
								<span>{goods.MIN_PRICE_OLD | number_format("0", ",", " ")}</span>
						  {% ENDIF %}
						  <em class="fnt12b">{goods.MIN_PRICE_NOW | money_format}</em>
						</div>
				  </div>
				  <div class="clear"></div>
				</div>
		  </div>
		{% ENDFOR goods %}
  <!-- Вывод каталога списком-Конец -->
  {% ELSE %}

Если вы хотите просто скрыть режим отображения то редактруем main.css
Находим
#content .cort .right {
float: right;
margin: 2px 0 0 0;
}

Заменяем на
#content .cort .right {
float: right;
margin: 2px 0 0 0;
display:none;
}


Сортировку можно скрыть, а в настройках выбрать один вид сортировки
Отключаем отображение сортировки
Редактируем main.css
Находим
#content .cort .left {
float: left;
color: #999;
}

Заменяем на
#content .cort .left {
float: left;
color: #999;
display:none;
}


Если какие то вопросы остались без ответа, напишите их еще раз.

#7 алексколомна

алексколомна

    Пользователь

  • Пользователи
  • PipPip
  • 20 сообщений

Отправлено 05 Февраль 2014 - 21:40

Спсибо за ответы. Завтра буду пробовать.

#8 алексколомна

алексколомна

    Пользователь

  • Пользователи
  • PipPip
  • 20 сообщений

Отправлено 06 Февраль 2014 - 10:34

Еще раз спасибо за ответы. По скрытию таблицы и сортировки все получилось, но остались некоторые вопросы.
1. По увеличению каталога.  Первый раз сделал, как вы написали- получилось сделать увеличение  фото  в корне каталога ( плитка для ванны, плитка для пола и т.д.) -увеличивалось нормально, но  единственное изображение получалось расплывчатым( сечас фото почему то маленькое).
НО- меня интересует возможность увеличения только последнего фото непосредственно перед переходов к товарам -  
в моем случае это фото в категории Церзанит - RELAX и Deep Blue( хочу увеличенный просмотр именно здесь), т.к. на фотографии отображаются  сочетания товаров, которые будут в карточке.  
И можно ли сделать увеличение кликом (чтоб изображение окрывалось на нейтральном фоне и по центру экрана по аналогии в таблице товаров, подробнее, увеличить изображение), а не наведением курсора.   И последнее - можно ли сделать возможность прикрепления нескольких фото интерьеров  к уже имеющимся  RELAX и Deep Blue.

#9 алексколомна

алексколомна

    Пользователь

  • Пользователи
  • PipPip
  • 20 сообщений

Отправлено 06 Февраль 2014 - 10:47

И пока не забыл - Можно ли сделать увеличение картинки товара в табличной форме простым кликом на фоне по аналогии  как при переходе через  подробнее( а кнопку подробнее вообще убрать, чтоб заказы делали только из таблицы). Сейчас увеличение по клику, но не нравиться что изображение смещается относительно расположения увеличиваемого фото.  Извиняюсь, если недостаточно корректно формулирую свои пожелания...

#10 Vaccina

Vaccina

    Активный участник

  • Модераторы
  • 24 353 сообщений

Отправлено 07 Февраль 2014 - 04:15

подобная тема уже обсуждалась у нас на форуме и имеет инструкции: http://forum.storela...ть-изображение/

#11 алексколомна

алексколомна

    Пользователь

  • Пользователи
  • PipPip
  • 20 сообщений

Отправлено 07 Февраль 2014 - 10:49

спасибо за ответ. Принцип увеличения как я и хотел, но у меня разошлись все карточки и пропали фото разделов товара (щас оставил как все получилось - plitkanadom.storeland).  видно код для шаблона пластик не очень... Буду признателен, если поможете все настроить. И я хотел наоборот, чтоб все было только из табличной формы.

#12 алексколомна

алексколомна

    Пользователь

  • Пользователи
  • PipPip
  • 20 сообщений

Отправлено 10 Февраль 2014 - 09:48

Почему все пропали, HELP!!!!!!

#13 Taisia

Taisia

    Активный участник

  • Модератоpы
  • 1 289 сообщений

Отправлено 12 Февраль 2014 - 18:28

Что бы перенести описание категории наверх, Вам нужно найти в файле ТОВАРЫ (вкладка Сайт-Редактор шаблонов) код

<!-- Вывод информации из категории католога -->
{% IF CATEGORY_DESCRIPTION %}
  <div class="headline">
	<div class="main">
	  <div class="text fnt12n htmlDataBlock">
		<!-- Описание категории -->
		{CATEGORY_DESCRIPTION}
	  </div>
	</div>
  </div>
{% ENDIF %}
<!-- Вывод информации из категории католога-Конец -->


и перенести его ПЕРЕД кодом

<!-- Товары -->
{% IF goods_empty %}
  <!-- Если не применено ни одного фильтра, значит в категории нет товаров -->


#14 алексколомна

алексколомна

    Пользователь

  • Пользователи
  • PipPip
  • 20 сообщений

Отправлено 12 Февраль 2014 - 18:39

Спасибо. Надеюсь на помощь и по остальным вопросам..

#15 Сake

Сake

    Активный участник

  • Модератоpы
  • 5 979 сообщений

Отправлено 13 Февраль 2014 - 00:59

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

#16 алексколомна

алексколомна

    Пользователь

  • Пользователи
  • PipPip
  • 20 сообщений

Отправлено 13 Февраль 2014 - 10:03

Какие вопросы остались.
1. По теме, которая уже обсуждалась  на форуме и имеет инструкции: http://forum.storela...ть-изображение . Принцип увеличения такой как нужен, но при использовании данных кодов все разошлось, пропали фото категории, пишет ошибку, таб. и список все сразу. Мне нужно увеличение картинки товара в табличной форме простым кликом- вывод списком у меня отключен. ( а кнопку подробнее вообще убрать, чтоб заказы делали только из таблицы, чтоб не было возможности к переходу карточки подробнее). Сейчас увеличение товаров происходит при наведении курсора, но не нравиться, что изображение смещается относительно расположения увеличиваемого фото и параметры изображения меняются (Картинки есть как вертикально ориентированные, так и горизонтальны- сильно искажается).  Извиняюсь, если недостаточно корректно формулирую свои пожелания... +
2. Возможно ли сделать увеличение кликом фото категорий товаров (Плитка для ванны, церзанит - пошли много фото коллекций производителя, что была возможность увеличения изображения при нажатии на картинку или лупу.
3. Хочу увеличить фото категории товаров ( Плитка для ванны, Церзанит - пошло много фото колллекции).Чтоб они были чуть крупнее. Размер фото 800X533. Через настройки делаю разрешение для изображения фото категорий товаров и 600, и 800 - но место по краям еще остается-  может максимальны размер картинки прописан еще где. Как их можно еще увеличить????
Буду признателен за помощь.

#17 Taisia

Taisia

    Активный участник

  • Модератоpы
  • 1 289 сообщений

Отправлено 13 Февраль 2014 - 10:26

Для того что бы добавлять изображения в описание категории при клике на которые будет появляться всплывающее окно вам нужно:

в файле main.js найти строку кода

// Сравнение товаров. Инвертирование свойств для сравнения товара

ПЕРЕД ней добавить код

$('.fancy').fancybox();


далее в описании категории добавить следующий блок

<a class="fancy" href="тут ссылка на большое изображение_1"><img  alt="iPhone" src="тут ссылка на маленькое изображение_1"> </a>
<a class="fancy" href="тут ссылка на большое изображение_2"><img  alt="iPhone" src="тут ссылка на маленькое изображение_2"> </a>





Количество пользователей, читающих эту тему: 0

0 пользователей, 0 гостей, 0 анонимных