Customize The Styling Of The Simple Search Plugin

A very frequently used plugin for gpEasy CMS is the simple search plugin. I have it installed on this site though I only display it on the gpEasy Tutorial layout.

The class used for the simple search plugin is gpArea_Simple_Search. To find the class just look into the page's code after you have installed the plugin however, there are a couple unique setting for items that have text areas and inputs. Take a look at my css for the theme I use here on trueacu.com.

.gpArea_Simple_Search h3, .gpArea_Simple_Search_ h3 {
	display: none;
}
.gpArea_Simple_Search input.text, .gpArea_Simple_Search_ input.text {
	width: 168px;
	font-size: 10px;
	background: #ffffff;
	border: solid 1px #ddd;
}
.gpArea_Simple_Search input.submit, .gpArea_Simple_Search_ input.submit {
	width: 48px;
	font-size: 10px;
	color: #01203c;
	opacity: .2;
}

From the code you can see that there is a H3 heading, but in my case I have it hidden, and you can see that there is an input.text & input.submit attributes. The former is the text field and the latter is the submit button. That's all there really is to styling this plugin. It's rather simple.