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


Слайдер

Автор Ксения М, 23 окт. 2014 12:58
слайдер

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

#1 Ксения М

Ксения М

    Продвинутый пользователь

  • Пользователи
  • PipPipPip
  • 102 сообщений
  • ГородСанкт-Петербург

Отправлено 23 Октябрь 2014 - 12:58

Добрый день!
Хочу подключить слайдер на главной.

в html вижу уже прописанный код для слайдера, предустановленного скрипта в шаблоне вроде нет. Соответственно, вот эту инструкцию http://storeland.ru/about/faq#51 уже нужно соблюдать не полностью?

#2 MikDark

MikDark

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

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

Отправлено 23 Октябрь 2014 - 13:15

Просмотр сообщенияКсения М. (23 Октябрь 2014 - 12:58) писал:

Добрый день!
Хочу подключить слайдер на главной.

в html вижу уже прописанный код для слайдера, предустановленного скрипта в шаблоне вроде нет. Соответственно, вот эту инструкцию http://storeland.ru/about/faq#51 уже нужно соблюдать не полностью?

Да, код:
  <!-- Загрузка Jquery галереии Nyvo Slider -->
  <link rel="stylesheet" href="{ASSETS_STYLES_PATH}nyvo.css" type="text/css" media="screen" />
  <script type="text/javascript" src="{ASSETS_JS_PATH}jquery.nivo.slider.pack.js"></script>

можно не добавлять

#3 Ксения М

Ксения М

    Продвинутый пользователь

  • Пользователи
  • PipPipPip
  • 102 сообщений
  • ГородСанкт-Петербург

Отправлено 23 Октябрь 2014 - 13:43

такого как раз там нет, но есть такое:
					<!-- Слайдер на главной странице сайта -->
					<!--
					{% IF index_page %}
						<div id="owl-one-slider" class="owl-carousel owl-theme">
							<div class="item">
								<a href="#" target="_blank">
									<img src="{ASSETS_IMAGES_PATH}11.png?design=snow" alt="Описание слайда">
								</a>
							</div>
							<div class="item" style="display:none">
								<a href="#" target="_blank">
									<img src="{ASSETS_IMAGES_PATH}22.png?design=snow" alt="Описание слайда">
								</a>
							</div>
							<div class="item" style="display:none">
								<a href="#" target="_blank">
									<img src="{ASSETS_IMAGES_PATH}33.png?design=snow" alt="Описание слайда">
								</a>
							</div>
							<div class="item" style="display:none">
								<a href="#" target="_blank">
									<img src="{ASSETS_IMAGES_PATH}44.png?design=snow" alt="Описание слайда">
								</a>
							</div>
						</div>
						<script type="text/javascript">
						  $(document).ready(function() {
							$("#owl-one-slider .item").css('display', 'block');
							$("#owl-one-slider").owlCarousel({
							  navigation : true, // показывать кнопки next и prev
							  slideSpeed : 300,
							  paginationSpeed : 400,
							  items : 1,
							  itemsDesktop : false,
							  itemsDesktopSmall : false,
							  itemsTablet: false,
							  itemsMobile : false,
							  navigationText: false // Удаляет текст с кнопок навигации
							});
						  });
						</script>
						<style type="text/css">
						</style>
					{% ENDIF %}
					-->
					<!-- END Слайдер на главной странице сайта --->

я предположила, что это вместо вот этого из инструкции:
<!-- Nyvo слайдер который отображается на главной -->
{% IF index_page %}
<!-- Обёртка, указывающая стиль темы -->
<div class="theme-default" style="padding: 1em; display: none;">
<!-- Непосредственный код слайдера -->
<div id="slider">
<img src="http://storeland.ru/img/faq/questions/nyvo_slider/slider.jpg" alt="" />
<a href="/"><img src="/img/faq/questions/nyvo_slider/nemo.jpg" alt="" /></a>
<img title="Пример картинки с заголовком" src="http://storeland.ru/img/faq/questions/nyvo_slider/toystory.jpg" alt="" />
<img src="http://storeland.ru/img/faq/questions/nyvo_slider/walle.jpg" alt="" />
<img src="http://storeland.ru/img/faq/questions/nyvo_slider/cars.jpg" alt="" />
</div>
</div>
<!-- Запуск слайдера -->
<script type="text/javascript">
$(window).load(function() {
$('#slider').nivoSlider().parent().show(); });
</script>
{% ENDIF %}

не так?

#4 batta

batta

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

  • Пользователи
  • PipPipPipPip
  • 1 142 сообщений
  • ГородНижний Новгород

Отправлено 23 Октябрь 2014 - 15:10

