Блог

Однако я новичок в HTML, я пытаюсь решить проблему с моим сайтом. Я пытаюсь объединить подстановочный знак (*) в конец всего, что пытается выполнить потребитель, чтобы он подбирал элементы с аналогичными тегами, однако я не могу понять, куда добавить указанный код… Наш текущий поисковый запрос хорошо работает при поиске товаров на основе частичных ключевых слов, но при нажатии кнопки «ввод» будет указано, что не удалось найти какие-либо товары.

Дополнительные примечания: Это веб-сайт Shopify с темой от halothemes, поэтому большая часть этого кода написана ими.

 {% assign grid_results = true %}

<div class="search-page collection-template" data-search-page>
 <div class="container">
  {% if search.performed %}

{% comment %}
Avoid accessing search.results before the opening paginate tag.
If you do, the pagination of results will be broken.
{% endcomment %}

{% paginate search.results by 15 %}

{% comment %}
We don't have any results to show. Feel free to show off featured products
or suggested searches here.
{% endcomment %}

{% if search.results_count == 0 %}
<header class="page-header">
  <h2>
    {% render 'multilang' with settings.search_1 %}
    <strong> amp;nbsp;"{{ search.terms }}"amp;nbsp; </strong>
    {% render 'multilang' with settings.search_2 %}
  </h2>
</header>

{% else %}

<header class="page-header">
  <h2>
    {% render 'multilang' with settings.search_3 %}
    <strong> amp;nbsp;"{{ search.terms }}"amp;nbsp; </strong>
    {% render 'multilang' with settings.search_4 %}
  </h2>
</header>

{% comment %}
Each result template, based on the grid_layout variable above
{% endcomment %}

<div class="block-row col-main">
  {% if grid_results == false %}
  <div class="product-collection products-list product-search row">
    {% for product in search.results %}
    <div class="grid-item col-12{% if settings.product_image_border%} grid-item-border{% endif %}">
      {% render 'search-result' with product as product %}
    </div>
    {% endfor %}
  </div>

  {% else %}

  <div class="products-grid product-search row product-collection">
    {% for product in search.results %}
    <div class="grid-item col-6 col-md-4{% unless settings.layout_style == 'layout_style_1170' %} col5 col-lg-3{% endunless %}{% if settings.product_image_border%} grid-item-border{% endif %}">
      {% if settings.style_product_grid == 'style_product_grid_2' %}
        {% render 'product-grid-item-style-2' with product as product %}
      {% else %}
        {% render 'product-grid-item' with product as product %}
      {% endif %}
    </div>
    {% endfor %}
  </div>
  {% endif %}
</div>
{% endif %}

{% if paginate.pages > 1 %}
<div class="padding">
  {% render 'pagination-page' paginate: paginate %}
</div>
{% endif %}
{% endpaginate %}

{% else %}

{% comment %}
If search.performed is false, someone either accessed the page without
the q parameter, or it was blank.
Be sure to show a search form here, along with anything else you want to showcase.
{% endcomment %}

<header class="page-header">
  <h2 style="text-align:center" {% if settings.enable_multilang %}data-translate="general.search.title"{%endif%}>{{ 'general.search.title' | t }}</h2>
  <div class="header-search__form">
      <form action="/search" method="get" class="search-bar" role="search">
          <input type="hidden" name="type" value="product">

          <input type="search" name="q"
              {% if settings.enable_multilang %} data-translate="general.search.placeholder" translate-item="placeholder"{% endif %}
              placeholder="{{ 'general.search.placeholder' | t }}"
              class="input-group-field" aria-label="Search Site" autocomplete="off">

          <button type="submit" class="btn icon-search">
              {% render 'icon-search' %}
          </button>
      </form>
  </div>
</header>
{% endif %}
 

Пожалуйста, дайте мне знать, если вам, ребята, нужна дополнительная информация! Спасибо!

Вы можете использовать простой скрипт для добавления подстановочного знака в поисковый запрос при отправке формы, например:

 var searchForm = document.querySelector(".search-bar");
searchForm.addEventListener("submit", function(e) {
  var searchInput = searchForm.querySelector("[name=q]");
  var q = searchInput.value;
  if (!q.match(/*$/)) {
    e.preventDefault();
    searchInput.value = q   "*";
    searchForm.submit();
  }
});