Сообщений в теме: 140

[evgeni449]

Помогите со слайдером nivo-slider
все получилось в целом,только вот у меня появился слайдер но без кнопок!
1.как установить правильно тему default на слайдер nivo-slider?(я сделал так залил стили (css) темы в разделе редактора тем - блок файлы и туда же 3 картинки кнопок и потом в этом стили изменил пути на свои к этим 3 картинкм-кнапкам.и прописал путь в html <link rel="stylesheet" href="...." type="text/css" media="screen" />(делал по разному ну так и не получилось установить тему)
2.как мне поместить слайдер на главную и после него с низу что бы шели товаровы (а то у меня слайдер ложится на товары с верху)
3.что за цифры 1.2 сверху на слайде?как я понял это страницы?
http://s60477.storeland.ru/
буду благодарен за ваш ответ!

[Vaccina]

Цитата

1.как установить правильно тему default на слайдер nivo-slider?(я сделал так залил стили (css) темы в разделе редактора тем - блок файлы и туда же 3 картинки кнопок и потом в этом стили изменил пути на свои к этим 3 картинкм-кнапкам.и прописал путь в html <link rel="stylesheet" href="...." type="text/css" media="screen" />(делал по разному ну так и не получилось установить тему)
3.что за цифры 1.2 сверху на слайде?как я понял это страницы?

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

Цитата

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

Код HTML слайдера вам необходимо вставлять в шаблон "Страница" например перед блоком

<!-- Контент страницы -->
  <div class="htmlDataBlock">
	{PAGE_CONTENT}
  </div>

[evgeni449]

поставил слайдер,вопрос остался..посмотрите http://ecoplus24.ru/

[Vaccina]

У вас по какой-то причине не установлены все стили.
Используйте следующие стили для файла nivo-slider.css
Соответственно вам необходимо изменить пути к изображениям

/* The Nivo Slider styles */
.nivoSlider {
  position:relative;
  margin-left:10px;
}
.nivoSlider img {
  position:absolute;
  top:0px;
  left:0px;
}
/* If an image is wrapped in a link */
.nivoSlider a.nivo-imageLink {
  position:absolute;
  top:0px;
  left:0px;
  width:100%;
  height:100%;
  border:0;
  padding:0;
  margin:0;
  z-index:6;
  display:none;
}
/* The slices and boxes in the Slider */
.nivo-slice {
  display:block;
  position:absolute;
  z-index:5;
  height:100%;
}
.nivo-box {
  display:block;
  position:absolute;
  z-index:5;
}
/* Caption styles */
.nivo-caption {
  position:absolute;
  left:0px;
  bottom:0px;
  background:#000;
  color:#fff;
  opacity:0.8; /* Overridden by captionOpacity setting */
  width:100%;
  z-index:8;
}
.nivo-caption p {
  padding:5px;
  margin:0;
}
.nivo-caption a {
  display:inline !important;
}
.nivo-html-caption {
	display:none;
}
/* Direction nav styles (e.g. Next & Prev) */
.nivo-directionNav a {
  position:absolute;
  top:45%;
  z-index:9;
  cursor:pointer;
}
.nivo-prevNav {
  left:0px;
}
.nivo-nextNav {
  right:0px;
}
/* Control nav styles (e.g. 1,2,3...) */
.nivo-controlNav a {
  position:relative;
  z-index:9;
  cursor:pointer;
}
.nivo-controlNav a.active {
  font-weight:bold;
}
.nivoSlider {
  position:relative;
	width:618px;
	height:246px;
  background:#efe9d1 url(loading.gif) no-repeat 50% 50%;
	margin-bottom:80px;
	-moz-box-shadow:0px 0px 5px #333;
  -webkit-box-shadow:0px 0px 5px #333;
  box-shadow:0px 0px 5px #333;
}
.nivoSlider img {
  position:absolute;
  top:0px;
  left:0px;
  display:none;
}
.nivoSlider a {
  border:0;
  display:block;
}
.nivo-directionNav a {
  display:block;
  width:30px;
  height:30px;
  background:url(arrows.png) no-repeat;
  text-indent:-9999px;
  border:0;
}
a.nivo-nextNav {
  background-position:-30px 0;
  right:15px;
}
a.nivo-prevNav {
  left:15px;
}
.nivo-caption {
	text-shadow:none;
	font-family: Helvetica, Arial, sans-serif;
}
.nivo-caption a { 
	color:#efe9d1;
	text-decoration:underline;
}
#slider1 .nivo-controlNav,
#slider2 .nivo-controlNav,
#slider4 .nivo-controlNav {
  position:absolute;
  left:260px;
  bottom:-42px;
}
#slider1 .nivo-controlNav a,
#slider2 .nivo-controlNav a,
#slider4 .nivo-controlNav a {
  display:block;
  width:22px;
  height:22px;
  background:url(bullets.png) no-repeat;
  text-indent:-9999px;
  border:0;
  margin-right:3px;
  float:left;
}
#slider1 .nivo-controlNav a.active,
#slider2 .nivo-controlNav a.active,
#slider4 .nivo-controlNav a.active {
  background-position:0 -22px;
}
#slider2 a {
  display:block; /* IE Fix */
}
#slider3 {
  margin-bottom:110px;
}
#slider3 .nivo-controlNav {
  position:absolute;
  left:185px;
  bottom:-70px;
}
#slider3 .nivo-controlNav a {
	display:inline;
}
#slider3 .nivo-controlNav img {
  display:inline;
  position:relative;
  margin-right:10px;
  -moz-box-shadow:0px 0px 5px #333;
  -webkit-box-shadow:0px 0px 5px #333;
  box-shadow:0px 0px 5px #333;
}
#slider3 .nivo-controlNav a.active img {
	border:1px solid #000;
}
#slider 4 {
	margin-bottom:0;
}
.withborders-table td{
	border:1px #E5E5E5 solid;
	padding: 4px 0px;
}
#slidercontent {  margin:0 auto;  width:230px; height:440px;  clear:both;  padding-top:35px; padding-bottom:50px; margin:0 0 0 15px;  }
#slider { width:230px; height:440px;}
#slider ul li {  width:230px; height:450px; }
#slider ul li a { display:inline-block; }
#prevBtn a {display:block;width:190px; height:31px;background:url(prev.gif) center center no-repeat;text-indent:-99999px;float:left; margin:-485px 0 0 0;}
#nextBtn a {display:block;width:190px; height:31px;background:url(next.gif) center center no-repeat;text-indent:-99999px; float:right; margin:0 38px 0 0px;}