Просмотр сообщенияКсения М. (23 Октябрь 2014 - 13:43) писал:

такого как раз там нет, но есть такое:
				 <!-- Слайдер на главной странице сайта -->
				 <!--
				 {% IF index_page %}
					 <div id="owl-one-slider" class="owl-carousel owl-theme">
						 <div class="item">
							 <a href="#" target="_blank">
								 <img src="{ASSETS_IMAGES_PATH}11.png?design=snow" alt="Описание слайда">
							 </a>
						 </div>
						 <div class="item" style="display:none">
							 <a href="#" target="_blank">
								 <img src="{ASSETS_IMAGES_PATH}22.png?design=snow" alt="Описание слайда">
							 </a>
						 </div>
						 <div class="item" style="display:none">
							 <a href="#" target="_blank">
								 <img src="{ASSETS_IMAGES_PATH}33.png?design=snow" alt="Описание слайда">
							 </a>
						 </div>
						 <div class="item" style="display:none">
							 <a href="#" target="_blank">
								 <img src="{ASSETS_IMAGES_PATH}44.png?design=snow" alt="Описание слайда">
							 </a>
						 </div>
					 </div>
					 <script type="text/javascript">
						 $(document).ready(function() {
						 $("#owl-one-slider .item").css('display', 'block');
						 $("#owl-one-slider").owlCarousel({
							 navigation : true, // показывать кнопки next и prev
							 slideSpeed : 300,
							 paginationSpeed : 400,
							 items : 1,
							 itemsDesktop : false,
							 itemsDesktopSmall : false,
							 itemsTablet: false,
							 itemsMobile : false,
							 navigationText: false // Удаляет текст с кнопок навигации
						 });
						 });
					 </script>
					 <style type="text/css">
					 </style>
				 {% ENDIF %}
				 -->
				 <!-- END Слайдер на главной странице сайта --->

я предположила, что это вместо вот этого из инструкции:
<!-- Nyvo слайдер который отображается на главной -->
{% IF index_page %}
<!-- Обёртка, указывающая стиль темы -->
<div class="theme-default" style="padding: 1em; display: none;">
<!-- Непосредственный код слайдера -->
<div id="slider">
<img src="http://storeland.ru/img/faq/questions/nyvo_slider/slider.jpg" alt="" />
<a href="/"><img src="/img/faq/questions/nyvo_slider/nemo.jpg" alt="" /></a>
<img title="Пример картинки с заголовком" src="http://storeland.ru/img/faq/questions/nyvo_slider/toystory.jpg" alt="" />
<img src="http://storeland.ru/img/faq/questions/nyvo_slider/walle.jpg" alt="" />
<img src="http://storeland.ru/img/faq/questions/nyvo_slider/cars.jpg" alt="" />
</div>
</div>
<!-- Запуск слайдера -->
<script type="text/javascript">
$(window).load(function() {
$('#slider').nivoSlider().parent().show(); });
</script>
{% ENDIF %}

не так?
Здравствуйте.
Код 
<!-- Загрузка Jquery галереи Nyvo Slider -->
<link rel="stylesheet" href="{ASSETS_STYLES_PATH}nyvo.css" type="text/css" media="screen" />
<script type="text/javascript" src="{ASSETS_JS_PATH}jquery.nivo.slider.pack.js"></script>
находиться на в 9 пункте инструкций, все остальные действия в инструкции нужны.

#5 Ксения М

Ксения М

    Продвинутый пользователь

  • Пользователи
  • PipPipPip
  • 102 сообщений
  • ГородСанкт-Петербург

Отправлено 23 Октябрь 2014 - 16:04

я имела в виду, что этого кода нет изначально в html.

сделала все по инструкции, кроме п.9, слайдера нет, зато есть JS ошибка:
На странице возникла JS ошибка:
TypeError: $(...).nivoSlider is not a function на строке: 216.

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

