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


Помоги Поставить Карусель

карусель

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

#1 vadim777

vadim777

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

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

Отправлено 07 Апрель 2014 - 01:44

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

#2 Vaccina

Vaccina

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

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

Отправлено 08 Апрель 2014 - 04:25

Подобный вопрос уже рассматривался у нас на форуме и имеет инструкции:
http://forum.storela...ресных-предлож/

#3 vadim777

vadim777

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

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

Отправлено 09 Апрель 2014 - 13:33

Просмотр сообщенияVaccina (08 Апрель 2014 - 04:25) писал:

Подобный вопрос уже рассматривался у нас на форуме и имеет инструкции:
http://forum.storela...ресных-предлож/

Только архив который вы предлагаете скачать, такой страницы нет. Если прикрепите нужный архив, то тогда конечно я бы сделал по инструкции. Спасибо

#4 MikDark

MikDark

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

  • Модераторы
  • 6 468 сообщений

Отправлено 09 Апрель 2014 - 13:57

Просмотр сообщенияvadim777 (09 Апрель 2014 - 13:33) писал:

Только архив который вы предлагаете скачать, такой страницы нет. Если прикрепите нужный архив, то тогда конечно я бы сделал по инструкции. Спасибо

Ссылка поменялась. Архив нужно скачать здесь . Далее файлы css и js загрузить на сайт. Как сделаете - напишите, скажем как установить.

#5 vadim777

vadim777

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

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

Отправлено 09 Апрель 2014 - 18:08

Просмотр сообщенияMikDark (09 Апрель 2014 - 13:57) писал:

Ссылка поменялась. Архив нужно скачать здесь . Далее файлы css и js загрузить на сайт. Как сделаете - напишите, скажем как установить.

загрузил файлы.

#6 MikDark

MikDark

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

  • Модераторы
  • 6 468 сообщений

Отправлено 09 Апрель 2014 - 18:33

Просмотр сообщенияvadim777 (09 Апрель 2014 - 18:08) писал:

загрузил файлы.

Интересные предложения Вам поставили.

#7 vadim777

vadim777

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

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

Отправлено 09 Апрель 2014 - 18:37

Просмотр сообщенияMikDark (09 Апрель 2014 - 18:33) писал:

Интересные предложения Вам поставили.
спасибо. только еще бы сделать, чтобы отображалось 3 товара?
и как поставить такую же карусель, для отображения Новинок и Хитов продаж?

Прикрепленные изображения

  • 1.jpg


#8 MikDark

MikDark

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

  • Модераторы
  • 6 468 сообщений

Отправлено 09 Апрель 2014 - 18:43

Просмотр сообщенияvadim777 (09 Апрель 2014 - 18:37) писал:

спасибо. только еще бы сделать, чтобы отображалось 3 товара?
и как поставить такую же карусель, для отображения Новинок и Хитов продаж?

Под слайдером места на 3 товара не хватает, только 2 убирается. У Вас пока нет товаров ни в новинках, ни в хитах.

#9 vadim777

vadim777

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

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

Отправлено 09 Апрель 2014 - 18:47

Просмотр сообщенияMikDark (09 Апрель 2014 - 18:43) писал:

Под слайдером места на 3 товара не хватает, только 2 убирается. У Вас пока нет товаров ни в новинках, ни в хитах.
в хиты добавил. а может другая карусель есть, или размер товаров как то уменьшить, чтоб 3 вмещалось, просто очень надо. 2 совсем не смотрится.

#10 MikDark

MikDark

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

  • Модераторы
  • 6 468 сообщений

Отправлено 09 Апрель 2014 - 18:57

Просмотр сообщенияvadim777 (09 Апрель 2014 - 18:47) писал:

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

Уменьшили товары и сделали 2-ю карусель.

#11 vadim777

vadim777

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

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

Отправлено 09 Апрель 2014 - 19:00

Просмотр сообщенияMikDark (09 Апрель 2014 - 18:57) писал:

Уменьшили товары и сделали 2-ю карусель.
огромнейшее спасибо. еще последняя просьба, сделать 4 товара, это последняя просьба)

#12 MikDark

MikDark

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

  • Модераторы
  • 6 468 сообщений

Отправлено 09 Апрель 2014 - 19:11

Просмотр сообщенияvadim777 (09 Апрель 2014 - 19:00) писал:

огромнейшее спасибо. еще последняя просьба, сделать 4 товара, это последняя просьба)

Готово :)

#13 vadim777

vadim777

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

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

Отправлено 09 Апрель 2014 - 19:19

Просмотр сообщенияMikDark (09 Апрель 2014 - 19:11) писал:

Готово :)
супер. большое спасибо )

Просмотр сообщенияMikDark (09 Апрель 2014 - 19:11) писал:

Готово :)
блин зашел в каталог товаров. и там теперь вот так отображается. 3 товара маленького размера, нельзя их увеличить или же сделать тоже 4.

Прикрепленные изображения

  • 1.jpg


#14 MikDark

MikDark

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

  • Модераторы
  • 6 468 сообщений

Отправлено 09 Апрель 2014 - 19:35

