Отключен JavaScript

У вас отключен JavaScript. Некоторые возможности системы не будут работать. Пожалуйста, включите JavaScript для получения доступа ко всем функциям.

0

Помогите С Бегущими Логотипами С Каруселью На Главную На Шаблон Лето

Автор cgss, 28 окт. 2015 13:47

помогите карусель

Авторизуйтесь для ответа в теме

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

#1 cgss

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

Пользователи
12 сообщений

Отправлено 28 Октябрь 2015 - 13:47

Подскажи карусель, где скачать как поставить и настроить на сайт http://eltehmart.ru/ под блок с "Бесплатная доставка" "100% гарантия возврата" хочу поставить карусель без дополнительных элементов управления , просто чтобы динамически бежали с право на лева логотипы представленных брендов на белом фото, карусель растянуть на всю ширину

Прикрепленные изображения

Наверх

#2 Юля123

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

Пользователи
2 567 сообщений

Отправлено 28 Октябрь 2015 - 15:50

Здравствуйте, напишите, пожалуйста, номер вашего аккаунта

Наверх

#3 Юля123

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

Пользователи
2 567 сообщений

Отправлено 28 Октябрь 2015 - 16:09

cgss (28 Октябрь 2015 - 13:47) писал:

Подскажи карусель, где скачать как поставить и настроить на сайт http://eltehmart.ru/ под блок с "Бесплатная доставка" "100% гарантия возврата" хочу поставить карусель без дополнительных элементов управления , просто чтобы динамически бежали с право на лева логотипы представленных брендов на белом фото, карусель растянуть на всю ширину

Для того, чтобы установить карусель, Вам необходимо сделать следующее:

1) Скачать архив;

2) Извлечь все файлы из архива на вашем компьютере;

3) Закачать файлы flexslider.css, jquery.flexslider.js в разделе редактора шаблонов;

4) Далее в шаблоне "HTML" после кода


<!-- Скрипты магазина -->
<script type="text/javascript" src="{ASSETS_JS_PATH}forall.js?design=summer"></script>
<script type="text/javascript" src="{FORALL_STYLES_PATH}fancybox/2.1.5/jquery.fancybox.js"></script>
<script type="text/javascript" src="{ASSETS_JS_PATH}main.js?design=summer"></script>

добавьте код

<script type="text/javascript" src="{ASSETS_JS_PATH}jquery.flexslider.js"></script>
<link rel="stylesheet" href="{ASSETS_STYLES_PATH}flexslider.css" type="text/css" />
<script type="text/javascript">
$(function(){
SyntaxHighlighter.all();
});
$(window).load(function(){
$('.flexslider').flexslider({
animation: "slide",
start: function(slider){
$('body').removeClass('loading');
}
});
});
</script>

4) Затем найдите код:


<!-- /END Информационный блок -->

После него вставьте код

<section class="slider">
	 <div class="flexslider">
		 <ul class="slides">
		 <li>
		 <img src="ссылка1" />

		 </li>
		 <li>
		 <img src="ссылка2" />

		 </li>
		 <li>
		 <img src="ссылка3" />

		 </li>
		 <li>
		 <img src="ссылка4" />

		 </li>
		 </ul>
	 </div>
	 </section>

и заменяйте ссылки на свои картинки в этом коде.

Чтобы изменить стили слайдера, напишите нам, что Вы конкретно хотите изменить.

Наверх

#4 cgss

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

Пользователи
12 сообщений

Отправлено 28 Октябрь 2015 - 16:59

Юля123 (28 Октябрь 2015 - 15:50) писал:

Здравствуйте, напишите, пожалуйста, номер вашего аккаунта

SL-151411

Наверх

#5 Юля123

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

Пользователи
2 567 сообщений

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

cgss (28 Октябрь 2015 - 16:59) писал:

SL-151411

Уточните, пожалуйста, какой сайт Вы хотите изменить? Тот, что из первого сообщения http://eltehmart.ru/ или же сайт, аккаунт которого вы прислали http://homesensor.ru/ ? Я вам описала инструкцию для сайта из первого сообщения.

Наверх

#6 cgss

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

Пользователи
12 сообщений

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

Юля123 (28 Октябрь 2015 - 16:09) писал:

