На этот раз мы будем добавлять витжет поиска прямо справа от заголовка сайта.
Для начала создадим зону в файле Theme.txt, назовем её Search.
Определим её в разметке страницы Layout.cshtml, для этого вставим следующий код…
@if (Model.Header != null) {
<header id="layout-header" class="group">
<div id="header">
@Zone(Model.Header)
</div>
</header>
}
@if (Model.Search != null) {
<div id="Search" class="group">
@Zone(Model.Search)
</div>
}
@if (Model.Navigation != null) {
<div id="layout-navigation" class="group">
@Zone(Model.Navigation)
</div>
}
Теперь добавим css-стиль для нашей зоны:
/* Search */
#Search {
width:960px;
margin:0 auto;
padding: 20px 0 20px 0;
}
И изменим позиционирование элемента header с relative на absolute.
.zone-header { padding: 30px 0 30px 12px; position: absolute; }
Даже не спрашивайте что это, я сам смутно понимаю. Этот хук мне подсказал Kosfiz, за что ему очередное спасибо!
Остается дело за малым — устанавливаем плагины Indexing, Lucene и Search. Добавляем форму поиска в витжет и размещаем его, в созданной нами, зоне Search.
Вот и все, результат вы можете увидеть на скриншоте ниже

