Современный стиль поиска для сайта uCoz
Если вам не устроил стандартный поиск, просто не подходит по дизайн или вам нужен по стилистике другой и рабочий, то есть оригинальный. Это современный стиль поиска внутри по тегам, который можно поставить в любое место и он будет производить поиск по всем модулям. Так как в коде по умолчанию выставлено "search" что все учитывает. Если у вас один блог, или вообще один модуль, и чтоб не загромождать лишней информацией, то в поиске выставите его, и он только там будет находить запрашиваемую информацию. Есть там одна ссылка на изображение, просто снял со своего сайта и поставил, вы можете найти что то по оригинальнее и поставить, но изначально узнайте размеры кнопки. То что он полностью рабочий, то проверен на тестовом сайте. Также у него идут стили, и если ставить на фон интернет ресурса, то нужно его подогнать по оттенку. Можно вообще сделать так. что как будто он углублен, это визуально смотреться будет. Также сделать красивый обвод под один или два пикселя, вообщем здесь вы сами можете его преобразить, чтоб влился в портал как родной. Так он будет по умолчанию: Приступаем к установке: Для начало закинем стили в CSS и здесь можно в самый низ. Код input[type=search] { background: #ededed url(http://zornet.ru/Ajaxoskrip/Forma_knopk/ZR/GpxWt03.png) no-repeat 9px center; border: solid 1px #ccc; padding: 9px 10px 9px 32px; width: 250px; -webkit-border-radius: 10em; -moz-border-radius: 10em; border-radius: 10em; -webkit-transition: all .5s; -moz-transition: all .5s; transition: all .5s; Потом находим место, для установке, где будет он, лучше на видном месте и устанавливаем код. Код <?if($SEARCH_FORM$)?><form class="inputbox" action="/search/" method="get"> <input required="required" name="q" autocomplete="off" minlength="3" placeholder="Поиск" type="search"> </form> <?endif?> Если у вас стандартный шаблон, а там основном идет вверх сайта, то вам только нужно убрать оператор и скопировать код, без операторов, что в начале и в конце идут и установить, и потом по стилям настроить. |
Поделиться в социальных сетях
Материал разместил
Комментарии: 7 | |
| |