Для того, чтобы установить карусель, Вам необходимо сделать следующее:

1) Скачать архив;

2) Извлечь все файлы из архива на вашем компьютере;

3) Закачать файлы flexslider.css, jquery.flexslider.js в разделе редактора шаблонов;

4) Далее в шаблоне "HTML" после кода


<!-- Скрипты магазина -->
<script type="text/javascript" src="{ASSETS_JS_PATH}forall.js?design=summer"></script>
<script type="text/javascript" src="{FORALL_STYLES_PATH}fancybox/2.1.5/jquery.fancybox.js"></script>
<script type="text/javascript" src="{ASSETS_JS_PATH}main.js?design=summer"></script>

добавьте код

<script type="text/javascript" src="{ASSETS_JS_PATH}jquery.flexslider.js"></script>
<link rel="stylesheet" href="{ASSETS_STYLES_PATH}flexslider.css" type="text/css" />
<script type="text/javascript">
$(function(){
SyntaxHighlighter.all();
});
$(window).load(function(){
$('.flexslider').flexslider({
animation: "slide",
start: function(slider){
$('body').removeClass('loading');
}
});
});
</script>

4) Затем найдите код:


<!-- /END Информационный блок -->

После него вставьте код

<section class="slider">
	 <div class="flexslider">
		 <ul class="slides">
		 <li>
		 <img src="ссылка1" />

		 </li>
		 <li>
		 <img src="ссылка2" />

		 </li>
		 <li>
		 <img src="ссылка3" />

		 </li>
		 <li>
		 <img src="ссылка4" />

		 </li>
		 </ul>
	 </div>
	 </section>

и заменяйте ссылки на свои картинки в этом коде.

Чтобы изменить стили слайдера, напишите нам, что Вы конкретно хотите изменить.

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

Юля123 (28 Октябрь 2015 - 17:19) писал:

Уточните, пожалуйста, какой сайт Вы хотите изменить? Тот, что из первого сообщения http://eltehmart.ru/ или же сайт, аккаунт которого вы прислали http://homesensor.ru/ ? Я вам описала инструкцию для сайта из первого сообщения.

сайт http://eltehmart.ru/ он на том же аке что и хоумесенсор

Прикрепленные изображения

Наверх

#7 Юля123

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

Пользователи
2 567 сообщений

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

cgss (28 Октябрь 2015 - 17:26) писал:

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

сайт http://eltehmart.ru/ он на том же аке что и хоумесенсор

Напишите, пожалуйста, номер аккаунта этого магазина.

Наверх

#8 cgss

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

Пользователи
12 сообщений

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

Юля123 (28 Октябрь 2015 - 17:41) писал:

Напишите, пожалуйста, номер аккаунта этого магазина.

SL-358456

Наверх

#9 cgss

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

Пользователи
12 сообщений

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

cgss (28 Октябрь 2015 - 17:44) писал:

SL-358456

Юля123 (28 Октябрь 2015 - 17:41) писал:

Напишите, пожалуйста, номер аккаунта этого магазина.

он должен быть только на главной, и по перестал работать основной слайдер, фото на нем растянулась в маштабе

Наверх

#10 Юля123

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

Пользователи
2 567 сообщений

Отправлено 28 Октябрь 2015 - 18:01

cgss (28 Октябрь 2015 - 17:44) писал:

SL-358456

Хорошо, проделайте все, что описано в инструкции выше, кроме 4 пункта, вместо него произведите изменения:

найдите код

<!-- Скрипты магазина -->
<script type="text/javascript" src="{ASSETS_JS_PATH}forall.js?design=summer"></script>
<script type="text/javascript" src="{FORALL_STYLES_PATH}fancybox/2.1.5/jquery.fancybox.js"></script>
<script type="text/javascript" src="{ASSETS_JS_PATH}main.js?design=summer"></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>

чтобы было несколько элементов, добавьте несколько картинок подряд:

<li>
				 <img src="ссылка1" />
				 <img src="ссылка2" />
				 <img src="ссылка3" />

</li>

Наверх

#11 cgss

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

Пользователи
12 сообщений

Отправлено 28 Октябрь 2015 - 18:47

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

Юля123 (28 Октябрь 2015 - 18:01) писал:

