Jump to content


This topic is now archived and is closed to further replies.


Code wont change search color

Recommended Posts


I am attempting to remove this blue background color that seems to come up with search by default.  I copied and pasted the styles in custom css yet nothing changes it.  I can change in firebug but I'm trying to enact them live.  I changed the color of the searchform but searchfield will not change.  Any insight on where I can change this would be great.  the code Im using is below

#site .searchform .searchfield{
background: url("http://radiosilentplay.com/redesign/wp-content/themes/dms/images/[email protected]") no-repeat scroll 4px 50% / 14px 14px #fff !important;

but it stays blue.

Share this post

Link to post
Share on other sites

also is there an easy way just to make this a box that has search in it other than this animated stuff?  Im just trying to put a search box on a page.

Share this post

Link to post
Share on other sites



Try this instead:


#site .searchform .searchfield {
background: rgba(0, 0, 0, 0) url("http://radiosilentplay.com/redesign/wp-content/themes/dms/images/[email protected]") no-repeat 4px 50%;
background-size: 14px 14px;
border: none 0;


The blue is most likely coming from your color options.


If you want your search inside a page, you will most likely need to either create a shortcode to display a search anywhere or use a plugin. As to making it look like a standard search box, you simply need to override all the styling or add your own.

Please search our forums, before posting!

Share this post

Link to post
Share on other sites

  • Similar Content

    • mtaus
      By mtaus
      How can I remove the Search function from NavPro?
    • oseehys
      By oseehys+
      Of all the Items that is on Pagelines Shortcode, the Signup on the Settings page is the biggest miss, can anybody tell me how i can add the Signup Shortcode on a link my footer so that users can subscribe to my blog directly or better still to create the shortcode myself if thats possible, but instead of adding a new button somewhere down, i think its better to add the Signup shortcode to an existing link, Thanks
    • John Olsson
      By John Olsson+
      Hello, i'm working on a webshop, and got this code to really boost the search within WP. But when adding this code to functions.php the front end media library search flipped totally, and not working at all, any ideas what's the problem?
      function atom_search_where($where){ global $wpdb; if (is_search()) $where .= "OR (t.name LIKE '%".get_search_query()."%' AND {$wpdb->posts}.post_status = 'publish')"; return $where; } function atom_search_join($join){ global $wpdb; if (is_search()) $join .= "LEFT JOIN {$wpdb->term_relationships} tr ON {$wpdb->posts}.ID = tr.object_id INNER JOIN {$wpdb->term_taxonomy} tt ON tt.term_taxonomy_id=tr.term_taxonomy_id INNER JOIN {$wpdb->terms} t ON t.term_id = tt.term_id"; return $join; } function atom_search_groupby($groupby){ global $wpdb; // we need to group on post ID $groupby_id = "{$wpdb->posts}.ID"; if(!is_search() || strpos($groupby, $groupby_id) !== false) return $groupby; // groupby was empty, use ours if(!strlen(trim($groupby))) return $groupby_id; // wasn't empty, append ours return $groupby.", ".$groupby_id; } add_filter('posts_where','atom_search_where'); add_filter('posts_join', 'atom_search_join'); add_filter('posts_groupby', 'atom_search_groupby');  
    • Queue-it
      By Queue-it+
      Search function doesn't seem to work. 
      When ever searching for something it redirect to the home page and add the search string to the url.
      For example searching for "cases" it would display https://queue-it.com/?s=cases
      Do you know how to solve that? 
    • Samuel Costa - UDF
      By Samuel Costa - UDF+
      I need a shortcode activate a popup windows with contact form. It is possible without code?
      Link: https://www.udf.org.br/lancamentos/curso-mulher-que-prospera/