Wrorkin on Search form (header)


Author Message
Andrea

Posted: 7/25/2014
Quote message 

Hi,

I've a couple of question about the search form I've placed in my header:

- do you know how to add inside the search form a writing (i.e. just "search" or "serch here...") with a light color?

- do you how to personally set the size (from Controls I just can pick up one of the search form there...more options is empty )?

Thnk you in advance!
 
Nicole

Posted: 7/25/2014
Quote message 

Hi,
2. you may change the width of input search control in the
form.art-search input[type="text"]
in style.css file
 
Andrea

Posted: 7/26/2014
Quote message 

Thank you very much for your suggestion.

May I ask you something more (since I'm not too able with css files)?

Can you please tell me what is the string to edit to move the search form to the left or right? I think it's the "padding" one but my tries didn't work...
 
dave

Posted: 7/26/2014
Quote message 

I think what she's asking (which is a good question and something Artisteer could very easily add as a tweak upgrade in minutes) is how to make it so that the search box can have text in it such as "search here" or "enter search terms" in the box as some other sites have.

That option is currently not available in Artisteer without changing CSS, and if you're not comfortable with CSS or knowledgeable on where to find that particular code within WordPress and know what to alter, you can jack up a website unintentionally.
 
techtom

Posted: 7/26/2014
Quote message 

You can try the following

Make sure to backup any files before you modify anything. change the enter keywords in both places to whatever you want in the input form.

In searchform.php change

<input name="s" type="text" value="<?php echo esc_attr(get_search_query()); ?>" />


to this

<input type="text" name="s" onclick="this.value='';" onfocus="this.select()" onblur="this.value=!this.value?'enter keywords':this.value;" value="enter keywords" />
 
dave

Posted: 7/27/2014
Quote message 

Works like a champ.
 
Andrea

Posted: 7/29/2014
Quote message 

Quote techtom:

You can try the following
Make sure to backup any files before you modify anything. change the enter keywords in both places to whatever you want in the input form.
In searchform.php change
<input name="s" type="text" value="<?php echo esc_attr(get_search_query()); ?>" />

to this
<input type="text" name="s" onclick="this.value='';" onfocus="this.select()" onblur="this.value=!this.value?'enter keywords':this.value;" value="enter keywords" />


Thank you very very much! It works :-)

Don't hate me 8-) if I have another question: is there a way to set a color just for the words "enter keywords" (in my website I'd like to set a light grey for this quote only - it's ok to have the dark grey when people use the form)?

Thank you in advance!
 
techtom

Posted: 7/29/2014
Quote message 

Hi Andrea, I won't hate you.... :-)


Try adding this to your style.css file

form.art-search input[type="text"]:focus {
color: #333 !important;
}

form.art-search input[type="text"] {
color: red !important;
}
 
Andrea

Posted: 7/29/2014
Quote message 

:-) :-) :-)

Tnx again!!!

Btw, it would be more than great if a future version of Artisteer would include an easier link between the main software and the .css (to make easier the users customizations)!
 
techtom

Posted: 7/29/2014
Quote message 

I think a live edit of css in Artisteer would be nice. Open the css in the options panel and what you type in there for css can show instantly on the page.