Хорошо, проделайте все, что описано в инструкции выше, кроме 4 пункта, вместо него произведите изменения:

найдите код

<!-- Скрипты магазина -->
<script type="text/javascript" src="{ASSETS_JS_PATH}forall.js?design=summer"></script>
<script type="text/javascript" src="{FORALL_STYLES_PATH}fancybox/2.1.5/jquery.fancybox.js"></script>
<script type="text/javascript" src="{ASSETS_JS_PATH}main.js?design=summer"></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>

чтобы было несколько элементов, добавьте несколько картинок подряд:

<li>
				 <img src="ссылка1" />
<img src="ссылка2" />
<img src="ссылка3" />

</li>

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

Прикрепленные изображения

Наверх

#12 cgss

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

Пользователи
12 сообщений

Отправлено 28 Октябрь 2015 - 19:16

Юля123 (28 Октябрь 2015 - 18:01) писал:

Хорошо, проделайте все, что описано в инструкции выше, кроме 4 пункта, вместо него произведите изменения:

найдите код

<!-- Скрипты магазина -->
<script type="text/javascript" src="{ASSETS_JS_PATH}forall.js?design=summer"></script>
<script type="text/javascript" src="{FORALL_STYLES_PATH}fancybox/2.1.5/jquery.fancybox.js"></script>
<script type="text/javascript" src="{ASSETS_JS_PATH}main.js?design=summer"></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>

чтобы было несколько элементов, добавьте несколько картинок подряд:

<li>
				 <img src="ссылка1" />
<img src="ссылка2" />
<img src="ссылка3" />

</li>

осталось два вопроса, как убрать навигацию снизу и всплывающую по бокам и как оставить его только на главной, заранее благодарен

Наверх

#13 Vaccina

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

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

Отправлено 29 Октябрь 2015 - 02:09

В шаблоне HTML найдите:

<section class="slider">
		 <div class="flexslider">
				 <ul class="slides">
				 <li>
				 <img src="http://design.eltehmart.ru/21.png?8800" />
				 </li>
				 <li>
				 <img src="http://design.eltehmart.ru/q1.png?88006" />
				 </li>
			   
				 </ul>
		 </div>
		 </section>

замените на:

{% IF index_page %}
<section class="slider">
		 <div class="flexslider">
				 <ul class="slides">
				 <li>
				 <img src="http://design.eltehmart.ru/21.png?8800" />
				 </li>
				 <li>
				 <img src="http://design.eltehmart.ru/q1.png?88006" />
				 </li>
			   
				 </ul>
		 </div>
		 </section>
{% ENDIF %}

Далее в файле jquery.flexslider.js найдите:

// Primary Controls
	controlNav: true,			   //Boolean: Create navigation for paging control of each slide? Note: Leave true for manualControls usage
	directionNav: true,			 //Boolean: Create navigation for previous/next navigation? (true/false)
	prevText: "Previous",		   //String: Set the text for the "previous" directionNav item
	nextText: "Next",			   //String: Set the text for the "next" directionNav item

замените на:

// Primary Controls
	controlNav: false,			   //Boolean: Create navigation for paging control of each slide? Note: Leave true for manualControls usage
	directionNav: false,			 //Boolean: Create navigation for previous/next navigation? (true/false)
	prevText: "Previous",		   //String: Set the text for the "previous" directionNav item
	nextText: "Next",			   //String: Set the text for the "next" directionNav item

Наверх

#14 cgss

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

Пользователи
12 сообщений

Отправлено 29 Октябрь 2015 - 10:32

Vaccina (29 Октябрь 2015 - 02:09) писал:

В шаблоне HTML найдите:

<section class="slider">
		 <div class="flexslider">
				 <ul class="slides">
				 <li>
				 <img src="http://design.eltehmart.ru/21.png?8800" />
				 </li>
				 <li>
				 <img src="http://design.eltehmart.ru/q1.png?88006" />
				 </li>
			
				 </ul>
		 </div>
		 </section>

замените на:

{% IF index_page %}
<section class="slider">
		 <div class="flexslider">
				 <ul class="slides">
				 <li>
				 <img src="http://design.eltehmart.ru/21.png?8800" />
				 </li>
				 <li>
				 <img src="http://design.eltehmart.ru/q1.png?88006" />
				 </li>
			
				 </ul>
		 </div>
		 </section>
{% ENDIF %}