[evgeni449]

делаю так:
1.заливаю все скрипты,css-от слайдера и картинки от темы слайдера в редактор тем.
2.HTML>
<!-- Скрипты магазина -->
  <script type="text/javascript" src="{ASSETS_JS_PATH}main.js"></script>
  <link rel="stylesheet" href="{ASSETS_STYLES_PATH}nivo-slider.css" type="text/css" media="screen" />
  <script src="{ASSETS_JS_PATH}jquery.nivo.slider.pack.js" type="text/javascript"> </script>
3.страница>
<!-- СЛАЙДЕР НА ГЛАВНОЙ -->
{%IF index_page %}
    <div id="slider">  
    <img src="http://files.storela...02463/nemo.jpg" alt="" />
    <a href="http://files.storela...2462/walle.jpg" alt="" /> </ a>
    <img src="http://files.storela...8/toystory.jpg" alt="" title="This is an example of a caption" />
    <img src="http://files.storela.../101179/up.jpg" alt="" />
    </div>
{%ENDIF%}
<!-- СЛАЙДЕР НА ГЛАВНОЙ -->
соответственно залив при этом 4 картинки в файлы.
4.после чего заменил всё в файле nivo-slider.css на ваше выше указанное ,стрелки темы появились но с низу слайдера не отображается bullets(то есть кнопки смены картинки).
5.Что за 1.2 сверху в углу слайдера? Слайдер почему то работает не стабильно,и не отображаются все 4 картинки как нужно.
нужна ваша помощь!
что я не так делаю?

[Vaccina]

Попробуйте код

<!-- СЛАЙДЕР НА ГЛАВНОЙ -->
{%IF index_page %}
<div id="slider">
<img src="http://files.storeland.ru/web/upload/sitefiles/2/103/102463/nemo.jpg" alt="" />
<a href="http://files.storeland.ru/web/upload/sitefiles/2/103/102462/walle.jpg" alt="" /> </ a>
<img src="http://files.storeland.ru/web/upload/sitefiles/2/102/101178/toystory.jpg" alt="" title="This is an example of a caption" />
<img src="http://files.storeland.ru/web/upload/sitefiles/2/102/101179/up.jpg" alt="" />
</div>
{%ENDIF%}
<!-- СЛАЙДЕР НА ГЛАВНОЙ -->