Просмотр сообщенияvadim777 (09 Апрель 2014 - 19:19) писал:

супер. большое спасибо )


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

Сделали по 4

#15 vadim777

vadim777

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

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

Отправлено 09 Апрель 2014 - 19:36

Уже нашел. спасибо

Просмотр сообщенияMikDark (09 Апрель 2014 - 19:35) писал:

Сделали по 4
теперь точно все ) спасибо

#16 tolikkansk

tolikkansk

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

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

Отправлено 09 Июль 2014 - 20:55

А можете пояснить установку(для трех картинок в каруселе)? И чем папка responsive отличается от simple в архиве, который надо скачать?

#17 Сake

Сake

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

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

Отправлено 10 Июль 2014 - 04:29

В директории responsive приведен пример реализации резиновой карусели, а в директории simple приведен пример обычной карусели. Для простого отображения 3х изображений карусели - используйте пример из директории simple.Количество отображаемых изображений в карусели регулируется путем задания ширины блока карусели. Для изменения ширины вам понадобится в файле стилей tinycarousel.css найти код

#slider1 .viewport { float: left; width: 240px; height: 125px; overflow: hidden; position: relative; }

и заменить его на

#slider1 .viewport { float: left; width: 760px; height: 125px; overflow: hidden; position: relative; }


#18 tolikkansk

tolikkansk

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

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

Отправлено 10 Июль 2014 - 07:18

http://forum.storela...ресных-предлож/
я пытался сделать для новинок, хитов продаж и товаров на главной, как написал staff, но ничего не выходит, у меня код немного другой на Пластике. можете подсказать? Файлы я уже загрузил. Аккаунт SL-298123

#19 Vaccina

Vaccina

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

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

Отправлено 11 Июль 2014 - 01:48

Делали, как понимаю, по 7ому сообщению:
http://forum.storela...лож/#entry32986

Загрузите все файлы, далее:
В шаблоне HTML

Цитата

После кода:
<!-- Скрипты магазина -->
<script type="text/javascript" src="{ASSETS_JS_PATH}main.js"></script>
Добавить:
<script type="text/javascript" src="{ASSETS_JS_PATH}jquery.jcarousel.js"></script>
<link rel="stylesheet" href="{ASSETS_STYLES_PATH}carousel.css" type="text/css" />

Для новинок находим:
{% IFNOT index_page_new_goods_empty %}
		 <div class="hr"></div>
		 <div class="box padd">
			 <div class="titlebox fnt11b txtalgnlft">
			 <ul>
				 <li class="blue fnt11b">
				 <h2><a href="{CATALOG_NEW_URL}">Новинки</a></h2>
				 </li>
			 </ul>
			 </div>
			 <table class="table" cellpadding="0 " cellspacing="0">
			 <tr>
				 {% FOR index_page_new_goods %}
				 <td>
					 <div class="tabproduct">
					 <div class="title fnt12b txtalgncnt">
						 <a href="{index_page_new_goods.URL}" title="Перейти на страницу &laquo;{index_page_new_goods.NAME}&raquo;">{index_page_new_goods.NAME}</a>
					 </div>
					 <div class="img txtalgncnt">
						 <a href="{index_page_new_goods.URL}" title="Перейти на страницу &laquo;{index_page_new_goods.NAME}&raquo;"><img src="{% IF index_page_new_goods.IMAGE_EMPTY %}{ASSETS_IMAGES_PATH}no-photo-other.png{% ELSE %}{index_page_new_goods.IMAGE_OTHER}{% ENDIF %}" alt="{index_page_new_goods.NAME}" /></a>
					 </div>
					 <div class="price fnt12b txtalgncnt">
						 Цена:
						 {% IF index_page_new_goods.MIN_PRICE_NOW_WITHOUT_DISCOUNT>index_page_new_goods.MIN_PRICE_NOW %}
						 <span>{index_page_new_goods.MIN_PRICE_NOW_WITHOUT_DISCOUNT | number_format("0", ",", " ")}</span>
						 {% ELSEIF index_page_new_goods.MIN_PRICE_OLD>index_page_new_goods.MIN_PRICE_NOW %}
						 <span>{index_page_new_goods.MIN_PRICE_OLD | number_format("0", ",", " ")}</span>
						 {% ENDIF %}
						 <em class="fnt12b">{index_page_new_goods.MIN_PRICE_NOW | money_format}</em>
					 </div>
					 <div class="buttons txtalgncnt">
						 {% IF index_page_new_goods.MAX_REST_VALUE>0 %}<a href="{index_page_new_goods.URL}" class="whtgreen" title="Перейти на страницу &laquo;{index_page_new_goods.NAME}&raquo;">Подробнее</a>
						 <form action="{CART_ADD_GOODS_MODIFICATION_URL | url_amp}" method="post" class="goodsListForm">
							 <div>
							 <input type="hidden" name="hash" value="{HASH}" />
							 <input type="hidden" name="form[goods_from]" value="{index_page_new_goods.GOODS_FROM}" />
							 <input type="hidden" name="form[goods_mod_id]" value="{index_page_new_goods.MIN_PRICE_NOW_ID}" />
							 <button type="submit"class="blgreen">Купить</button>
							 </div>
						 </form>
						 {% ENDIF %}
						 {% IF index_page_new_goods.MAX_REST_VALUE=0 %}
						 <a href="{index_page_new_goods.URL}" class="whtgreen" style="margin:0 0 0 70px;" title="Перейти на страницу &laquo;{index_page_new_goods.NAME}&raquo;">Подробнее</a>
						 {% ENDIF %}
					 </div>
					 </div>
				 </td>
				 {% IFNOT index_page_new_goods.last %}{index_page_new_goods.index | is_divided("2","</tr><tr>","")}{% ENDIF %}
				 {% ENDFOR index_page_new_goods %}
			 </tr>
			 </table>
		 </div>
		 {% ENDIF %}
