如果显示搜索结果，则隐藏元素

Question

如果显示搜索结果，我正在尝试隐藏一个元素（无结果包装器）。

现在，当有搜索结果时，元素（no-results-wrapper）显示在结果的最底部。如果有搜索结果，我希望隐藏元素。

我尝试使用 {% if search.terms == blank %} 仅在搜索结果为空白时显示元素，但这不起作用。任何帮助，将不胜感激。

{%- if settings.basel_search_widget != 'disable' -%}
<div class="search-button basel-search-{{settings.basel_search_widget}}">
   <a href="#"><i class="fa fa-search"></i></a>
   <div class="basel-search-wrapper">
      <div class="basel-search-inner">
         <span class="basel-close-search">{{ 'general.search.close_search' | t }}</span>
         <form role="search" method="get" class="searchform{%- if settings.ajax_search %} basel-ajax-search{%- endif -%}" action="/search">
            <div>
               <label class="screen-reader-text"></label>
               <input type="text" placeholder="{{ 'general.search.placeholder' | t }}" value="{{ search.terms | escape }}" name="q" autocomplete="off">
               {%- if settings.only_search_products -%}<input type="hidden" name="type" value="product" />{%- endif -%}
               <button type="submit">{{ 'general.search.submit' | t }}</button>
            </div>
         </form>
         <div class="search-results-wrapper">
            <div class="basel-search-results">
              <div class="autocomplete-wrapper">

               <div class="autocomplete-suggestions" style="position: absolute; max-height: 300px; z-index: 9999;"></div>

                
                
               
                
                
                
                
                
                {% if search.terms == blank %}
                <div class="no-results-wrapper">

    <div class="search-bar-item">
      <div class="canvas ratio-2-3">
      <div class="product-image-color-overlay" style="z-index: 10; background-color: #efefef;">
        <div class="display-table">
        <div class="display-table-cell">
          <div class="search-bar-no-result-item">
            <p>HMMM...</p>
<p>NOT SURE WHAT YOU’RE
LOOKING  FOR?</p>
<p><a href="#">Shop New Arrivals</a>
<a href="#">Shop Latest</a></p>
          </div>
        </div>
        </div>
      </div>
      </div>
    </div>

    
    

    <div class="search-bar-item">

        <a href="#">

        <div class="canvas ratio-2-3">

          <div class="image-over-canvas bkg-image-focus-center-top" style="background-image: url('//cdn');"></div>
          <div class="product-image-color-overlay"></div>

        </div>


          <div class="product-card-details">
          <div class="product-card-title">One-Pieces</div>
          </div>

        </a>

      </div>

    
    
    

    <div class="search-bar-item">

        <a href="#">

        <div class="canvas ratio-2-3">

          <div class="image-over-canvas bkg-image-focus-center-top" style="background-image: url('//cdn');"></div>
          <div class="product-image-color-overlay"></div>

        </div>


          <div class="product-card-details">
          <div class="product-card-title">New Arrivals</div>
          </div>

        </a>

      </div>

    
    
    

    <div class="search-bar-item">

        <a href="#">

        <div class="canvas ratio-2-3">

          <div class="image-over-canvas bkg-image-focus-center-top" style="background-image: url('//cdn');"></div>
          <div class="product-image-color-overlay"></div>

        </div>


          <div class="product-card-details">
          <div class="product-card-title">Holiday</div>
          </div>

        </a>

      </div>

    
    


  </div>
       {% endif %}         
                
                
                
                
                
                
                
                
            </div>
           </div>
         </div>
      </div>
   </div>
</div>
{%- endif -%}

Answer 1

你需要替换这个：

{% if search.terms == blank %}

有了这个：

{% if search.results_count == 0 %}