Как Перенести Слайдер С Главной В Правый Сайд Бар
#1
Отправлено 27 Ноябрь 2013 - 11:00
Адрес сайта http://ovoylok.storeland.ru/ Помогите, пожалуйста
#2
Отправлено 27 Ноябрь 2013 - 11:03
#3
Отправлено 27 Ноябрь 2013 - 11:05
#4
Отправлено 27 Ноябрь 2013 - 11:26
Редактируем шаблон HTML
Находим
<!-- Nyvo слайдер который отображается на главной --> {% IF index_page %} <!-- Обёртка, указывающая стиль темы --> <div class="theme-default" style="padding: 1em; display: none;"> <!-- Непосредственный код слайдера --> <div id="slider"> <img src="http://ovoylok.storeland.net/SLIDER.jpg" alt="" /> <img src="http://ovoylok.storeland.net/nemo.jpg" alt="" /> <img title="Пример картинки с заголовком" src="http://ovoylok.storeland.net/toystory.jpg" alt="" /> <img src="http://ovoylok.storeland.net/walle.jpg" alt="" /> <img src="http://ovoylok.storeland.net/cars.jpg" alt="" /> </div> </div> <!-- Запуск слайдера --> <script type="text/javascript"> $(window).load(function() { $('#slider').nivoSlider().parent().show(); }); </script> {% ENDIF %}
Заменяем на
<!-- Nyvo слайдер который отображается на главной --> <!-- Обёртка, указывающая стиль темы --> <div class="theme-default" style="padding: 1em; display: none;"> <!-- Непосредственный код слайдера --> <div id="slider"> <img src="http://ovoylok.storeland.net/SLIDER.jpg" alt="" /> <img src="http://ovoylok.storeland.net/nemo.jpg" alt="" /> <img title="Пример картинки с заголовком" src="http://ovoylok.storeland.net/toystory.jpg" alt="" /> <img src="http://ovoylok.storeland.net/walle.jpg" alt="" /> <img src="http://ovoylok.storeland.net/cars.jpg" alt="" /> </div> </div> <!-- Запуск слайдера --> <script type="text/javascript"> $(window).load(function() { $('#slider').nivoSlider().parent().show(); }); </script>
Если вы хотите чтобы слайдер отображался только на этой странице, то
Сайт - Страницы - редактируем "Мы рады приветствовать вас!"
описание со скриншотами как вставить слайдер в страницу
#5
Отправлено 27 Ноябрь 2013 - 13:10
#6
Отправлено 27 Ноябрь 2013 - 14:00
#7
Отправлено 27 Ноябрь 2013 - 14:19
Татья_на (27 Ноябрь 2013 - 13:10) писал:
Теперь я вас понял.
Убираем слайд шоу со страницы HTML
<!-- Nyvo слайдер который отображается на главной --> {% IF index_page %} <!-- Обёртка, указывающая стиль темы --> <div class="theme-default" style="padding: 1em; display: none;"> <!-- Непосредственный код слайдера --> <div id="slider"> <img src="http://ovoylok.storeland.net/SLIDER.jpg" alt="" /> <img src="http://ovoylok.storeland.net/nemo.jpg" alt="" /> <img title="Пример картинки с заголовком" src="http://ovoylok.storeland.net/toystory.jpg" alt="" /> <img src="http://ovoylok.storeland.net/walle.jpg" alt="" /> <img src="http://ovoylok.storeland.net/cars.jpg" alt="" /> </div> </div> <!-- Запуск слайдера --> <script type="text/javascript"> $(window).load(function() { $('#slider').nivoSlider().parent().show(); }); </script> {% ENDIF %}
Теперь добавляем слайдер в боковое меню
Находим в шаблоне HTML (386 строка)
<!-- Последние товары, просмотренные пользователем -->После нее вставляем
<!-- Слайд шоу в боковом меню --> <div class="block"> <div class="blocktitle bluelarge">Слайд Шоу </div> <div class="block slider padd"> <div class="theme-default" style="padding: 1em; display: none;"> <!-- Непосредственный код слайдера --> <div id="slider"> <img src="http://ovoylok.storeland.net/SLIDER.jpg" alt="" /> <img src="http://ovoylok.storeland.net/nemo.jpg" alt="" /> <img title="Пример картинки с заголовком" src="http://ovoylok.storeland.net/toystory.jpg" alt="" /> <img src="http://ovoylok.storeland.net/walle.jpg" alt="" /> <img src="http://ovoylok.storeland.net/cars.jpg" alt="" /> </div> </div> </div> <div class="blockbottom"></div> </div> <!-- Слайд шоу в боковом меню -->
Далее редактируем main.css
Вставляем после 164 строки
#left .block .slider, #right .block .slider { padding: 20px 0 15px 0; height: 170px; }
Редактируем nyvo.css
Находим
.theme-default .nivoSlider { position:relative; background:#fff url(http://ovoylok.storeland.net/nyvo_loading.gif) no-repeat 50% 50%; margin-bottom: 50px; -webkit-box-shadow: 0px 1px 5px 0px #4a4a4a; -moz-box-shadow: 0px 1px 5px 0px #4a4a4a; box-shadow: 0px 1px 5px 0px #4a4a4a; }
Заменяем на
.theme-default .nivoSlider { position:relative; background:#fff url(http://ovoylok.storeland.net/nyvo_loading.gif) no-repeat 50% 50%; margin-bottom: 0px; -webkit-box-shadow: 0px 1px 5px 0px #4a4a4a; -moz-box-shadow: 0px 1px 5px 0px #4a4a4a; box-shadow: 0px 1px 5px 0px #4a4a4a; }
#8
Отправлено 27 Ноябрь 2013 - 14:22
Татья_на (27 Ноябрь 2013 - 14:00) писал:
#9
Отправлено 27 Ноябрь 2013 - 15:23
#10
Отправлено 27 Ноябрь 2013 - 15:56
#11
Отправлено 27 Ноябрь 2013 - 16:08
Татья_на (27 Ноябрь 2013 - 15:56) писал:
Находим
<!-- Слайд шоу в боковом меню --> <div class="block"> <div class="blocktitle bluelarge">Слайд Шоу </div> <div class="block slider padd"> <div class="theme-default" style="padding: 1em; display: none;"> <!-- Непосредственный код слайдера --> <div id="slider"> <img src="http://ovoylok.storeland.net/SLIDER.jpg" alt="" /> <img src="http://ovoylok.storeland.net/nemo.jpg" alt="" /> <img title="Пример картинки с заголовком" src="http://ovoylok.storeland.net/toystory.jpg" alt="" /> <img src="http://ovoylok.storeland.net/walle.jpg" alt="" /> <img src="http://ovoylok.storeland.net/cars.jpg" alt="" /> </div> </div> </div> <div class="blockbottom"></div> </div> <!-- Слайд шоу в боковом меню -->
Заменяем на
<!-- Слайд шоу в боковом меню --> <div class="block"> <div class="blocktitle bluelarge">Слайд Шоу </div> <div class="block slider padd"> <div class="theme-default" style="padding: 1em; display: none;"> <!-- Непосредственный код слайдера --> <div id="slider"> <img src="http://ovoylok.storeland.net/SLIDER.jpg" alt="" /> <img src="http://ovoylok.storeland.net/nemo.jpg" alt="" /> <img title="Пример картинки с заголовком" src="http://ovoylok.storeland.net/toystory.jpg" alt="" /> <img src="http://ovoylok.storeland.net/walle.jpg" alt="" /> <img src="http://ovoylok.storeland.net/cars.jpg" alt="" /> </div> </div> <!-- Запуск слайдера --> <script type="text/javascript"> $(window).load(function() { $('#slider').nivoSlider().parent().show(); }); </script> </div> <div class="blockbottom"></div> </div>
#12
Отправлено 27 Ноябрь 2013 - 16:38
#13
Отправлено 27 Ноябрь 2013 - 18:17
#14
Отправлено 27 Ноябрь 2013 - 19:39
Татья_на (27 Ноябрь 2013 - 18:17) писал:
{% IF goods_filters_empty %} <!-- Если в категории нет товаров, но есть категории, то отобразим их --> {%IFNOT nested_categories_list_empty %} <!-- Блок навигации по категориям, вложенным в текущую категорию --> <div class="box padd"> <table class="table" cellpadding="5" cellspacing="0"> <tr> {% FOR nested_categories_list %} <td> <div class="tabproduct"> <div class="title fnt12b txtalgncnt"> <a href="{nested_categories_list.URL}" title="Перейти к категории «{nested_categories_list.NAME}»">{nested_categories_list.NAME}</a> </div> <div class="img txtalgncnt"> <a href="{nested_categories_list.URL}" title="Перейти на страницу «{nested_categories_list.NAME}»"><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="buttons txtalgncnt"> <a href="{nested_categories_list.URL}" class="whtgreen" title="Перейти к категории «{nested_categories_list.NAME}»">Перейти в категорию</a> </div> </div> </td> {% IFNOT nested_categories_list.last %} {% IF index_page %} {nested_categories_list.index | is_divided("2","</tr><tr>","")} {% ELSE %} {nested_categories_list.index | is_divided("3","</tr><tr>","")} {% ENDIF %} {% ENDIF %} {% ENDFOR %} </tr> </table> </div> <br clear="all"/> <!-- Если в категории нет ни товаров, ни категорий то сообщим пользователю что ничего нет --> {% ELSE %} <div class="infoblock fnt12b txtalgnlft" style="margin-bottom:10px;">Нет товаров в категории</div> {% ENDIF %} <!-- Если производили фильтрацию товаров в категории --> {% ELSE %} <div class="infoblock fnt12b txtalgnlft" style="margin-bottom:10px;">Нет товаров для выбранных условий</div> {% ENDIF %} {% ELSE %}на
<!-- Если не применено ни одного фильтра, значит в категории нет товаров --> {% IF goods_filters_empty %} <!-- Если в категории нет товаров, но есть категории, то отобразим их --> {%IFNOT nested_categories_list_empty %} <!-- Блок навигации по категориям, вложенным в текущую категорию --> <div class="box padd"> <table class="table" cellpadding="5" cellspacing="0"> <tr> {% FOR nested_categories_list %} <td> <div class="tabproduct"> <div class="title fnt12b txtalgncnt"> <a href="{nested_categories_list.URL}" title="Перейти к категории «{nested_categories_list.NAME}»">{nested_categories_list.NAME}</a> </div> <div class="img txtalgncnt"> <a href="{nested_categories_list.URL}" title="Перейти на страницу «{nested_categories_list.NAME}»"><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="buttons txtalgncnt"> <a href="{nested_categories_list.URL}" class="whtgreen" title="Перейти к категории «{nested_categories_list.NAME}»">Перейти в категорию</a> </div> </div> </td> {% IFNOT nested_categories_list.last %} {% IF index_page %} {nested_categories_list.index | is_divided("2","</tr><tr>","")} {% ELSE %} {nested_categories_list.index | is_divided("3","</tr><tr>","")} {% ENDIF %} {% ENDIF %} {% ENDFOR %} </tr> </table> </div> <br clear="all"/> <!-- Если в категории нет ни товаров, ни категорий то сообщим пользователю что ничего нет --> {% ELSEIF goods_empty %} <div class="infoblock fnt12b txtalgnlft" style="margin-bottom:10px;">Нет товаров в категории</div> {% ENDIF %} <!-- Если производили фильтрацию товаров в категории --> {% ELSE %} <div class="infoblock fnt12b txtalgnlft" style="margin-bottom:10px;">Нет товаров для выбранных условий</div> {% ENDIF %} {% IF nested_categories_list_empty && goods_empty=0%}
#15
Отправлено 27 Ноябрь 2013 - 20:32
#16
Отправлено 27 Ноябрь 2013 - 21:34
Татья_на (27 Ноябрь 2013 - 20:32) писал:
#content .cort .right { float: right; margin: 2px 0 0 0; }на
#content .cort .right { float: right; margin: 2px 0 0 0; display: none; }
#content .cort .left { float: left; color: #999; }на
#content .cort .left { float: left; color: #999; padding-bottom: 15px; }
И пришлите, пожалуйста, скриншот с указаниями, что и где должно находиться.
#17
Отправлено 28 Ноябрь 2013 - 07:38
Количество пользователей, читающих эту тему: 0
0 пользователей, 0 гостей, 0 анонимных