Print

Customizing Template search box


to change css layout of search box:

go to 'project template' tab --> 'template editor' --> 'css' and append this as new line (you can change it with css controls to fit your needs)

 

#search_box{background: #a6a6a6;border: 1px solid #9b9b9b; color: #ffffff;height:22px; padding: 0 7px;border-radius: 2px;margin:8px 32px 8px 8px;}

 

to customize search button: 

 

#search_button{background: #1b1b1b;border: 1px solid #545454;color: #ffffff;position: absolute;right: 7px;top: 8px;width: 24px;height: 24px;border-radius: 2px;}

 

search area (div) can be also customized :

 

#search{background:#d8d8d8;border:1px solid #cacaca;border-radius: 10px;}

 

you can also use images as background...

 

to make search button invisible:

 

#search_button{display:none;}

 

to remove label from search button (in case you use background image), go to language setting tab --> interface labels --> search labels and change label for 'search'

 

 


 posted by miro   Site Search tags:  search • customize   permalink
3.8 4