На этот раз мы будем добавлять витжет поиска прямо справа от заголовка сайта.
Для начала создадим зону в файле 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.
Вот и все, результат вы можете увидеть на скриншоте ниже