Many times, we wish to use a specific Homepage Search Box for our site. 


To get the Search Box we want, we can simply go to Toolbox- > Design -> Homepage Layout -> Homepage Search Settings and select the type of search box from the Search Type option (Image below).



But what happens when we want to go one step further and customize a specific Search Box. We can do this by adding the correct CSS code to any widget on the same page where the Search Box appears but I would recommend (so we don't forget which widget was edited) to only edit the widget that corresponds to the Search Box. So if we select the Filtered Search in the Search Type option (As seen on the image above), wen should edit the Bootstrap Theme - Homepage Search - Filtered Search widget which corresponds to it and add the CSS code in there.


So in the following image we can see the Filtered Search Box, but what happens if we want to remove the option that says What do you need:.



To do this, we would add the following CSS code:

 

#s2id_sid, #sid {
    display:none;
}


This would remove that part of the Search Box, now all we need to do is remove the Label Text from showing (The "What do you need:" part). To do this, we would go to Settings -> Text Labels and search for it there. Simply emptying the value and saving will do.


Now, what happens if we want to remove the Specializing In part. Similar approach but the CSS code would change to:

 

s2id_tid, #tid {
    display:none;
}

 

With this code, we would then only need to remove from Settings -> Text Labels the corresponding text for "Specializing In:" and we would be done.