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


Изменение На Главной


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

#1 vadim777

vadim777

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

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

Отправлено 13 Февраль 2015 - 19:42

Как добавить таки информационные блоки как в теме цитрус под баннер ?Снимок экрана 2015-02-13 в 19.41.34.png

#2 Vaccina

Vaccina

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

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

Отправлено 14 Февраль 2015 - 02:13

В необходимом месте шаблона HTML вставьте:
<!-- Баннеры на главной -->
		{% IF index_page %}
		<div class="yt-bannertop">
		  <div class="container">
			<div class="row">
			  <div class="banner-top">
				<ul>
				  <li class="li-1 col-lg-4 col-md-4 col-sm-4 col-xs-12"><a class="banner-top-img" href="#"><img src="{ASSETS_IMAGES_PATH}ico1-banner-top2.jpg?design=orange" alt=""></a>
					<div class="li1-content"><a href="#">Бесплатная доставка!</a>
					  <p>Доставка по городу и области Бесплатна!</p>
					</div>
				  </li>
				  <li class="li-2 col-lg-4 col-md-4 col-sm-4 col-xs-12"><a class="banner-top-img" href="#"><img src="{ASSETS_IMAGES_PATH}ico2-banner-top2.jpg?design=orange" alt=""></a>
					<div class="li2-content"><a href="#">30 дней Гарантии</a>
					  <p>Вы можете вернуть товар в течении 30 дней после получения заказа</p>
					</div>
				  </li>
				  <li class="li-3 col-lg-4 col-md-4 col-sm-4 col-xs-12"><a class="banner-top-img" href="#"><img src="{ASSETS_IMAGES_PATH}ico3-banner-top2.jpg?design=orange" alt=""></a>
					<div class="li3-content"><a href="#">Прием заказов 24/7</a>
					  <p>Оформите заказ в интернет-магазине "{SETTINGS_STORE_NAME}" Прямо сейчас!</p>
					</div>
				  </li>
				</ul>
			  </div>
			</div>
		  </div>
		</div>
		{% ENDIF %}
		<!-- /END Баннеры на главной -->

а в main.css разместите:
/* Баннеры на главной */
.yt-bannertop {background-color:#f3f3f3;padding:50px 0 30px;}
.yt-bannertop .banner-top {display: block;margin: 0;}
.yt-bannertop .banner-top ul li {background-repeat: no-repeat;float: left;list-style:none;}
.yt-bannertop .banner-top ul li a.banner-top-img {float: left;margin-right: 30px;margin-bottom:20px;position: relative;display: block;overflow: hidden;}
.yt-bannertop .banner-top ul li a.banner-top-img:before {content: "";height: 100%;left: 0;position: absolute;top: 0;width: 100%;}
.yt-bannertop .banner-top ul li:hover a.banner-top-img:before {box-shadow: 0 0 0 5px rgba(255, 255, 255, 0.4) inset;}
.yt-bannertop .banner-top ul li div a {font-size: 200%;display: block;line-height: 100%;padding-bottom: 10px;font-weight: 300;font-family: 'Open Sans Condensed', sans-serif;}
.yt-bannertop .banner-top ul li:hover a.banner-top-img img {transform: rotateY(360deg);-ms-transform: rotateY(360deg);-moz-transform: rotateY(360deg);-webkit-transform: rotateY(360deg);-o-transform: rotateY(360deg);}





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

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