заменяем на:
{% IFNOT index_page_new_goods_empty %}
<script type="text/javascript">
jQuery(document).ready(function() {
// Initialise the first and second carousel by class selector.
// Note that they use both the same configuration options (none in this case).
jQuery('.d-carousel .carousel').jcarousel({
		 scroll: 1
});
});
</script>

		 <div class="hr"></div>
		 <div class="box padd">
			 <div class="titlebox fnt11b txtalgnlft">
			 <ul>
				 <li class="blue fnt11b">
				 <h2><a href="{CATALOG_NEW_URL}">Новинки</a></h2>
				 </li>
			 </ul>
			 </div>
	
	 <div id="wrapper">
			 <div class="d-carousel">
			 <ul class="carousel">
				 {% FOR index_page_new_goods %}
				 <li>
					 <div class="tabproduct">
					 <div class="title fnt12b txtalgncnt">
						 <a href="{index_page_new_goods.URL}" title="Перейти на страницу &laquo;{index_page_new_goods.NAME}&raquo;">{index_page_new_goods.NAME}</a>
					 </div>
					 <div class="img txtalgncnt">
						 <a href="{index_page_new_goods.URL}" title="Перейти на страницу &laquo;{index_page_new_goods.NAME}&raquo;"><img src="{% IF index_page_new_goods.IMAGE_EMPTY %}{ASSETS_IMAGES_PATH}no-photo-other.png{% ELSE %}{index_page_new_goods.IMAGE_OTHER}{% ENDIF %}" alt="{index_page_new_goods.NAME}" /></a>
					 </div>
					 <div class="price fnt12b txtalgncnt">
						 Цена:
						 {% IF index_page_new_goods.MIN_PRICE_NOW_WITHOUT_DISCOUNT>index_page_new_goods.MIN_PRICE_NOW %}
						 <span>{index_page_new_goods.MIN_PRICE_NOW_WITHOUT_DISCOUNT | number_format("0", ",", " ")}</span>
						 {% ELSEIF index_page_new_goods.MIN_PRICE_OLD>index_page_new_goods.MIN_PRICE_NOW %}
						 <span>{index_page_new_goods.MIN_PRICE_OLD | number_format("0", ",", " ")}</span>
						 {% ENDIF %}
						 <em class="fnt12b">{index_page_new_goods.MIN_PRICE_NOW | money_format}</em>
					 </div>
					 <div class="buttons txtalgncnt">
						 {% IF index_page_new_goods.MAX_REST_VALUE>0 %}<a href="{index_page_new_goods.URL}" class="whtgreen" title="Перейти на страницу &laquo;{index_page_new_goods.NAME}&raquo;">Подробнее</a>
						 <form action="{CART_ADD_GOODS_MODIFICATION_URL | url_amp}" method="post" class="goodsListForm">
							 <div>
							 <input type="hidden" name="hash" value="{HASH}" />
							 <input type="hidden" name="form[goods_from]" value="{index_page_new_goods.GOODS_FROM}" />
							 <input type="hidden" name="form[goods_mod_id]" value="{index_page_new_goods.MIN_PRICE_NOW_ID}" />
							 <button type="submit"class="blgreen">Купить</button>
							 </div>
						 </form>
						 {% ENDIF %}
						 {% IF index_page_new_goods.MAX_REST_VALUE=0 %}
						 <a href="{index_page_new_goods.URL}" class="whtgreen" style="margin:0 0 0 70px;" title="Перейти на страницу &laquo;{index_page_new_goods.NAME}&raquo;">Подробнее</a>
						 {% ENDIF %}
					 </div>
					 </div>
				 </li>
				 {% ENDFOR index_page_new_goods %}
			 </ul>
	 </div>
<div class="clear"></div>
</div>
		 </div>
		 {% ENDIF %}

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

#20 tolikkansk

tolikkansk

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

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

Отправлено 11 Июль 2014 - 20:13

Сделал все, как вы написали для новинок, но в итоге ничего не изменилось и ещё выдает js ошибку.
Я загрузил файлы jquery.tinycarousel, jquery.tinycarousel.min, tinycarousel из папки simple архива tinycarousel-2.1.4 это же правильно? или нужно было другой архив скачивать?

Прикрепленные изображения

  • 178.jpg






Темы с аналогичным тегами карусель

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

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