заменить на

<!-- СЛАЙДЕР НА ГЛАВНОЙ -->
{%IF index_page %}
<div id="slider1" class="nivoSlider">
<a href="http://files.storeland.ru/web/upload/sitefiles/2/103/102462/walle.jpg" alt="" /><img src="http://files.storeland.ru/web/upload/sitefiles/2/103/102463/nemo.jpg" alt="" /></ a>
<a href="http://files.storeland.ru/web/upload/sitefiles/2/103/102462/walle.jpg" alt="" /><img src="http://files.storeland.ru/web/upload/sitefiles/2/102/101178/toystory.jpg" alt="" title="This is an example of a caption" /></ a>
<a href="http://files.storeland.ru/web/upload/sitefiles/2/103/102462/walle.jpg" alt="" /><img src="http://files.storeland.ru/web/upload/sitefiles/2/102/101179/up.jpg" alt="" /></ a>
</div>
{%ENDIF%}
<!-- СЛАЙДЕР НА ГЛАВНОЙ -->

[evgeni449]

после замена кода уменьшился слайдер до нужного размера,но пропала активность скриптов как я понял,картинки не отображаются,и нет стрелок и нижнего меню слайдера?
может это с css не то что-то?
вот исходные данные из файла nivo-slider.css
/*
* jQuery Nivo Slider v2.7.1
* http://nivo.dev7studios.com
*
* Copyright 2011, Gilbert Pellegrom
* Free to use and abuse under the MIT license.
* http://www.opensourc...mit-license.php
*
* March 2010
*/


/* The Nivo Slider styles */
.nivoSlider {
  position:relative;
  margin-left:10px;
}
.nivoSlider img {
  position:absolute;
  top:0px;
  left:0px;
}
/* If an image is wrapped in a link */
.nivoSlider a.nivo-imageLink {
  position:absolute;
  top:0px;
  left:0px;
  width:100%;
  height:100%;
  border:0;
  padding:0;
  margin:0;
  z-index:6;
  display:none;
}
/* The slices and boxes in the Slider */
.nivo-slice {
  display:block;
  position:absolute;
  z-index:5;
  height:100%;
}
.nivo-box {
  display:block;
  position:absolute;
  z-index:5;
}
/* Caption styles */
.nivo-caption {
  position:absolute;
  left:0px;
  bottom:0px;
  background:#000;
  color:#fff;
  opacity:0.8; /* Overridden by captionOpacity setting */
  width:100%;
  z-index:8;
}
.nivo-caption p {
  padding:5px;
  margin:0;
}
.nivo-caption a {
  display:inline !important;
}
.nivo-html-caption {
    display:none;
}
/* Direction nav styles (e.g. Next & Prev) */
.nivo-directionNav a {
  position:absolute;
  top:45%;
  z-index:9;
  cursor:pointer;
}
.nivo-prevNav {
  left:0px;
}
.nivo-nextNav {
  right:0px;
}
/* Control nav styles (e.g. 1,2,3...) */
.nivo-controlNav a {
  position:relative;
  z-index:9;
  cursor:pointer;
}
.nivo-controlNav a.active {
  font-weight:bold;
}
.nivoSlider {
  position:relative;
    width:618px;
    height:246px;
  background:#efe9d1 url("http://ecoplus24.ru/...19/loading.gif") no-repeat 50% 50%;
    margin-bottom:80px;
    -moz-box-shadow:0px 0px 5px #333;
  -webkit-box-shadow:0px 0px 5px #333;
  box-shadow:0px 0px 5px #333;
}
.nivoSlider img {
  position:absolute;
  top:0px;
  left:0px;
  display:none;
}
.nivoSlider a {
  border:0;
  display:block;
}
.nivo-directionNav a {
  display:block;
  width:30px;
  height:30px;
  background:url("http://ecoplus24.ru/...719/arrows.png") no-repeat;
  text-indent:-9999px;
  border:0;
}
a.nivo-nextNav {
  background-position:-30px 0;
  right:15px;
}
a.nivo-prevNav {
  left:15px;
}
.nivo-caption {
    text-shadow:none;
    font-family: Helvetica, Arial, sans-serif;
}
.nivo-caption a {
    color:#efe9d1;
    text-decoration:underline;
}
#slider1 .nivo-controlNav,
#slider2 .nivo-controlNav,
#slider4 .nivo-controlNav {
  position:absolute;
  left:260px;
  bottom:-42px;
}
#slider1 .nivo-controlNav a,
#slider2 .nivo-controlNav a,
#slider4 .nivo-controlNav a {
  display:block;
  width:22px;
  height:22px;
  background:url("http://ecoplus24.ru/...19/bullets.png") no-repeat;
  text-indent:-9999px;
  border:0;
  margin-right:3px;
  float:left;
}
#slider1 .nivo-controlNav a.active,
#slider2 .nivo-controlNav a.active,
#slider4 .nivo-controlNav a.active {
  background-position:0 -22px;
}
#slider2 a {
  display:block; /* IE Fix */
}
#slider3 {
  margin-bottom:110px;
}
#slider3 .nivo-controlNav {
  position:absolute;
  left:185px;
  bottom:-70px;
}
#slider3 .nivo-controlNav a {
    display:inline;
}
#slider3 .nivo-controlNav img {
  display:inline;
  position:relative;
  margin-right:10px;
  -moz-box-shadow:0px 0px 5px #333;
  -webkit-box-shadow:0px 0px 5px #333;
  box-shadow:0px 0px 5px #333;
}
#slider3 .nivo-controlNav a.active img {
    border:1px solid #000;
}
#slider 4 {
    margin-bottom:0;
}
.withborders-table td{
    border:1px #E5E5E5 solid;
    padding: 4px 0px;
}

