• Global community
    • Language:
      • Deutsch
      • English
      • EspaƱol
      • FranƧais
      • PortuguĆŖs
  • ę—„ęœ¬čŖžć‚³ćƒŸćƒ„ćƒ‹ćƒ†ć‚£
    Dedicated community for Japanese speakers
  • ķ•œźµ­ ģ»¤ė®¤ė‹ˆķ‹°
    Dedicated community for Korean speakers
Exit
Locked
0

How to remove default search button in search module

Explorer ,
Mar 04, 2015 Mar 04, 2015

Copy link to clipboard

Copied

I am a neophyte with code and css and normally work with Muse. But I am currently trying to customize the appearance of the search module so that it works with the website it will be serving. I have  accomplished a large part of what I've been attempting, but have hit a snag in removing the default search button (CAT_Search). I've placed the image I want to use no problem, but it is contained in some weird gray beveled box with the original 'Search' text overlapping my image.

I have been making the rounds of tech support, tutorials, and every documented article on the search module and can find nothing that address this specific issue. Any help would be greatly appreciated! I am enclosing the what I've done so far below.

Thanks!

Paula

<style type="text/css">

body form {

  width: 163px;

  height: 48px;

  form-top-right-radius: 5px;

  form-bottom-right-radius: 5px;

  background-image: url(http://corehog.businesscatalyst.com/images/search.png);

}

.search-box {

  color: #999966;

  font-family: lato;

  font-style: normal;

  font-weight: 100;

  width: 86px;

  height: 24px;

  border: none;

  max-width: 86px;

  opacity: 0%;

  max-height: 24px;

  margin-left: 12px;

  margin-top: 12px;

  margin-bottom: 12px;

}

.cat_button {

  width: 32px;

  height: 24px;

  border: none

  background-color: none;

  background-image: url(http://corehog.businesscatalyst.com/images/search-button.png);

  margin-left: 12px;

  margin-top: 12px;

  margin-right: 20px;

  margin-bottom: 12px;

}

</style>

<!--The following script tag downloads a font from the Adobe Edge Web Fonts server for use within the web page. We recommend that you do not modify it.--><script>var __adobewebfontsappname__="dreamweaver"</script><script src="http://use.edgefonts.net/lato:n1:default.js" type="text/javascript"></script>

<form name="catsearchform87352" method="post" action="/Default.aspx?SiteSearchID=3752&PageID=/http://corehog.businesscatalyst.com/search-results.html"><div><input class="search-box" type="text" name="CAT_Search" id="CAT_Search" /><input class="cat_button" type="submit" value="Search" /></div></form>

{module_searchresults}

TOPICS
Content management and modules

Views

225

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines