Размещение Слайдера На Главной Странице Со Специальными Размерами И Положением.
#1
Отправлено 27 Август 2014 - 11:36
Необходимо вставить слайдер со стрелками (для возможности перемотки). Баннер должен в точности соответствовать размеру картинки установленной сейчас. И сразу хотелось бы подробно узнать как добавлять изображения в слайдер и есть ли ограничения по их количеству. Заранее спасибо.
#2
Отправлено 27 Август 2014 - 11:39
origina1 (27 Август 2014 - 11:36) писал:
Необходимо вставить слайдер со стрелками (для возможности перемотки). Баннер должен в точности соответствовать размеру картинки установленной сейчас. И сразу хотелось бы подробно узнать как добавлять изображения в слайдер и есть ли ограничения по их количеству. Заранее спасибо.
Что бы установить слайдер воспользуйтесь темой http://storeland.ru/about/faq#51 , ограничений по количеству изображений нету.
#3
Отправлено 27 Август 2014 - 12:07
batta (27 Август 2014 - 11:39) писал:
Что бы установить слайдер воспользуйтесь темой http://storeland.ru/about/faq#51 , ограничений по количеству изображений нету.
А как его сделать нужными размерами, и сдлеать его после "Оформить заявку" ?
#4
Отправлено 27 Август 2014 - 12:31
origina1 (27 Август 2014 - 12:07) писал:
Лучше и проще поставить его перед этим заголовком. Сам заголовок у Вас идет в коде страницы, туда устанавливать и редактировать слайдер не очень удобно. Произведите изменения согласно инструкции и далее поможем Вам его отредактировать и перенести.
#5
Отправлено 27 Август 2014 - 17:28
MikDark (27 Август 2014 - 12:31) писал:
В файле HTML не обнаруживает следующее
<!-- Скрипты магазина -->
<script type="text/javascript" src="{ASSETS_JS_PATH}main.js"></script>
#6
Отправлено 27 Август 2014 - 17:32
origina1 (27 Август 2014 - 17:28) писал:
<!-- Скрипты магазина -->
<script type="text/javascript" src="{ASSETS_JS_PATH}main.js"></script>
Здравствуйте.
В шаблоне html найдите
<!-- Скрипты магазина --> <script src="{ASSETS_JS_PATH}main.js"></script>И замените на
<!-- Скрипты магазина --> <script rel="text/javascript" src="{ASSETS_JS_PATH}main.js"></script>
#7
Отправлено 27 Август 2014 - 18:15
Danil (27 Август 2014 - 17:32) писал:
В шаблоне html найдите
<!-- Скрипты магазина --> <script src="{ASSETS_JS_PATH}main.js"></script>И замените на
<!-- Скрипты магазина --> <script rel="text/javascript" src="{ASSETS_JS_PATH}main.js"></script>
И такого кода тоже не находит ))))
#9
Отправлено 28 Август 2014 - 05:06
MikDark (27 Август 2014 - 12:31) писал:
Слайдер Установил. Далее его нужно поставить вместо картинки (Смотрите моё самое первое сообщение). Где хранятся картинки слайдера для замены? Как поменять размер слайдера ? И почему появляются миниатюрки слева сверху на слайдере как от них избавится ? Заранее благодарен. )
#10
Отправлено 28 Август 2014 - 05:39
{% IF index_page %} <!-- Обёртка, указывающая стиль темы --> <div class="theme-default" style="padding: 1em; display: none;"> <!-- Непосредственный код слайдера --> <div id="slider"> <img src="http://st.xn--90abkter0ahi.xn--p1ai/7/1305/152/Slide1.png" alt="" /> <a href="/"><img src="http://st.xn--90abkter0ahi.xn--p1ai/7/1305/152/Slide1.png" alt="" /></a> <img src="http://st.xn--90abkter0ahi.xn--p1ai/7/1305/152/Slide1.png" alt="" /> <img src="http://st.xn--90abkter0ahi.xn--p1ai/7/1305/152/Slide1.png" alt="" /> <img src="http://st.xn--90abkter0ahi.xn--p1ai/7/1305/152/Slide1.png" alt="" /> </div> </div> <!-- Запуск слайдера --> <script type="text/javascript"> $(window).load(function() { $('#slider').nivoSlider().parent().show(); }); </script> {% ENDIF %}перенесите в шаблон страница поставив после:
<section role="main"> <header> <h1>{PAGE_NAME}</h1> </header> {% IF FORM_NOTICE %}<ul class="message {% IF FORM_NOTICE_IS_GOOD %}success-msg{% ELSE %}error-notice{% ENDIF %}"><li>{FORM_NOTICE | nl2br}</li></ul>{% ENDIF %} <section> {PAGE_CONTENT} </section>в код слайдера, а именно перед:
<!-- Обёртка, указывающая стиль темы --> <div class="theme-default" style="padding: 1em; display: none;">вставьте:
<div style="text-align: center;"><a href="http://xn--90abkter0ahi.xn--p1ai/feedback"><img style="width: 1280px; height: 116px;" src="http://st.xn--90abkter0ahi.xn--p1ai/9/1151/729/form.png" alt=""></a><br> </div>
далее зайдите в раздел Сайт - Страницы и отредактируйте главную страницу убрав два баннера.
1. Картинки хранятся в разделе Редактор шаблонов.
2.Размер слайдера исходит от размера картинок
3. В nyvo.css найдите:
.nivo-slice { display: block; height: 100%; position: absolute; top: 0; z-index: 5; }замените на:
.nivo-slice { display: none; height: 100%; position: absolute; top: 0; z-index: 5; }
#11
Отправлено 28 Август 2014 - 06:17
Vaccina (28 Август 2014 - 05:39) писал:
{% IF index_page %} <!-- Обёртка, указывающая стиль темы --> <div class="theme-default" style="padding: 1em; display: none;"> <!-- Непосредственный код слайдера --> <div id="slider"> <img src="http://st.xn--90abkter0ahi.xn--p1ai/7/1305/152/Slide1.png" alt="" /> <a href="/"><img src="http://st.xn--90abkter0ahi.xn--p1ai/7/1305/152/Slide1.png" alt="" /></a> <img src="http://st.xn--90abkter0ahi.xn--p1ai/7/1305/152/Slide1.png" alt="" /> <img src="http://st.xn--90abkter0ahi.xn--p1ai/7/1305/152/Slide1.png" alt="" /> <img src="http://st.xn--90abkter0ahi.xn--p1ai/7/1305/152/Slide1.png" alt="" /> </div> </div> <!-- Запуск слайдера --> <script type="text/javascript"> $(window).load(function() { $('#slider').nivoSlider().parent().show(); }); </script> {% ENDIF %}перенесите в шаблон страница поставив после:
<section role="main"> <header> <h1>{PAGE_NAME}</h1> </header> {% IF FORM_NOTICE %}<ul class="message {% IF FORM_NOTICE_IS_GOOD %}success-msg{% ELSE %}error-notice{% ENDIF %}"><li>{FORM_NOTICE | nl2br}</li></ul>{% ENDIF %} <section> {PAGE_CONTENT} </section>в код слайдера, а именно перед:
<!-- Обёртка, указывающая стиль темы --> <div class="theme-default" style="padding: 1em; display: none;">вставьте:
<div style="text-align: center;"><a href="http://xn--90abkter0ahi.xn--p1ai/feedback"><img style="width: 1280px; height: 116px;" src="http://st.xn--90abkter0ahi.xn--p1ai/9/1151/729/form.png" alt=""></a><br> </div>
далее зайдите в раздел Сайт - Страницы и отредактируйте главную страницу убрав два баннера.
1. Картинки хранятся в разделе Редактор шаблонов.
2.Размер слайдера исходит от размера картинок
3. В nyvo.css найдите:
.nivo-slice { display: block; height: 100%; position: absolute; top: 0; z-index: 5; }замените на:
.nivo-slice { display: none; height: 100%; position: absolute; top: 0; z-index: 5; }
Спасибо всё выполнил. Но "Оформить заявку" и слайдер почему то опустились в самый низ. Как их поднять.? И можно ли точки которые находятся под слайдером сблизить со слайдером ? уж больно большое расстояние.
#12
Отправлено 28 Август 2014 - 06:22
<section role="main"> <header> <h1>{PAGE_NAME}</h1> </header> {% IF FORM_NOTICE %}<ul class="message {% IF FORM_NOTICE_IS_GOOD %}success-msg{% ELSE %}error-notice{% ENDIF %}"><li>{FORM_NOTICE | nl2br}</li></ul>{% ENDIF %}
необходимо, чтобы он располагался выше:
<section> {PAGE_CONTENT} </section>
на счет точек в nyvo.css найдите примерно сл.код(ищите по первой строке):
.theme-default .nivoSlider { background: url("http://design.xn--90abkter0ahi.xn--p1ai/nyvo_loading.gif") no-repeat scroll 50% 50% #fff; box-shadow: 0 1px 5px 0 #4a4a4a; margin-bottom: 50px; position: relative; }уменьшите значение margin-bottom
#13
Отправлено 28 Август 2014 - 06:51
Vaccina (28 Август 2014 - 06:22) писал:
<section role="main"> <header> <h1>{PAGE_NAME}</h1> </header> {% IF FORM_NOTICE %}<ul class="message {% IF FORM_NOTICE_IS_GOOD %}success-msg{% ELSE %}error-notice{% ENDIF %}"><li>{FORM_NOTICE | nl2br}</li></ul>{% ENDIF %}
необходимо, чтобы он располагался выше:
<section> {PAGE_CONTENT} </section>
на счет точек в nyvo.css найдите примерно сл.код(ищите по первой строке):
.theme-default .nivoSlider { background: url("http://design.xn--90abkter0ahi.xn--p1ai/nyvo_loading.gif") no-repeat scroll 50% 50% #fff; box-shadow: 0 1px 5px 0 #4a4a4a; margin-bottom: 50px; position: relative; }уменьшите значение margin-bottom
Всё получилось спасибо большое! Теперь при нажатии на 4-ю точку в навигации слайдера всё равно появляется миниатюрка сверху слева. Как её убрать ? И ещё сразу вопрос. Если я буду добавлять ещё картинок в слайд эти точки снизу сами будут добавляться ?
#14
Отправлено 28 Август 2014 - 07:02
origina1 (28 Август 2014 - 06:51) писал:
Здравствуйте, в файле nyvo.css
Находим
.nivo-box { display:block; position:absolute; z-index:5; overflow:hidden; } .nivo-box img { display:block; }
Заменяем на
.nivo-box { display:none; position:absolute; z-index:5; overflow:hidden; } .nivo-box img { display:none; }
#15
Отправлено 28 Август 2014 - 10:16
Castiel (28 Август 2014 - 07:02) писал:
Находим
.nivo-box { display:block; position:absolute; z-index:5; overflow:hidden; } .nivo-box img { display:block; }
Заменяем на
.nivo-box { display:none; position:absolute; z-index:5; overflow:hidden; } .nivo-box img { display:none; }
Спасибо! Теперь подскажите как менять эффекты перехода слайдов ? ))
#16
Отправлено 28 Август 2014 - 10:48
origina1 (28 Август 2014 - 10:16) писал:
Здравствуйте.
Зайдите в шаблон Страница и найдите код
<script type="text/javascript"> $(window).load(function() { $('#slider').nivoSlider().parent().show(); }); </script>И замените на
<script type="text/javascript"> $(window).load(function() { $('#slider').nivoSlider({ effect: 'sliceDownLeft, sliceDownRight' }).parent().show(); }); </script>В строке effect меняется эффект перехода.
Попробуйте эти:
sliceDown
sliceDownLeft
sliceUp
sliceUpLeft
sliceUpDown
sliceUpDownLeft
fold
fade
random
slideInRight
slideInLeft
boxRandom
boxRain
boxRainReverse
boxRainGrow
boxRainGrowReverse
#17
Отправлено 28 Август 2014 - 11:21
Danil (28 Август 2014 - 10:48) писал:
Зайдите в шаблон Страница и найдите код
<script type="text/javascript"> $(window).load(function() { $('#slider').nivoSlider().parent().show(); }); </script>И замените на
<script type="text/javascript"> $(window).load(function() { $('#slider').nivoSlider({ effect: 'sliceDownLeft, sliceDownRight' }).parent().show(); }); </script>В строке effect меняется эффект перехода.
Попробуйте эти:
sliceDown
sliceDownLeft
sliceUp
sliceUpLeft
sliceUpDown
sliceUpDownLeft
fold
fade
random
slideInRight
slideInLeft
boxRandom
boxRain
boxRainReverse
boxRainGrow
boxRainGrowReverse
Сделал всё, но никакой из эффектов не применяется/включается. То есть как резко просто менялась картинка так и осталось.
#19
Отправлено 28 Август 2014 - 12:00
Danil (28 Август 2014 - 11:41) писал:
Код выглядит так:
<script type="text/javascript">
$(window).load(function() {
$('#slider').nivoSlider({
effect: 'boxRainGrow'
}).parent().show(); });
</script>
Не один из эфектов не работает.
#20
Отправлено 29 Август 2014 - 01:40
Темы с аналогичным тегами Слайдер размещение, размер
Количество пользователей, читающих эту тему: 0
0 пользователей, 0 гостей, 0 анонимных