0  /  2

Структура дизайна

Шапка сайта (header)

В решении "Космос" есть множество вариантов отображения шапки сайта.
К изменениям шапки относится изменение отображения самой шапки, а так же отображение меню сайта.

Что бы посмотреть как они смотрятся, перейдите на демо сайт: http://cosmos.marsdigital.ru/corp/
И слева Вы можете нажать "шестеренку" и изменить шапку на большую или маленькую.

Большая шапка


Большая шапка Космос

Маленькая шапка

Маленькая шапка Космос



Настройки меню сайта



Меню в цвет темы космос

Меню в цвет темы космос



Меню с подзаголовками

Меню с подзаголовками



Меню с большими иконками

Меню с большими иконками



Меню с выделением рамкой

Меню с выделением рамкой



 Меню с выделением фона

Меню с выделением фона

 


Меню с иконками

Меню с иконками



Тёмное меню

Тёмное меню


Изменение промо-полосы (Page Promo)

Вы можете изменить промо полосу. И сделать её любой по своему желанию.
Примеры отображения промо-полосы:

Промо полоса "По центру"

Промо полоса. По центру.

Промо полоса "в 4 колонки с иконками"

Промо полоса. 4 колонки

Тёмная промо полоса

Темная промо полоса. Выравнивание слева.

Для редактирования промо полосы, Вам следует включить режим правки.

Наведите курсор мыши на промо область и кликните по всплывшему пункту меню Изменить область:

Редактировать промо область.

Откроется окно редактировани, в котором Вы сможете расположить свой текст.

Редактирование промо области

Код для разных типов промо блоков.

Промо полоса "По центру"

<div class="promo promo-light promo-full landing-promo center">
	<div class="container clearfix">
		<h3>Информационно-консалтинговое агентство "Космос"</h3>
		Оказываем своим клиентам квалифицированную помощь с 2008 года
	</div>
</div>
	

Промо полоса "в 4 колонки с иконками"

<div class="promo promo-light promo-full landing-promo">
	<div class="container clearfix">

		<div class="col_one_fourth nobottommargin">
			<div class="feature-box fbox-plain fbox-dark fbox-small">
				<div class="fbox-icon">
					<i class="icon-thumbs-up2"></i>
				</div>
				<h3>Клиенты довольны</h3>
				<p class="notopmargin">Каждый клиент остался доволен на все 100%</p>
			</div>
		</div>

		<div class="col_one_fourth nobottommargin">
			<div class="feature-box fbox-plain fbox-dark fbox-small">
				<div class="fbox-icon">
					<i class="icon-credit-cards"></i>
				</div>
				<h3>Рассрочка платежей</h3>
				<p class="notopmargin">Идем каждому клиенту навстречу, Специальные предложения</p>
			</div>
		</div>

		<div class="col_one_fourth nobottommargin">
			<div class="feature-box fbox-plain fbox-dark fbox-small">
				<div class="fbox-icon">
					<i class="icon-truck2"></i>
				</div>
				<h3>Вывоз мусора</h3>
				<p class="notopmargin">Мы вывозим мусор после всех работ</p>
			</div>
		</div>

		<div class="col_one_fourth nobottommargin col_last">
			<div class="feature-box fbox-plain fbox-dark fbox-small">
				<div class="fbox-icon">
					<i class="icon-undo"></i>
				</div>
				<h3>Сотрудничество</h3>
				<p class="notopmargin">Делаем что бы каждый клиент возвращался</p>
			</div>
		</div>

	</div>
</div>
	

Что бы сделать полосу тёмной, достаточно добавить класс "promo-dark" к самому верхнему тегу "div"