RSS сайта | RSS форума | RSS каталога файлов | RSS блога | Карта форума | Карта сайта | Все теги сайта
Главная страница

ГлавнаяФорумБлогФайлыОбратная связьО сайтеГостевая книгаПоиск
Настал ваш час, чтобы заработать реальные деньги на своем сайте
ВНИМАНИЕ!!!
Не зарегистрированные участники сайта ProSIdr, т.е. гости, НЕ могут оставлять сообщения на форуме. 
Для более корректного общения убедительная просьба
РЕГИСТРАЦИЯ или ВХОД
Реклама:
[ Новые сообщения · Заработай на своем сайте · Участники · Правила форума · Поиск · RSS ]
Страница 1 из 11
Модератор форума: Admin 
Форум "ProSIdr" » Все для Ucoz » Скрипты для Ucoz » Дизайн формы поиска для стандартных шаблонов системы uCoz (для стандартных шаблонов и не только)
Дизайн формы поиска для стандартных шаблонов системы uCoz
OlizinaДата: Вторник, 17.07.2012, 12.40.01 | Сообщение # 1
Сержант
Группа: Пользователи
Сообщений: 36
« »

Ранг:

Доп. данные:
Для опытов мы возьмём стандартный шаблон системы #211, форма поиска на главной странице находится в первом контейнере слева.

Смотрим скрин скрипта:



Делается это очень просто: открываем шаблон, в котором находится блок с формой поиска (в данном шаблоне системы это шаблон "Первый контейнер"), вот что мы нашли:

Код

<!-- <block6> -->
<?if($SEARCH_FORM$)?>
<table border="0" cellpadding="0" cellspacing="0" width="200">
<tr>
<td width="170" bgcolor="#318EB7" background="/.s/t/211/5.gif" class="blockT1"><span class="blockTitle"><!-- <bt> --><!--<s5171>-->Поиск<!--</s>--><!-- </bt> --></span></td>
<td width="30" bgcolor="#318EB7" background="/.s/t/211/5.gif" align="right"><img border="0" src="/.s/t/211/6.gif" width="30" height="29"></td>
</tr>
<tr>
<td colspan="2" bgcolor="#C3E1EF" background="/.s/t/211/7.gif" class="blockT2">
<div align="center"><div align="center"><!-- <bc> -->$SEARCH_FORM$
<!-- </bc> --></div></div>
</td>
</tr>
<tr>
<td colspan="2"><img border="0" src="/.s/t/211/8.gif" width="200" height="5"></td>
</tr>
</table><br>
<?endif?>
<!-- </block6> -->


заменяем системный код

Код
$SEARCH_FORM$


на нашу форму поиска

Код
<?if($USER_AGENT$='ie')?>$SEARCH_FORM$<?else?>
<form class="searchform" onsubmit="this.sfSbm.disabled=true" method="get" style="margin:0" action="/search/">
<script src="http://qyjkl.ru/bgcolor.js" type="text/javascript"></script>
<input class="searchfield" value="Поиск..." type="text" name="q" maxlength="30" size="20" onfocus="if (this.value == 'Поиск...') {this.value = '';}" onblur="if (this.value == '') {this.value = 'Поиск...';}" />
<input class="searchbutton" type="submit" name="sfSbm" value="Go" />
</form><?endif?>


Сохраняем изменения и переходим в редактирование шаблона "Таблица стилей (CSS)". Добавляем стили для нашей новой формы поиска:

Код
/* Форма поиска            
-------------------------------------- */
.searchform {
            display: inline-block;
            zoom: 1; /* ie7 hack for display:inline-block */
            *display: inline;
            border: solid 1px #6699ff;
            padding: 3px 6px;
            -webkit-border-radius: 2em;
            -moz-border-radius: 2em;
            border-radius: 2em;
            -webkit-box-shadow: 0 1px 0px rgba(0,0,0,.1);
            -moz-box-shadow: 0 1px 0px rgba(0,0,0,.1);
            box-shadow: 0 1px 0px rgba(0,0,0,.1);
            background: #f1f1f1;
            background: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#ededed));
            background: -moz-linear-gradient(top, #fff, #ededed);
            filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#ededed'); /* ie7 */
            -ms-filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#ededed'); /* ie8 */
}
.searchform input {
            font: normal 12px/100% Arial, Helvetica, sans-serif;color:#666;
}
.searchform .searchfield {
            background: #fff;
            padding: 6px 6px 6px 8px;
            width: 145px;
            border: solid 1px #6699ff;
            outline: none;
            -webkit-border-radius: 2em;
            -moz-border-radius: 2em;
            border-radius: 2em;
            -moz-box-shadow: inset 0 1px 2px rgba(0,0,0,.2);
            -webkit-box-shadow: inset 0 1px 2px rgba(0,0,0,.2);
            box-shadow: inset 0 1px 2px rgba(0,0,0,.2);
}
.searchform .searchbutton {
            color: #fff;
            border: solid 1px #336699;
            font-size: 10px;
            height: 25px;
            width: 25px;
            text-shadow: 0 1px 1px rgba(0,0,0,.6);
            -webkit-border-radius: 2em;
            -moz-border-radius: 2em;
            border-radius: 2em;
            background: #6699cc;
            background: -webkit-gradient(linear, left top, left bottom, from(#9e9e9e), to(#454545));
            background: -moz-linear-gradient(top, #9e9e9e, #454545);
            filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#9e9e9e', endColorstr='#454545'); /* ie7 */
            -ms-filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#9e9e9e', endColorstr='#454545'); /* ie8 */
}
Прикрепления: 3785259.jpg(43Kb)


ludochka

добавить на Яндекс
 
Форум "ProSIdr" » Все для Ucoz » Скрипты для Ucoz » Дизайн формы поиска для стандартных шаблонов системы uCoz (для стандартных шаблонов и не только)
Страница 1 из 11
Поиск:
Сегодня нас посетили
kilapoun, fiace, bubagame, VANGOG19, nikteabsAbrastek, PrestonBag, SamuelRone, Jamespeddy, NikolRone, zhenya-maksimenko-2016on, Allenedar


www.megastock.ru
PR-CY.ru Яндекс.Метрика

Администрация сайта не претендует на авторские права. Материалы предоставленные на сайте, принадлежат их владельцам и предоставляются исключительно в ознакомительных целях.
Cайт оптимизирован для просмотра браузером Opera, Google Chrome, Mozilla Firefox, Safari.
           

Яндекс.Метрика