Hi there,
So, im kind of al long-time-lurker on the help page of Shopify...
Im not a programmer, but due to want to build a company with as little money as possible, ill try to do and learn things myself, first.
So if it is not too difficult I try some changing the code. I am from the Netherlands, so I hope my English is good enough... (laughs awkwardly)
That said:
We had the problem that our blogpost would not show up via the search-light. Thanks to this page, I tried some changing the code in a testpreview, and I got it as far as looking into products AND articles (YEAH!)
Now, 2 little "issues" are still accuring, on which I hope I can get some help.
Issue 1:
If you use the search-light directly from the homepage, if says it doen't find any articles. But, if you use the same search word on the page that it redirects too (after entering the word on the homepage search-light), then it will find the article. This issue is both on the desktop and mobile version.
I've made little video to show the problem, but I don't know if I am aloud to share that...?
Issue 2:
I would like it if the search items would be split up. In my vision the blogs/articles need to be viewed first, and then with a (for example) separation line you would see the products underneath that.
This is what my search.liquid looks like.
{% paginate search.results by 24 %}
<div class="section-title desktop-12 mobile-3">
<h1>{{ 'general.search.title' | t }}</h1>
<input type="hidden" name="type" value="product,article">
</div>
<div id="page" class="desktop-12 tablet-6 mobile-3">
<div id="search-bar">
<form action="/search" method="get">
<input type="text" name="q" id="q" placeholder="{{ 'general.search.placeholder' | t }}"/>
<input type="hidden" name="type" value="product,article">
<input value="{{ 'general.search.submit' | t }}" name="submit" id="search_button" class="button" type="submit">
{% if search.performed %}
{% if search.results_count == 0 %}
<p>{{ 'general.search.no_results_html' | t: terms: search.terms }}</p>
{% else %}
<p>{{ 'general.search.results_for_html' | t: terms: search.terms }}</p>
{% endif %}
{% endif %}
</form>
</div>
</div>
{% if search.performed %}
<div class="desktop-12 tablet-6 mobile-3" id="four-per-row">
<div class="grid_wrapper product-loop">
{% for item in search.results %}
<div class="product-index desktop-3 tablet-2 mobile-half span-3" id="prod-{{ product.id }}" data-alpha="{{ product.title }}" data-price="{{ product.price }}">
<div class="collection-image ci">
<!-- Article -->{% if item.object_type == 'article' %}
<!--'item' is an article All article object properties can be accessed. -->
{% if item.image %}
<a href="{{ item.url }}" title="{{ item.title | escape }}">
{%- include 'basic-responsive-image', type: item.image -%}
<noscript>
<img src="{{ item.image | img_url: '800x' }}" alt="{{ item.image.alt }}">
</noscript>
</a>
{% else %}
<div class="search-content prod-image">
{{ item.content | strip_html | trancate: 200 }}
</div>
{% endif %}
<!-- PAGE -->{% elsif item.object_type == 'page' %}
<!--'item' is a page. All page object properties can be accessed. -->
{% if item.content contains "img" %}
{% assign feat_image = item.content | split: 'src="' %}
{% assign feat_image = feat_image[1] | split: '"' | first | replace: '//cdn', 'http://cdn' | replace: 'http:http://', 'http://' | remove: 'https:' %}
<a href="{{ item.url }}" title="{{ item.title | escape }}">
<img src="{{ feat_image }}" alt="{{ item.title }}">
</a>
{% else %}
<div class="search-content prod-image">
{{ item.content | strip_html | trancate: 200 }}
</div>
{% endif %}
<!-- Product -->{% else %}
<!-- 'item' is a product. All product object properties can be accessed.-->
{% if item.available %}
{% for col in item.collections %}
{% if col.handle == 'new' %}
<div class="new icn">{{ 'products.general.new' | t }}</div>
{% endif %}
{% endfor %}
{% if item.price < item.compare_at_price %}
<div class="sale-item icn">{{ 'products.general.sale' | t }}</div>
{% endif %}
{% else %}
<div class="so icn">{{ 'products.general.sold' | t }}</div>
{% endif %}
{% if item.featured_image %}
<a href="{{ item.url }}" title="{{ item.title | escape }}">
<div class="reveal">
{% include "basic-responsive-image", type: item.featured_image %}
<noscript>
<img src="{{ item.featured_image | img_url: '1024x' }}" alt="{{ item.featured_image.alt | escape }}">
</noscript>
{% if settings.image_flip and item.images.size > 1 %}
<div class="hidden">
{% include "basic-responsive-image", type: item.images[1] %}
<noscript>
<img src="{{ item.images[1] | img_url: '1024x' }}" alt="{{ item.images[1].alt | escape }}">
</noscript>
</div>
{% endif %}
</div>
</a>
{%- else -%}
{% capture current %}{% cycle 1, 2, 3, 4, 5, 6 %}{% endcapture %}
{{ 'item-' | append: current | placeholder_svg_tag: 'placeholder-svg' }}
{%- endif -%}
{% endif %}
</div>
<div class="product-details">
<a href="{{ item.url }}">
{% if item.object_type == 'product' %}
{% if settings.vendor %}
<h4>{{ item.vendor }}</h4>
{% endif %}
{% endif %}
<h3>{{ item.title }}</h3>
</a>
{% if item.object_type == 'product' %}
{% unless item.template_suffix == 'not-for-sale' %}
<div class="price">
{% if item.price < item.compare_at_price %}
<div class="onsale">{{ item.price | money }}</div>
<div class="was">{{ item.compare_at_price | money }}</div>
{% else %}
<div class="prod-price">
{% if item.price_varies %}
{{ 'products.general.from' | t }} {{ item.price_min | money }} - {{ item.price_max | money }}
{% else %}
{{ item.price | money }}
{% endif %}
</div>
{% endif %}
</div>
{% endunless %}
{% endif %}
</div>
</div>
{% endfor %}
</div>
</div>
{% include 'pagination' %}
{% endif %}
{% endpaginate %}If anybody can help me out with this, it would be super awesome!
Kind regards, greetings
Ronja
