Добрый день! Вот уже не сколько дней штудирую форум в поисках ответа на вопрос об установке слайдера на главной странице. Шаблон Nyvo получилось поставить с первого раза, даже потом вставил в него свои картинки и так все работало. но я хочу поставить другой слайдер - Flex. Делаю всё, как написано в форуме в постах про сам Nyvo, так и в посте про Flexslider. Но ничего не работает. в лучшем случае просто появляются статичные картинки и все. Помогите разобраться, что я делаю не так. Спасибо.
!-- Скрипты магазина -->
<script type="text/javascript" src="{ASSETS_JS_PATH}main.js"></script>
<link rel="stylesheet" href="{ASSETS_STYLES_PATH}flexslider.css" type="text/css">
<script src="{ASSETS_JS_PATH}jquery.flexslider.js" type="text/javascript"></script>
<script src="{ASSETS_JS_PATH}jquery.flexslider-min.js" type="text/javascript"></script>
<script type="text/javascript" charset="utf-8">
$(window).load(function() {
$('.flexslider').flexslider();
});
</script>
{% IF index_page %}
<!-- Обёртка, указывающая стиль темы -->
<div class="theme-default" style="padding:1em;display:none;">
<!-- Непосредственный код слайдера -->
<div id="slider">
<img src="http://files.storela.../324096/01.jpg" />" alt="" />
<a href="/"><img src="http://files.storela.../324097/02.jpg" />" alt="" /></a>
<img src="http://files.storela.../324098/03.jpg" />g" alt="" title="Пример картинки с заголовком" />
<img src="http://files.storela.../324099/04.jpg" />
<img src="http://files.storela...3240100/05.jpg" />
</div>
</div>
<!-- Запуск слайдера -->
<script type="text/javascript">
$(window).load(function() {
$('#slider').nivoSlider().parent().show();
});
</script>
{% ENDIF %}
1
Сообщений в теме: 5
#1
Отправлено 01 Декабрь 2012 - 06:35
#2
Отправлено 01 Декабрь 2012 - 09:33
david_gabriel (01 Декабрь 2012 - 06:35) писал:
Добрый день! Вот уже не сколько дней штудирую форум в поисках ответа на вопрос об установке слайдера на главной странице. Шаблон Nyvo получилось поставить с первого раза, даже потом вставил в него свои картинки и так все работало. но я хочу поставить другой слайдер - Flex. Делаю всё, как написано в форуме в постах про сам Nyvo, так и в посте про Flexslider. Но ничего не работает. в лучшем случае просто появляются статичные картинки и все. Помогите разобраться, что я делаю не так. Спасибо.
<!-- Запуск слайдера -->
<script type="text/javascript">
$(window).load(function() {
$('#slider').nivoSlider().parent().show();
});
</script>
{% ENDIF %}
<!-- Запуск слайдера -->
<script type="text/javascript">
$(window).load(function() {
$('#slider').nivoSlider().parent().show();
});
</script>
{% ENDIF %}
У Вас должно быть так
{% IF index_page %} <!-- Обёртка, указывающая стиль темы --> <div class="theme-default" style="padding:1em;display:none;"> <!-- Непосредственный код слайдера --> <div id="slider"> <img src="http://files.storela.../324096/01.jpg" />" alt="" /> <a href="/"><img src="http://files.storela.../324097/02.jpg" />" alt="" /></a> <img src="http://files.storela.../324098/03.jpg" /> alt="" title="Пример картинки с заголовком" /> <img src="http://files.storela.../324099/04.jpg" /> <img src="http://files.storela...3240100/05.jpg" /> </div> </div> <script type="text/javascript" charset="utf-8"> $(window).load(function() { $('.flexslider').flexslider(); }); </script> {% ENDIF %}
Также, проверьте загрузились ли все эти файлы: flexslider.css, jquery.flexslider.js, jquery.flexslider-min.js. Также возможно есть изображения, которые тоже нужны для данного слайдера (например стрелочки или фон). Эти изображения обычно формата png в архиве слайдера находятся при скачивании.
Напишите адрес своего сайта или id, чтобы мы смогли посмотреть наглядно в чем у Вас проблема.
#3
Отправлено 01 Декабрь 2012 - 16:13
Здравствуйте, благодарю Вас за ответ. Я сделал все, как вы говорили, но пока так ничего и не получилось.
Мой сайт:
fruktonos-tver.ru
Вообще, хотелось бы уточнить, правильно ли я понимаю сам алгоритм действий при установке любого слайдера.
1. Загрузить все css , js и картинки из папки Image в "редакторе тем".
2. В шаблоне HTML после основного скрипта добавить ссылки на файлы css и js , пример:
link rel="stylesheet" href="{ASSETS_STYLES_PATH}nyvo.css" type="text/css" media="screen" />
<script src="{ASSETS_JS_PATH}jquery.flexslider.js" type="text/javascript"></script>
<script src="{ASSETS_JS_PATH}jquery.flexslider-min.js" type="text/javascript"></script>
3. В том же шаблоне HTML прописать код самого слайдера. (При этом есть вопрос: прописывать код, который указан на вашем сайте или тот, что идет в составе архива нового слайдера?)
4. После кода слайдера поместить скрипт с кодом его запуска. (Опять таки, вопрос - прорисывать его так, как показано на примере nyvo, или как предлагает разработчик? И ещё: этот код ставить сразу после кода слайдера, или после скрипта с сылками на файлы css, js?
Заранее благодарю за ответ?
Мой сайт:
fruktonos-tver.ru
Вообще, хотелось бы уточнить, правильно ли я понимаю сам алгоритм действий при установке любого слайдера.
1. Загрузить все css , js и картинки из папки Image в "редакторе тем".
2. В шаблоне HTML после основного скрипта добавить ссылки на файлы css и js , пример:
link rel="stylesheet" href="{ASSETS_STYLES_PATH}nyvo.css" type="text/css" media="screen" />
<script src="{ASSETS_JS_PATH}jquery.flexslider.js" type="text/javascript"></script>
<script src="{ASSETS_JS_PATH}jquery.flexslider-min.js" type="text/javascript"></script>
3. В том же шаблоне HTML прописать код самого слайдера. (При этом есть вопрос: прописывать код, который указан на вашем сайте или тот, что идет в составе архива нового слайдера?)
4. После кода слайдера поместить скрипт с кодом его запуска. (Опять таки, вопрос - прорисывать его так, как показано на примере nyvo, или как предлагает разработчик? И ещё: этот код ставить сразу после кода слайдера, или после скрипта с сылками на файлы css, js?
Заранее благодарю за ответ?
#4
Отправлено 01 Декабрь 2012 - 16:44
david_gabriel (01 Декабрь 2012 - 16:13) писал:
Здравствуйте, благодарю Вас за ответ. Я сделал все, как вы говорили, но пока так ничего и не получилось.
Мой сайт:
fruktonos-tver.ru
Вообще, хотелось бы уточнить, правильно ли я понимаю сам алгоритм действий при установке любого слайдера.
1. Загрузить все css , js и картинки из папки Image в "редакторе тем".
2. В шаблоне HTML после основного скрипта добавить ссылки на файлы css и js , пример:
link rel="stylesheet" href="{ASSETS_STYLES_PATH}nyvo.css" type="text/css" media="screen" />
<script src="{ASSETS_JS_PATH}jquery.flexslider.js" type="text/javascript"></script>
<script src="{ASSETS_JS_PATH}jquery.flexslider-min.js" type="text/javascript"></script>
3. В том же шаблоне HTML прописать код самого слайдера. (При этом есть вопрос: прописывать код, который указан на вашем сайте или тот, что идет в составе архива нового слайдера?)
4. После кода слайдера поместить скрипт с кодом его запуска. (Опять таки, вопрос - прорисывать его так, как показано на примере nyvo, или как предлагает разработчик? И ещё: этот код ставить сразу после кода слайдера, или после скрипта с сылками на файлы css, js?
Заранее благодарю за ответ?
Мой сайт:
fruktonos-tver.ru
Вообще, хотелось бы уточнить, правильно ли я понимаю сам алгоритм действий при установке любого слайдера.
1. Загрузить все css , js и картинки из папки Image в "редакторе тем".
2. В шаблоне HTML после основного скрипта добавить ссылки на файлы css и js , пример:
link rel="stylesheet" href="{ASSETS_STYLES_PATH}nyvo.css" type="text/css" media="screen" />
<script src="{ASSETS_JS_PATH}jquery.flexslider.js" type="text/javascript"></script>
<script src="{ASSETS_JS_PATH}jquery.flexslider-min.js" type="text/javascript"></script>
3. В том же шаблоне HTML прописать код самого слайдера. (При этом есть вопрос: прописывать код, который указан на вашем сайте или тот, что идет в составе архива нового слайдера?)
4. После кода слайдера поместить скрипт с кодом его запуска. (Опять таки, вопрос - прорисывать его так, как показано на примере nyvo, или как предлагает разработчик? И ещё: этот код ставить сразу после кода слайдера, или после скрипта с сылками на файлы css, js?
Заранее благодарю за ответ?
1. Код слайдера вместе с <script> ... </script> нужно брать из архива Вашей галереи. Если Вы его хотите использовать на нескольких страница, то вставляйте под
<script src="{ASSETS_JS_PATH}jquery.flexslider.js" type="text/javascript"></script> <script src="{ASSETS_JS_PATH}jquery.flexslider-min.js" type="text/javascript"></script>Если только на конкретной странице, то вставляйте под кодом слайдера.
Из нашего примера Вам ничего брать не нужно для Вашей другой галереи. Все css и js и другой код там абсолютно разные. Все берете только из архива Вашей галереи
#5
Отправлено 01 Декабрь 2012 - 17:10
Спасибо за ответ. Пока результат тот же - никакой.
Я хотел поставить слайдер вот отсюда: http://www.woothemes.com/flexslider/
Выполнил все три шага, которые они там указывают. При этом, они пишут, даже сами файлы со скриптами грузить не надо - указывают в коде ссылку на Гугле, где лежат исходники.
Результат: три маленькие точки под строкой меню...
Привожу код, посмотрите, пожалуйста, ещё раз:
<!-- Скрипты магазина -->
<script type="text/javascript" src="{ASSETS_JS_PATH}flexslider.css"></script>
<link rel="stylesheet" href="flexslider.css" type="text/css">
<script src="https://ajax.googlea...n.js"></script>
<script src="jquery.flexslider.js"></script>
<!-- Place in the <head>, after the three links -->
<script type="text/javascript" charset="utf-8">
$(window).load(function() {
$('.flexslider').flexslider();
});
</script>
Слайдер:
<!-- Place somewhere in the <body> of your page -->
<div class="flexslider">
<ul class="slides">
<li>
<img src=""http://files.storela...329623/01.jpg"" />
</li>
<li>
<img src=""http://files.storela...329624/02.jpg"" />
</li>
<li>
<img src=""http://files.storela...329625/03.jpg"" />
</li>
</ul>
</div>
{BODY}
Я хотел поставить слайдер вот отсюда: http://www.woothemes.com/flexslider/
Выполнил все три шага, которые они там указывают. При этом, они пишут, даже сами файлы со скриптами грузить не надо - указывают в коде ссылку на Гугле, где лежат исходники.
Результат: три маленькие точки под строкой меню...
Привожу код, посмотрите, пожалуйста, ещё раз:
<!-- Скрипты магазина -->
<script type="text/javascript" src="{ASSETS_JS_PATH}flexslider.css"></script>
<link rel="stylesheet" href="flexslider.css" type="text/css">
<script src="https://ajax.googlea...n.js"></script>
<script src="jquery.flexslider.js"></script>
<!-- Place in the <head>, after the three links -->
<script type="text/javascript" charset="utf-8">
$(window).load(function() {
$('.flexslider').flexslider();
});
</script>
Слайдер:
<!-- Place somewhere in the <body> of your page -->
<div class="flexslider">
<ul class="slides">
<li>
<img src=""http://files.storela...329623/01.jpg"" />
</li>
<li>
<img src=""http://files.storela...329624/02.jpg"" />
</li>
<li>
<img src=""http://files.storela...329625/03.jpg"" />
</li>
</ul>
</div>
{BODY}
#6
Отправлено 02 Декабрь 2012 - 12:04
Все же некоторые скрипты на сайт нужно загрузить.
Чтобы слайдер заработал.
И кстати.Слайдер очень похож на слайдер описанный тут. http://storeland.ru/about/faq#51
Вот архив с измененным css файлом из их сайта.
flexslider.css 3,77К 505 Количество загрузок:
Загрузите себе на сайт этот файл стилей и еще два файла.
А именно:
jquery.flexslider.js,
bg_direction_nav.png
файл с скриптом и файл с кнопками.
Теперь в редакторе тем. (Сайт-Редактор тем).
Открыть файл HTML.
После кода:
Вставить:
Затем вставить код вывода слайдера до переменной {body}.
http://forum.storela...дер/#entry32258
Удачи!
Чтобы слайдер заработал.
И кстати.Слайдер очень похож на слайдер описанный тут. http://storeland.ru/about/faq#51
Вот архив с измененным css файлом из их сайта.
flexslider.css 3,77К 505 Количество загрузок:
Загрузите себе на сайт этот файл стилей и еще два файла.
А именно:
jquery.flexslider.js,
bg_direction_nav.png
файл с скриптом и файл с кнопками.
Теперь в редакторе тем. (Сайт-Редактор тем).
Открыть файл HTML.
После кода:
<!-- Скрипты магазина --> <script type="text/javascript" src="{ASSETS_JS_PATH}main.js"></script>
Вставить:
<!-- Place somewhere in the <head> of your document --> <link rel="stylesheet" href="{ASSETS_STYLES_PATH}flexslider.css" type="text/css"> <script src="{ASSETS_JS_PATH}jquery.flexslider.js"></script> <!-- Place in the <head>, after the three links --> <script type="text/javascript" charset="utf-8"> $(window).load(function() { $('.flexslider').flexslider(); }); </script>
Затем вставить код вывода слайдера до переменной {body}.
<!-- Place somewhere in the <body> of your page --> <div class="flexslider"> <ul class="slides"> <li> <img src="{ASSETS_IMAGES_PATH}slide1.jpg" /> </li> <li> <img src="{ASSETS_IMAGES_PATH}slide2.jpg" /> </li> <li> <img src="{ASSETS_IMAGES_PATH}slide3.jpg" /> </li> </ul> </div>Переменная {ASSETS_IMAGES_PATH} выводит путь до картинки которая загружена на ваш сайт.Если картинка загружена на ваш сайт то достаточно в коде указать имя картинки и переменную {ASSETS_IMAGES_PATH} перед именем картинки.Так же, возможно вам будет интересно эта тема.
http://forum.storela...дер/#entry32258
Удачи!
Темы с аналогичным тегами слайдер
Вопросы работы сервиса StoreLand →
Дизайн →
Шаблон Сказка →
Главная →
Убираем Цветной Баннер На СлайдереАвтор Гость_Foxis_10_* , 17 февр. 2021 слайдер |
|
|||
Вопросы работы сервиса StoreLand →
Дизайн →
Шаблон Нептун →
Главная →
Изменение Главного Баннера На СлайдерАвтор Гость_Firefly_* , 04 дек. 2019 Нептун, Слайдер, owl-slider |
|
|||
Вопросы работы сервиса StoreLand →
Дизайн →
Шаблон Сканди →
Изменение общей стилистики →
Изменение СлайдераАвтор Гость_TYURIKOFF_* , 21 марта 2019 слайдер |
|
|||
Вопросы работы сервиса StoreLand →
Дизайн →
Шаблон Лето →
Изменение общей стилистики →
Настройка СлайдераАвтор Гость_tovmarket_* , 30 окт. 2018 слайдер |
|
|||
Вопросы работы сервиса StoreLand →
Дизайн →
Шаблон Рассвет →
Как Изменить Расположение Объектов На Первом ЭкранеАвтор Гость_DMC_* , 19 окт. 2018 шапка, слайдер, логотип |
|
Количество пользователей, читающих эту тему: 0
0 пользователей, 0 гостей, 0 анонимных