Далее в файле jquery.flexslider.js найдите:

// Primary Controls
controlNav: true,			 //Boolean: Create navigation for paging control of each slide? Note: Leave true for manualControls usage
directionNav: true,			 //Boolean: Create navigation for previous/next navigation? (true/false)
prevText: "Previous",		 //String: Set the text for the "previous" directionNav item
nextText: "Next",			 //String: Set the text for the "next" directionNav item

замените на:

// Primary Controls
controlNav: false,			 //Boolean: Create navigation for paging control of each slide? Note: Leave true for manualControls usage
directionNav: false,			 //Boolean: Create navigation for previous/next navigation? (true/false)
prevText: "Previous",		 //String: Set the text for the "previous" directionNav item
nextText: "Next",			 //String: Set the text for the "next" directionNav item

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

Наверх

#15 RayLi

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

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

Отправлено 29 Октябрь 2015 - 10:43

cgss (29 Октябрь 2015 - 10:32) писал:

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

Здравствуйте.
Сделайте, пожалуйста, следующее:
В шаблоне main.css найдите данный код:

#slider {
	position: relative;
	margin: 0 auto;
	top: 0px;
	left: 0px;
	width: 1920px;
	height: 699px;
	overflow: hidden;
	z-index: 1;
}

И замените его вот этим вот кодом:

#slider {
	position: relative;
	margin: 0 auto;
	top: 0px;
	left: 0px;
	width: 1920px;
	height: 500px !important;
	overflow: hidden;
	z-index: 1;
}

Наверх

#16 cgss

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

Пользователи
12 сообщений

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

RayLi (29 Октябрь 2015 - 10:43) писал:

Здравствуйте.
Сделайте, пожалуйста, следующее:
В шаблоне main.css найдите данный код:

#slider {
position: relative;
margin: 0 auto;
top: 0px;
left: 0px;
width: 1920px;
height: 699px;
overflow: hidden;
z-index: 1;
}

И замените его вот этим вот кодом:

#slider {
position: relative;
margin: 0 auto;
top: 0px;
left: 0px;
width: 1920px;
height: 500px !important;
overflow: hidden;
z-index: 1;
}

спасибо пригодится, но я наверное не так выразился, имел в виду слайдер карусель с лого брендов

Наверх

#17 Юля123

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

Пользователи
2 567 сообщений

Отправлено 29 Октябрь 2015 - 14:18

cgss (29 Октябрь 2015 - 13:20) писал:

спасибо пригодится, но я наверное не так выразился, имел в виду слайдер карусель с лого брендов

Зайдите в стили - flexslider.css, найдите код

.flexslider .slides img {
  width: 100%;
  display: block;
}

и уменьшите значение

  width: 100%;

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

Наверх

#18 cgss

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

Пользователи
12 сообщений

Отправлено 29 Октябрь 2015 - 15:02

Юля123 (29 Октябрь 2015 - 14:18) писал:

Зайдите в стили - flexslider.css, найдите код

.flexslider .slides img {
width: 100%;
display: block;
}

и уменьшите значение

width: 100%;

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

получилось но теперь он не по центру а с левой стороны

Прикрепленные изображения

Наверх

#19 Юля123

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

Пользователи
2 567 сообщений

Отправлено 29 Октябрь 2015 - 15:09

cgss (29 Октябрь 2015 - 15:02) писал:

получилось но теперь он не по центру а с левой стороны

в flexslider.css найдите код

.flexslider .slides img {
	width: 50%;
	display: block;
}

и замените его на

.flexslider .slides img {
	width: 50%;
	display: inline-block;
}

далее найдите код

.flexslider .slides > li {
  display: none;
  -webkit-backface-visibility: hidden;
}

и заменит его на вот этот код

.flexslider .slides > li {
	display: none;
	-webkit-backface-visibility: hidden;
	text-align: center;
}

Наверх

Обратно в Главная

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

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

Помогите С Бегущими Логотипами С Каруселью На Главную На Шаблон Лето

Прикрепленные изображения

Прикрепленные изображения

Прикрепленные изображения

Прикрепленные изображения

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

Войти

Google поиск