вот еще пропись подключение скриптов с html
<!-- Скрипты магазина -->
  <script type="text/javascript" src="{ASSETS_JS_PATH}main.js"></script>
  <link rel="stylesheet" href="{ASSETS_STYLES_PATH}nivo-slider.css" type="text/css" media="screen" />
  <script src="{ASSETS_JS_PATH}jquery.nivo.slider.pack.js" type="text/javascript"> </script>

[nozh]

Та же самая ситуация http://test7474.storeland.ru/

Только у меня еще и не крутится loading.

Помогите пожалуйста!)

[Vaccina]

Попробуйте в файле main.js найти

 $("#slider").nivoSlider({
auto: true,
continuous: true
});
});
//sdvig ssilok
$(document).ready(function()
{
  slide("#cats-menu", "+=8", "-=8", 150, .8);
});

и заменить на

});
$(window).load(function() {
		$('#slider1').nivoSlider({ pauseTime:5000, pauseOnHover:false });
});
//sdvig ssilok
$(document).ready(function()
{
  slide("#cats-menu", "+=8", "-=8", 150, .8);
});

Цитата

Та же самая ситуация http://test7474.storeland.ru/

Только у меня еще и не крутится loading.

Помогите пожалуйста!)

Попробуйте в файл main.js добавить

$(window).load(function() {
		$('#slider2').nivoSlider({ pauseTime:5000, pauseOnHover:false });
});

[evgeni449]

все получилось!
1.есть еще вопрос,как установить такую карусель как тут - http://polli-obuv.ru/ (Хиты продаж,Новинки)
2.как установить как тут  с лева http://polli-obuv.ru/ (Лидер продаж дня).
3.Такая проблема,товары на главной в рамке.как сделать что бы цена была ниже товара но в рамке,а то у меня цена заходит на изображение
4.как поменять дизайн Каталог товаров на главной (у меня при наведение светло-голубая лента,как этот файл называется в редакторе и какой примерно блок в css ?
Спасибо за вашу активную помощь!)

[nozh]

Спасибо! Все получилось! Хотел сделать инструкцию для всех, но теперь даже сам не понимаю, как получилось..)

[nozh]

НО возникла следующая проблема!!!

Слайдер очень долго загружается, как и сам сайт. Раньше такого не было. Может грузится секунд 30.
Проверено на разных браузерах, и с разных компов. Даже с разных стран..)) А в опере вообще не грузится.

В чем может быть дело?

[Vaccina]

Цитата

1.есть еще вопрос,как установить такую карусель как тут - http://polli-obuv.ru/ (Хиты продаж,Новинки)
2.как установить как тут с лева http://polli-obuv.ru/ (Лидер продаж дня).

