Отключен JavaScript

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

0

Объединение 3-4 Баннера В Один Баннер

Автор metry, 27 янв. 2021 17:30

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

В этой теме нет ответов

#1 metry

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

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

Отправлено 27 Январь 2021 - 17:30

Для внесения изменений зайдите в Редактор шаблонов-->HTML и найдите:

	<!-- Баннеры -->
	<div id="banners">
	  <div class="container">
		<div class="banners-wrapper">
		  <div class="preloader"><span class="content-loading"></span></div>
		  <div class="col-left">
		   
			<div class="banner-left">
			  <div class="banner-image lozad" data-background-image="{ASSETS_IMAGES_PATH}banner1.jpg">
				<div class="content big">
				  <h3>Новый Iphone XS</h3>
				  <h4>Уже здесь</h4>
				  <a href="{CATALOG_URL}" class="button">Подробнее</a>
				</div>
			  </div>
			</div>
			<div class="banner-left">
			  <div class="banner-image lozad" data-background-image="{ASSETS_IMAGES_PATH}banner2.jpg">
				<div class="content big">
				  <h3>Стильные часы</h3>
				  <h4>Выберите свой аксессуар</h4>
				  <a href="{CATALOG_URL}" class="button">Каталог</a>
				</div>
			  </div>
			</div>
		   
		  </div>
		  <div class="col-right">
 
			  <div class="banner banner-top">
				<div class="banner-image lozad" data-background-image="{ASSETS_IMAGES_PATH}banner3.jpg">
				  <div class="content small">
					<h3>Распродажа</h3>
					<h4>Скидки до 70%</h4>
					<a href="{CATALOG_URL}" class="button">Каталог</a>
				  </div>
				</div>
			  </div>
			 
			  <div class="banner banner-bottom">
				<div class="banner-image bg">
				  <div class="content small">
					<h3>Последний</h3>
					<h4>Шанс купить</h4>
					<a href="{CATALOG_URL}" class="button">Каталог</a>
				  </div>
				</div>
			  </div>
		   
		  </div>		 
		</div>
	  </div>
	</div>

замените на:

   
	<!-- Баннеры -->
	<div id="banners">
	  <div class="container">
		<div class="banners-wrapper">
		  <div class="preloader"><span class="content-loading"></span></div>
		  <div class="col-left">
		   
			<div class="banner-left">
			  <div class="banner-image lozad" data-background-image="{ASSETS_IMAGES_PATH}banner1.jpg">
				<div class="content big">
				  <h3>Новый Iphone XS</h3>
				  <h4>Уже здесь</h4>
				  <a href="{CATALOG_URL}" class="button">Подробнее</a>
				</div>
			  </div>
			</div>
			<div class="banner-left">
			  <div class="banner-image lozad" data-background-image="{ASSETS_IMAGES_PATH}banner2.jpg">
				<div class="content big">
				  <h3>Стильные часы</h3>
				  <h4>Выберите свой аксессуар</h4>
				  <a href="{CATALOG_URL}" class="button">Каталог</a>
				</div>
			  </div>
			</div>
		   
		  <div class="banner-left">
			  <div class="banner-image lozad" data-background-image="{ASSETS_IMAGES_PATH}banner3.jpg">
				<div class="content big">
				  <h3>Распродажа</h3>
				  <h4>Скидки до 70%</h4>
				  <a href="{CATALOG_URL}" class="button">Каталог</a>
				</div>
			  </div>
			</div>
		   
		  </div>
		</div>
	  </div>
	</div>

далее зайдите в Редактор шаблонов-->main.css и найдите:

/*** Баннеры ***/
#banners {display: inline-block;position: relative;width: 100%;margin-bottom: 20px}
#banners .banners-wrapper {position: relative;display: -webkit-box;display: -ms-flexbox;display: flex;-ms-flex-wrap: wrap;flex-wrap: wrap}
#banners .col-left {float: left;width: 60%}
#banners .col-right {display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-orient: vertical;-webkit-box-direction: normal;-ms-flex-direction: column;flex-direction: column;-ms-flex-wrap: wrap;flex-wrap: wrap;float: left;width: 40%}
#banners .banner-left {float: left;width: 50%;height: 100%;height: 580px;padding-right: 15px;}

замените на:

/*** Баннеры ***/
#banners {display: inline-block;position: relative;width: 100%;margin-bottom: 20px}
#banners .banners-wrapper {position: relative;display: -webkit-box;display: -ms-flexbox;display: flex;-ms-flex-wrap: wrap;flex-wrap: wrap}
#banners .col-left {float: left;width: 100%; display: flex; flex-direction: row; flex-wrap: wrap; justify-content: space-between; align-items: center; align-content: center;}
#banners .col-right {display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-orient: vertical;-webkit-box-direction: normal;-ms-flex-direction: column;flex-direction: column;-ms-flex-wrap: wrap;flex-wrap: wrap;float: left;width: 40%}
#banners .banner-left {float: left;width: 32.8%;height: 100%;height: 580px;}