How Can i remove this search body on css without removing the other search body? supply theme

Solved
ADHP
Tourist
9 0 2

searchbody.jpg

searchbody2.jpg





This is my code on search body and i put in slideshow.liquid 



<div id="shopify-section-search-body-template" class="shopify-section">
<div class="search_body">
<div class="grid-item">
 
  <hr class="hr--clear hr--small">
<h1 class="text-center h2">What Are You Looking For?</h1>
      <form action="/search" method="get" class="search-bar" role="search">
  <input type="hidden" name="type" value="product">
<input type="search" name="q" value="" placeholder="Find Parts and Products" aria-label="Find Parts and Products">
  <button type="submit" class="search-bar--submit icon-fallback-text">
    <span class="icon icon-search" aria-hidden="true"></span>
    <span class="fallback-text">Search</span>
  </button>
</form>
  </div>
  </div>
</div>

 

0 Likes
ScreenStaring
Shopify Partner
53 2 10

It's is not clear what you want to remove. The screenshots: 1 says "remove this" and the other says "don't not remove this" but they look to be the same thing. 

ScreenStaring
Software Development & Consulting
ADHP
Tourist
9 0 2

@ScreenStaring yes sir its a same. it is possible to remove the other one? i try to code this in css 

.search_body{
display:none ! important;

}
and the other search body are gone,
there's another way to remove it without removing the other search body? btw thanks for reply sir. 
this is my website sir https://shop-banawe.myshopify.com/

0 Likes
ScreenStaring
Shopify Partner
53 2 10

This is an accepted solution.

I cannot see your site. It's password protected but from the screenshot it looks like it's the Supply theme. Is that correct? 

If so you can likely just add another CSS class to what you have. For example, if you want to hide it on the collection page: 

 

 

.template-collection .search_body{
  display: none !important;
}

 

 

Or if it's a Page, e.g., "about us", blog post, etc... you can try:

 

 

.template-page .search_body{
  display: none !important;
}

 

 

Again, this assumes it's the Supply theme. 

If it's not you can always find the correct CSS selector yourself and then replace it with what you have now. See this for more info. 

 

 

ScreenStaring
Software Development & Consulting
0 Likes
ADHP
Tourist
9 0 2

I got it sir thanks have a nice day 

0 Likes