вот этот был изначально:
				<div class="sectionblock-inner-content">
					<!-- Слайдер на главной странице сайта -->
					<!--
					{% IF index_page %}
						<div id="owl-one-slider" class="owl-carousel owl-theme">
							<div class="item">
								<a href="#" target="_blank">
									<img src="{ASSETS_IMAGES_PATH}11.png?design=snow" alt="Описание слайда">
								</a>
							</div>
							<div class="item" style="display:none">
								<a href="#" target="_blank">
									<img src="{ASSETS_IMAGES_PATH}22.png?design=snow" alt="Описание слайда">
								</a>
							</div>
							<div class="item" style="display:none">
								<a href="#" target="_blank">
									<img src="{ASSETS_IMAGES_PATH}33.png?design=snow" alt="Описание слайда">
								</a>
							</div>
							<div class="item" style="display:none">
								<a href="#" target="_blank">
									<img src="{ASSETS_IMAGES_PATH}44.png?design=snow" alt="Описание слайда">
								</a>
							</div>
						</div>
						<script type="text/javascript">
						  $(document).ready(function() {
							$("#owl-one-slider .item").css('display', 'block');
							$("#owl-one-slider").owlCarousel({
							  navigation : true, // показывать кнопки next и prev
							  slideSpeed : 300,
							  paginationSpeed : 400,
							  items : 1,
							  itemsDesktop : false,
							  itemsDesktopSmall : false,
							  itemsTablet: false,
							  itemsMobile : false,
							  navigationText: false // Удаляет текст с кнопок навигации
							});
						  });
						</script>
						<style type="text/css">
						</style>
					{% ENDIF %}
					-->
					<!-- END Слайдер на главной странице сайта --->

и вот этот приписала я по инструкции:
					<!-- Nyvo слайдер, который отображается на главной --->
				   
{% IF index_page %}
<!-- Обёртка, указывающая стиль темы -->
<div class="theme-default" style="padding: 1em; display: none;">
<!-- Непосредственный код слайдера -->
<div id="slider">
<img src="http://st.storeland.net/8/1408/942/4.jpg" alt="" />
<img src="http://st.storeland.net/8/1408/941/1.jpg" alt="" />
</div>
</div>
<!-- Запуск слайдера -->
<script type="text/javascript">
$(window).load(function() {
$('#slider').nivoSlider().parent().show(); });
</script>
{% ENDIF %}
					<!-- END Nyvo слайдер, который отображается на главной --->

SL-310197

#6 Ирина345

Ирина345

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

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

Отправлено 24 Октябрь 2014 - 19:26

Просмотр сообщенияКсения М. (23 Октябрь 2014 - 16:04) писал:

я имела в виду, что этого кода нет изначально в html.

сделала все по инструкции, кроме п.9, слайдера нет, зато есть JS ошибка:
На странице возникла JS ошибка:
TypeError: $(...).nivoSlider is not a function на строке: 216.

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

вот этот был изначально:
			 <div class="sectionblock-inner-content">
				 <!-- Слайдер на главной странице сайта -->
				 <!--
				 {% IF index_page %}
					 <div id="owl-one-slider" class="owl-carousel owl-theme">
						 <div class="item">
							 <a href="#" target="_blank">
								 <img src="{ASSETS_IMAGES_PATH}11.png?design=snow" alt="Описание слайда">
							 </a>
						 </div>
						 <div class="item" style="display:none">
							 <a href="#" target="_blank">
								 <img src="{ASSETS_IMAGES_PATH}22.png?design=snow" alt="Описание слайда">
							 </a>
						 </div>
						 <div class="item" style="display:none">
							 <a href="#" target="_blank">
								 <img src="{ASSETS_IMAGES_PATH}33.png?design=snow" alt="Описание слайда">
							 </a>
						 </div>
						 <div class="item" style="display:none">
							 <a href="#" target="_blank">
								 <img src="{ASSETS_IMAGES_PATH}44.png?design=snow" alt="Описание слайда">
							 </a>
						 </div>
					 </div>
					 <script type="text/javascript">
						 $(document).ready(function() {
						 $("#owl-one-slider .item").css('display', 'block');
						 $("#owl-one-slider").owlCarousel({
							 navigation : true, // показывать кнопки next и prev
							 slideSpeed : 300,
							 paginationSpeed : 400,
							 items : 1,
							 itemsDesktop : false,
							 itemsDesktopSmall : false,
							 itemsTablet: false,
							 itemsMobile : false,
							 navigationText: false // Удаляет текст с кнопок навигации
						 });
						 });
					 </script>
					 <style type="text/css">
					 </style>
				 {% ENDIF %}
				 -->
				 <!-- END Слайдер на главной странице сайта --->

и вот этот приписала я по инструкции:
				 <!-- Nyvo слайдер, который отображается на главной --->
				
{% IF index_page %}
<!-- Обёртка, указывающая стиль темы -->
<div class="theme-default" style="padding: 1em; display: none;">
<!-- Непосредственный код слайдера -->
<div id="slider">
<img src="http://st.storeland.net/8/1408/942/4.jpg" alt="" />
<img src="http://st.storeland.net/8/1408/941/1.jpg" alt="" />
</div>
</div>
<!-- Запуск слайдера -->
<script type="text/javascript">
$(window).load(function() {
$('#slider').nivoSlider().parent().show(); });
</script>
{% ENDIF %}
				 <!-- END Nyvo слайдер, который отображается на главной --->

