• Страница 1 из 1
  • 1
Как изменить дизайн "формы поиска"?
avatar
Админ | Оффлайн
Для начала находим у себе в шаблоне системную переменную отвечающую за вывод формы поиска и удаляем ее:
Код

$SEARCH_FORM$

Вместо нее теперь устанавливаем следующий html код формы поиска:

Код

<form class="poick_os" onsubmit="document.getElementById('sfSbm').disabled=true" method="get" action="/search/" >  
  <input class="poick_pole" type="text" name="q" maxlength="45" value="Поиск..." onclick="if (this.value=='Поиск...'){this.value='';}"/>  
  <input class="poick_knopka" type="submit" value="Найти" />  
  <input type="hidden" name="t" value="0" />  
  </form>

Шаг 2 - Установка CSS
Теперь придаем нашей форме поиска ucoz красоты и соответствующего цвета, выбирайте нужный. А вставлять стиль нужно: П.У - Дизайн - Управление дизайном(CSS) и в самый низ.

Оранжевая кнопка поиска

Код

/* Форма поиска оранжевая кнопка ----------*/  
  .poick_os {  
  float:left;  
  padding:4px;  
  width:300px;  
  background:#fff;  
  border: 1px solid #A0A8AC;  
  }  

  .poick_os input {  
  float:left;  
  margin:0px;  
  vertical-align:middle;  
  font:11px Verdana,Arial,Helvetica,sans-serif;  
  }  

  .poick_pole {  
  color:#555;  
  width:220px;  
  height:15px;  
  border:none;  
  padding:6px 4px;  
  }  
   
  .poick_knopka {  
  text-shadow: 1px 1px 1px #865520;  
  width:70px;  
  height:27px;  
  cursor:pointer;  
  background:#e1954a;  
  border:1px solid #c97639;  
  color:#fff; font-weight: bold!important;  
  }  
   
  .poick_knopka:hover {background:#d48347;}  

  .poick_os,  
  .poick_knopka {  
  -webkit-border-radius: 3px;  
  -moz-border-radius: 3px;  
  border-radius: 3px;  
  }


Редактируйте под себя.

В этой теме Вы можете задать вопрос о материале Как изменить дизайн "формы поиска"?.
[Сообщение # 1]  
  • Страница 1 из 1
  • 1
Поиск:

close