Перейти к содержимому


Как Убрать Слайд?


  • Авторизуйтесь для ответа в теме
Сообщений в теме: 25

#1 Stox

Stox

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

  • Пользователи
  • PipPip
  • 14 сообщений

Отправлено 10 Июнь 2018 - 17:41

Здравствуйте.

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

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

  • change.png


#2 Stox

Stox

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

  • Пользователи
  • PipPip
  • 14 сообщений

Отправлено 10 Июнь 2018 - 21:11

Уже сам разобрался, извините.

#3 Stox

Stox

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

  • Пользователи
  • PipPip
  • 14 сообщений

Отправлено 14 Июнь 2018 - 10:56

Здравствуйте.

Добавил слайд на главную страницу, фото оказалось маленьким для ПК, но нормальным для мобильной версии, затем поставил фото большего разрешения, но в мобильной версии стал виден лишь фрагмент фотографии. Как сделать, чтобы один из двух одинаковых, но разных по размеру, слайдов показывался только в версии для ПК, а другой только в мобильной.


#4 Vaccina

Vaccina

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

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

Отправлено 20 Июнь 2018 - 05:53

Здравствуйте.

Зайдите в раздел Сайт - Редактор шаблонов - main.css - найдите:
@media all and (max-width: 481px) {
.col-smb-12 {width: 100%;}

замените на:
@media all and (max-width: 481px) {
#slideshow .item {background-size: contain !important;}
.col-smb-12 {width: 100%;}


#5 Stox

Stox

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

  • Пользователи
  • PipPip
  • 14 сообщений

Отправлено 20 Июнь 2018 - 08:25

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

#6 Vaccina

Vaccina

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

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

Отправлено 20 Июнь 2018 - 09:00

Можно сделать отдельно два слайдера и отображать каждый из них в зависимости от разрешения экрана, такой вариант вас устроит?

#7 Stox

Stox

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

  • Пользователи
  • PipPip
  • 14 сообщений

Отправлено 20 Июнь 2018 - 09:53

Да.

#8 Vaccina

Vaccina

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

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

Отправлено 21 Июнь 2018 - 02:33

Здравствуйте.

Зайдите в раздел Сайт - Редактор шаблонов - HTML - найдите:
	{% IF index_page %}
	<!-- Слайдшоу-->
	<div id="slideshow">
	  <div class="preloader"><span class="content-loading"></span></div>
	  <div class="slider owl-carousel">
		<div class="item" style="background:url({ASSETS_IMAGES_PATH}slide1.jpg?design=tourism) 25% top no-repeat;">
		  <div class="image"><img src="{ASSETS_IMAGES_PATH}slide1.jpg?design=tourism" /></div>
		  <div class="content" data-animation-in="fadeInUp" data-animation-out="animate-out fadeOutDown">
			<div class="container">
			  <div class="text-content right">
				<h2>Большой выбор</h2>
				<p>кроссовок на каждый день</p>
				<a href="{CATALOG_URL}" class="button big">Каталог</a>
			  </div>
			</div>
		  </div>
		</div>
		<div class="item" style="background:url({ASSETS_IMAGES_PATH}slide2.jpg?design=tourism) 80% top no-repeat;">
		  <div class="image"><img src="{ASSETS_IMAGES_PATH}slide2.jpg?design=tourism" /></div>
		  <div class="content" data-animation-in="fadeInUp" data-animation-out="animate-out fadeOutDown">
			<div class="container">
			  <div class="text-content left">
				<h2>Экономьте с нами</h2>
				<p>Скидки на новую коллекцию</p>
				<a href="{CATALOG_URL}" class="button big">Каталог</a>
			  </div>
			</div>
		  </div>
		</div>
	  </div>
	</div>
    
    
замените на:
	{% IF index_page %}
	<!-- Слайдшоу-->
	<div id="slideshow">
	  <div class="preloader"><span class="content-loading"></span></div>
	  <div class="slider owl-carousel">
		<div class="item" style="background:url({ASSETS_IMAGES_PATH}slide1.jpg?design=tourism) 25% top no-repeat;">
		  <div class="image"><img src="{ASSETS_IMAGES_PATH}slide1.jpg?design=tourism" /></div>
		  <div class="content" data-animation-in="fadeInUp" data-animation-out="animate-out fadeOutDown">
			<div class="container">
			  <div class="text-content right">
				<h2>Большой выбор</h2>
				<p>кроссовок на каждый день</p>
				<a href="{CATALOG_URL}" class="button big">Каталог</a>
			  </div>
			</div>
		  </div>
		</div>
		<div class="item" style="background:url({ASSETS_IMAGES_PATH}slide2.jpg?design=tourism) 80% top no-repeat;">
		  <div class="image"><img src="{ASSETS_IMAGES_PATH}slide2.jpg?design=tourism" /></div>
		  <div class="content" data-animation-in="fadeInUp" data-animation-out="animate-out fadeOutDown">
			<div class="container">
			  <div class="text-content left">
				<h2>Экономьте с нами</h2>
				<p>Скидки на новую коллекцию</p>
				<a href="{CATALOG_URL}" class="button big">Каталог</a>
			  </div>
			</div>
		  </div>
		</div>
	  </div>
	  
			<div class="mobile slider owl-carousel">
		<div class="item" style="background:url({ASSETS_IMAGES_PATH}minislide1.jpg?design=tourism) 25% top no-repeat;">
		  <div class="image"><img src="{ASSETS_IMAGES_PATH}minislide1.jpg?design=tourism" /></div>
		  <div class="content" data-animation-in="fadeInUp" data-animation-out="animate-out fadeOutDown">
			<div class="container">
			  <div class="text-content right">
				<h2>Большой выбор</h2>
				<p>кроссовок на каждый день</p>
				<a href="{CATALOG_URL}" class="button big">Каталог</a>
			  </div>
			</div>
		  </div>
		</div>
		<div class="item" style="background:url({ASSETS_IMAGES_PATH}minislide2.jpg?design=tourism) 80% top no-repeat;">
		  <div class="image"><img src="{ASSETS_IMAGES_PATH}minislide2.jpg?design=tourism" /></div>
		  <div class="content" data-animation-in="fadeInUp" data-animation-out="animate-out fadeOutDown">
			<div class="container">
			  <div class="text-content left">
				<h2>Экономьте с нами</h2>
				<p>Скидки на новую коллекцию</p>
				<a href="{CATALOG_URL}" class="button big">Каталог</a>
			  </div>
			</div>
		  </div>
		</div>
	  </div>
	</div>
    
Вместо minislide1.jpg и minislide2.jpg укажите названия мобильных баннеров.

Далее зайдите в main.css - найдите:
/*** Баннеры ***/
#banners {display: inline-block;position: relative;background-color:#fff;width: 100%;margin: 10px 0;}
#banners .banner-left {float: left;width: 50%;padding-right: 5px;}

перед ним пропишите:
#slideshow .mobile{display: none;}

далее найдите:
#promo {background-attachment: local;}
}
@media all and (max-width: 641px) {

после него пропишите:
#slideshow .slider{display: none;}
#slideshow .mobile{display: block;}


#9 Stox

Stox

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

  • Пользователи
  • PipPip
  • 14 сообщений

Отправлено 21 Июнь 2018 - 07:07

Спасибо, но можно как-то убрать верхнюю белую полосу и сделать как было раньше (первый слайд)?

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

  • first1.png
  • second2.png


#10 Vaccina

Vaccina

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

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

Отправлено 21 Июнь 2018 - 07:37

Удалите измененный код в шаблоне HTML, скопируйте его с инструкции в блокнот и уже в блокноте скопируйте и вставьте обратно в шаблон, у вас скопировались отступы создающие пробел, который образовал белую полосу.
Screenshot-2018-6-21 Администрирование интернет-магазина Редактор шаблонов.png

#11 Stox

Stox

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

  • Пользователи
  • PipPip
  • 14 сообщений

Отправлено 14 Июль 2018 - 06:22

Как убрать белую полоску в мобильной версии?

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

  • IMG_20180714_061204.jpg


#12 Vaccina

Vaccina

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

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

Отправлено 14 Июль 2018 - 07:45

Здравствуйте.

Зайдите в раздел Сайт - Редактор шаблонов - main.css - найдите:
@media all and (max-width: 481px) {
.col-smb-12 {width: 100%;}

замените на:
@media all and (max-width: 481px) {
.col-smb-12 {width: 100%;}
#slideshow .item {min-height: 82vh;}


#13 Stox

Stox

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

  • Пользователи
  • PipPip
  • 14 сообщений

Отправлено 14 Июль 2018 - 10:45

Код изменил, но белая полоса осталась.

#14 metry

metry

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

  • Модераторы
  • 884 сообщений

Отправлено 14 Июль 2018 - 17:03

Добрый день. Для внесения изменений зайдите в Редактор шаблонов-->main.css и найдите:
#slideshow .item {min-height: 82vh;}
замените на:
#slideshow .item {min-height: 64vh;}


#15 Stox

Stox

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

  • Пользователи
  • PipPip
  • 14 сообщений

Отправлено 15 Июль 2018 - 08:08

При заходе на мобильную версию сайта иногда между слайдами вылезают белые полосы с надписью "реклама". Как их убрать?

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

  • IMG_20180715_075110.jpg


#16 Firefly

Firefly

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

  • Модераторы
  • 3 810 сообщений

Отправлено 15 Июль 2018 - 10:08

Просмотр сообщенияStox (15 Июль 2018 - 08:08) писал:

При заходе на мобильную версию сайта иногда между слайдами вылезают белые полосы с надписью "реклама". Как их убрать?

Здравствуйте.
Проверьте, что установлено на телефоне, в коде этих полос с таким текстом нет.

#17 kv09483

kv09483

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

  • Пользователи
  • PipPipPipPip
  • 225 сообщений

Отправлено 22 Август 2018 - 10:29

Здравствуйте! Аккаунт SL-333527 . Скажите, пожалуйста, а как удалить второй слайд на главной странице? Оставить только тот, где подслайдер слева? Спасибо!!!

Блин, оставить где надпись справа... Извините

#18 stasia

stasia

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

  • Модераторы
  • 575 сообщений

Отправлено 22 Август 2018 - 11:19

Просмотр сообщенияkv09483 (22 Август 2018 - 10:29) писал:

Здравствуйте! Аккаунт SL-333527 . Скажите, пожалуйста, а как удалить второй слайд на главной странице? Оставить только тот, где подслайдер слева? Спасибо!!!

Блин, оставить где надпись справа... Извините

Здравствуйте.

Зайдите в шаблон html и найдите код:

<div class="item" style="background:url({ASSETS_IMAGES_PATH}slide1.jpg?design=tourism) 25% top no-repeat;">
		  <div class="image"><img src="{ASSETS_IMAGES_PATH}slide1.jpg?design=tourism" /></div>
		  <div class="content" data-animation-in="fadeInUp" data-animation-out="animate-out fadeOutDown">
			<div class="container">
			  <div class="text-content right"> 
				<h2>Wenger в России</h2>
				<p>официальный сайт интернет - магазина</p>
				<a href="{CATALOG_URL}" class="button big">Каталог продукции</a>
			  </div>
			</div>
		  </div>
		</div>

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

<!--<div class="item" style="background:url({ASSETS_IMAGES_PATH}slide1.jpg?design=tourism) 25% top no-repeat;">
		  <div class="image"><img src="{ASSETS_IMAGES_PATH}slide1.jpg?design=tourism" /></div>
		  <div class="content" data-animation-in="fadeInUp" data-animation-out="animate-out fadeOutDown">
			<div class="container">
			  <div class="text-content right"> 
				<h2>Wenger в России</h2>
				<p>официальный сайт интернет - магазина</p>
				<a href="{CATALOG_URL}" class="button big">Каталог продукции</a>
			  </div>
			</div>
		  </div>
		</div>-->


#19 kv09483

kv09483

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

  • Пользователи
  • PipPipPipPip
  • 225 сообщений

Отправлено 22 Август 2018 - 12:19

У меня не получилось, он все равно остается. Как совсем убрать слайдер в котором подслайдер с левой стороны? Спасибо!

#20 RayLi

RayLi

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

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

Отправлено 22 Август 2018 - 12:26

Просмотр сообщенияkv09483 (22 Август 2018 - 12:19) писал:

У меня не получилось, он все равно остается. Как совсем убрать слайдер в котором подслайдер с левой стороны? Спасибо!

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




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

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