SL-310197
Здравствуйте, проверьте все ли Вы выполнили пункты
вставьте код из пункта 9 в HTML перед строкой
</head>

#7 Ксения М

Ксения М

    Продвинутый пользователь

  • Пользователи
  • PipPipPip
  • 102 сообщений
  • ГородСанкт-Петербург

Отправлено 28 Октябрь 2014 - 17:04

вставила, все перепроверила
слайдера нет, есть миллион ошибок (

#8 Vaccina

Vaccina

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

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

Отправлено 29 Октябрь 2014 - 04:45

отмените все изменения по слайдеру, достаточно стандартный код в шаблоне HTML раскомментировать, то есть находим:
<!-- Слайдер на главной странице сайта -->
					<!--
					{% IF index_page %}
						<div id="owl-one-slider" class="owl-carousel owl-theme">
							<div class="item">
								<a href="#" target="_blank">
									<img src="{ASSETS_IMAGES_PATH}11.png?design=snow" alt="Описание слайда">
								</a>
							</div>
							<div class="item" style="display:none">
								<a href="#" target="_blank">
									<img src="{ASSETS_IMAGES_PATH}22.png?design=snow" alt="Описание слайда">
								</a>
							</div>
							<div class="item" style="display:none">
								<a href="#" target="_blank">
									<img src="{ASSETS_IMAGES_PATH}33.png?design=snow" alt="Описание слайда">
								</a>
							</div>
							<div class="item" style="display:none">
								<a href="#" target="_blank">
									<img src="{ASSETS_IMAGES_PATH}44.png?design=snow" alt="Описание слайда">
								</a>
							</div>
						</div>
						<script type="text/javascript">
						  $(document).ready(function() {
							$("#owl-one-slider .item").css('display', 'block');
							$("#owl-one-slider").owlCarousel({
							  navigation : true, // показывать кнопки next и prev
							  slideSpeed : 300,
							  paginationSpeed : 400,
							  items : 1,
							  itemsDesktop : false,
							  itemsDesktopSmall : false,
							  itemsTablet: false,
							  itemsMobile : false,
							  navigationText: false // Удаляет текст с кнопок навигации
							});
						  });
						</script>
						<style type="text/css">
						</style>
					{% ENDIF %}
					-->
					<!-- END Слайдер на главной странице сайта --->
меняем на:
<!-- Слайдер на главной странице сайта -->
					{% IF index_page %}
						<div id="owl-one-slider" class="owl-carousel owl-theme">
							<div class="item">
								<a href="#" target="_blank">
									<img src="{ASSETS_IMAGES_PATH}11.png?design=snow" alt="Описание слайда">
								</a>
							</div>
							<div class="item" style="display:none">
								<a href="#" target="_blank">
									<img src="{ASSETS_IMAGES_PATH}22.png?design=snow" alt="Описание слайда">
								</a>
							</div>
							<div class="item" style="display:none">
								<a href="#" target="_blank">
									<img src="{ASSETS_IMAGES_PATH}33.png?design=snow" alt="Описание слайда">
								</a>
							</div>
							<div class="item" style="display:none">
								<a href="#" target="_blank">
									<img src="{ASSETS_IMAGES_PATH}44.png?design=snow" alt="Описание слайда">
								</a>
							</div>
						</div>
						<script type="text/javascript">
						  $(document).ready(function() {
							$("#owl-one-slider .item").css('display', 'block');
							$("#owl-one-slider").owlCarousel({
							  navigation : true, // показывать кнопки next и prev
							  slideSpeed : 300,
							  paginationSpeed : 400,
							  items : 1,
							  itemsDesktop : false,
							  itemsDesktopSmall : false,
							  itemsTablet: false,
							  itemsMobile : false,
							  navigationText: false // Удаляет текст с кнопок навигации
							});
						  });
						</script>
						<style type="text/css">
						</style>
					{% ENDIF %}
					<!-- END Слайдер на главной странице сайта --->
далее в редактор шаблонов загружаем картинки с названием:
11.png
22.png
33.png
44.png

#9 Ксения М

Ксения М

    Продвинутый пользователь

  • Пользователи
  • PipPipPip
  • 102 сообщений
  • ГородСанкт-Петербург

Отправлено 29 Октябрь 2014 - 13:44

Vaccina, огромное спасибо, вы всегда помогаете! ))) :rolleyes: :lol:

#10 tolikkansk

tolikkansk

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

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

Отправлено 13 Ноябрь 2014 - 17:57