Данный функционал разрабатывался на основе платных услуг.
http://forum.storela...dpost__p__16760

Цитата

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

Попробуйте сделать следующее. В файле стилей найти

.goodsListItemBlock {
	height: 230px;
	margin: 5px;
	overflow: hidden;
}

заменить на

.goodsListItemBlock {
	height: 230px;
	margin: 5px;
	overflow: hidden;
}

далее найти

.goodsListItemImage {
	height: 100px;
	margin-top: 2em;
}

заменить на

.goodsListItemImage {
	height: 140px;
	margin-top: 1em;
}

Цитата

4.как поменять дизайн Каталог товаров на главной (у меня при наведение светло-голубая лента,как этот файл называется в редакторе и какой примерно блок в css ?

Если вы про каталог категорий в левой панели - то стили отвечающие за наведение находятся в классе

.leftmenu li li a:hover {
	background: url("http://img.storeland.ru/web/upload/assets/images/57/56719/lm-bg.jpg") repeat-x scroll left bottom transparent;
}

а стандартные

.leftmenu li li a.selected {
	color: #000000;
	font-weight: bold;
}

.leftmenu li li a {
	border-bottom: 1px solid #D6D6D6;
	color: #999999;
	display: block;
	font: 13px/20px "Trebuchet MS",Arial,Helvetica,sans-serif;
	padding: 5px 10px;
	text-decoration: none;
}

Код HTML находиться в шаблоне "HTML"

Цитата

Слайдер очень долго загружается, как и сам сайт. Раньше такого не было. Может грузится секунд 30.
Проверено на разных браузерах, и с разных компов. Даже с разных стран..)) А в опере вообще не грузится.

Быть может проблема в канале.

[nozh]

Vaccina (17 Март 2012 - 10:38) писал:

Быть может проблема в канале.

В каком канале?

[Vaccina]

В плане - проблем соединения с интернетом. Это может быть как от вас до вашего провайдера, так и от провайдера до сервера. Или где-то в промежутке между точками...

[nozh]

Vaccina (19 Март 2012 - 21:24) писал:

В плане - проблем соединения с интернетом. Это может быть как от вас до вашего провайдера, так и от провайдера до сервера. Или где-то в промежутке между точками...

Это на протяжении всего времени происходит.

[norn08]

Здравствуйте!
вопрос по nivo слайдеру! сделал все как в этой теме писалось, и почему то картинки не меняются. просто висит загрузка. подскажите пожалуйста в чем проблема. адрес магазина http://martingale.storeland.ru/
Спасибо!

[Vaccina]

У вас 2 раза подключен один и тот же файл main.js. Вам необходимо удалить первое подключение в шапке (Шаблон "HTML"), оставив последнее.

[norn08]

Оставил только 1 подключение в шаблоне html. картинки все равно не показываются.
Подключения выглядят так:
  <!-- Скрипты магазина -->
  <script type="text/javascript" src="{ASSETS_JS_PATH}main.js"></script>
  <link rel="stylesheet" href="{ASSETS_STYLES_PATH}nivo-slider.css" type="text/css" media="screen" />
  <script src="{ASSETS_JS_PATH}jquery.nivo.slider.pack.js" type="text/javascript"> </script>

Код слайдера в шаблоне Страница выглядит так:
<!-- СЛАЙДЕР НА ГЛАВНОЙ -->
{%IF index_page %}
<div id="slider1" class="nivoSlider">
<img src="http://files.storela...ololololo1.jpg" alt="" />
<a href="http://dev7studios.com"> <img src="http://martingale.st.../ololololo.jpg" alt="" /> </ a>
</div>
{%ENDIF%}
<!-- СЛАЙДЕР НА ГЛАВНОЙ -->

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

[Vaccina]

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

});
});

/*nivo slider*/
});
$(window).load(function() {
		$('#slider1').nivoSlider({ pauseTime:5000, pauseOnHover:false });
});
//sdvig ssilok
$(document).ready(function()
{
  slide("#cats-menu", "+=8", "-=8", 150, .8);
});

попробуйте этот блок заменить на

});
});

/*nivo slider*/
$(window).load(function() {
		$('#slider1').nivoSlider({ pauseTime:5000, pauseOnHover:false });
});
//sdvig ssilok
$(document).ready(function()
{
  slide("#cats-menu", "+=8", "-=8", 150, .8);
});