Все равно не то, чего бы я хотел, почему нельзя поставить Nyvo????

#11 AnnaM

AnnaM

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

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

Отправлено 13 Ноябрь 2014 - 18:52

Просмотр сообщенияtolikkansk (13 Ноябрь 2014 - 17:57) писал:

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

#12 tolikkansk

tolikkansk

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

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

Отправлено 13 Ноябрь 2014 - 19:13

по вашему я этим не пользовался, почему на данной теме он отказывается работать??? Аккаунт Sl319026

Просмотр сообщенияAnnaM (13 Ноябрь 2014 - 18:52) писал:

Вот тут подробно описана установка данного слайдера.
по вашему я этим не пользовался, почему на данной теме он отказывается работать??? Аккаунт Sl319026

#13 Vaccina

Vaccina

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

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

Отправлено 15 Ноябрь 2014 - 04:02

Уточните пожалуйста, почему именно Nyvo? Просто функция слайдеров одинаково, а остальное дорабатывается, чего вам не хватает в родном слайдере?

#14 r2fx

r2fx

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

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

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

Просмотр сообщенияVaccina (29 Октябрь 2014 - 04:45) писал:

далее в редактор шаблонов загружаем картинки с названием:

Здравствуйте, а не подскажите как добавить ссылку, к каждой картинке слайдера?

#15 RayLi

RayLi

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

  • Модераторы
  • 2 864 сообщений

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

Просмотр сообщенияr2fx (26 Февраль 2015 - 13:12) писал:

Здравствуйте, а не подскажите как добавить ссылку, к каждой картинке слайдера?
Здравствуйте.
Вы хотите, чтобы в слайдере были картинки со сторонних ресурсов, я вас правильно понял?
Ссылки картинок для слайдера со стороннего ресурса так же идёт, как ссылка на картинку с вашего сайта.

#16 r2fx

r2fx

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

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

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

Просмотр сообщенияRayLi (26 Февраль 2015 - 13:52) писал:

Здравствуйте.
Вы хотите, чтобы в слайдере были картинки со сторонних ресурсов, я вас правильно понял?
Ссылки картинок для слайдера со стороннего ресурса так же идёт, как ссылка на картинку с вашего сайта.
Здравствуйте!

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

#17 Danil

Danil

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

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

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

Просмотр сообщенияr2fx (26 Февраль 2015 - 13:55) писал:

Здравствуйте!

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

#18 r2fx

r2fx

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

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

Отправлено 26 Февраль 2015 - 14:06

Просмотр сообщенияDanil (26 Февраль 2015 - 13:58) писал:

Пришлите номер аккаунта.
sl-40068

#19 RayLi

RayLi

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

  • Модераторы
  • 2 864 сообщений

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

Просмотр сообщенияr2fx (26 Февраль 2015 - 14:06) писал:

sl-40068
В шаблоне html найдите код:
<!-- Слайдер на главной странице сайта -->
										{% IF index_page %}
												<div id="owl-one-slider" class="owl-carousel owl-theme">
														<div class="item">
																<a href="#" target="_blank">
																		<img src="{ASSETS_IMAGES_PATH}11.png?design=snow" alt="Описание слайда">
																</a>
														</div>
														<div class="item" style="display:none">
																<a href="#" target=http://obmen-oborudovaniya.stv74.ru/>
																		<img src="{ASSETS_IMAGES_PATH}22.png?design=snow" alt="Описание слайда">
																</a>
														</div>
														<div class="item" style="display:none">
																<a href="#" target="_blank">
																		<img src="{ASSETS_IMAGES_PATH}33.png?design=snow" alt="Описание слайда">
																</a>
														</div>
														<div class="item" style="display:none">
																<a href="#" target="_blank">
																		<img src="{ASSETS_IMAGES_PATH}44.png?design=snow" alt="Описание слайда">
																</a>
														</div>
												</div>
И найдите в этом коде строки: <a href="#" target="_blank"> , где заместо # вы можете вставить нужную вам ссылку.

#20 r2fx

r2fx

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

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

Отправлено 26 Февраль 2015 - 14:18

Просмотр сообщенияRayLi (26 Февраль 2015 - 14:13) писал:

И найдите в этом коде строки: <a href="#" target="_blank"> , где заместо # вы можете вставить нужную вам ссылку.

Спасибо, получилось, а я после  target= ставил неуч)))
Обратно в Главная



Темы с аналогичным тегами слайдер

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

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

  1. Форум владельцев интернет-магазинов
  2. → Вопросы работы сервиса StoreLand
  3. → Дизайн
  4. → Шаблон Снег
  5. → Главная
  6. Privacy Policy