Magento 2 – Using Elastic Search / Elastic Suite Module from Smile

elasticsearchmagento2

I ran this module on my website:
https://github.com/Smile-SA/elasticsuite

Everything seems to be working fine. But I have a problem with the configuration.

When I start search, gets the result but only the product names:
enter image description here

How to display here also additional attributes, like product image, price, add to the basket etc?

@update

I put file in:
app/design/frontend/Sm/Market/Magento_Search/layout/default.xml

<body>
    <referenceContainer name="Sm_Market">
        <block class="Smile\ElasticsuiteCore\Block\Search\Form\Autocomplete" name="top.search" as="topSearch" template="Smile_ElasticsuiteCore::search/form.mini.phtml">
            <arguments>
                <argument name="rendererList" xsi:type="array">
                    <item name="term" xsi:type="array">
                        <item name="title" xsi:type="string" translate="true">Search terms</item>
                        <item name="template" xsi:type="string">Smile_ElasticsuiteCore/autocomplete/term</item>
                    </item>
                </argument>
            </arguments>
        </block>
    </referenceContainer>
    <referenceBlock name="top.search">
        <arguments>
            <argument name="rendererList" xsi:type="array">
                <item name="product" xsi:type="array">
                    <item name="title" xsi:type="string" translate="true">Products</item>
                    <item name="template" xsi:type="string">Smile_ElasticsuiteCatalog/autocomplete/product</item>
                </item>
                <item name="category" xsi:type="array">
                    <item name="title" xsi:type="string" translate="true">Categories</item>
                    <item name="template" xsi:type="string">Smile_ElasticsuiteCatalog/autocomplete/category</item>
                </item>
                <item name="product_attribute" xsi:type="array">
                    <item name="title" xsi:type="string" translate="true">Attributes</item>
                    <item name="template" xsi:type="string">Smile_ElasticsuiteCore/autocomplete/term</item>
                    <item name="titleRenderer" xsi:type="string">Smile_ElasticsuiteCatalog/js/autocomplete/product-attribute</item>
                </item>
            </argument>
        </arguments>
    </referenceBlock>        
</body>

Best Answer

If you are using a custom theme you may need to ensure that the layout in your theme is rendering the ElasticSuite blocks for search and not the defaults.

You need to check Magento_Search/layout/default.xml in your theme and replace blocks referring to search changing "mytheme" to the reference containernames in your existing theme xml.

<body>
    <referenceContainer name="mytheme_header">
        <block class="Smile\ElasticsuiteCore\Block\Search\Form\Autocomplete" name="top.search" as="topSearch" template="Smile_ElasticsuiteCore::search/form.mini.phtml">
            <arguments>
                <argument name="rendererList" xsi:type="array">
                    <item name="term" xsi:type="array">
                        <item name="title" xsi:type="string" translate="true">Search terms</item>
                        <item name="template" xsi:type="string">Smile_ElasticsuiteCore/autocomplete/term</item>
                    </item>
                </argument>
            </arguments>
        </block>
    </referenceContainer>
    <referenceBlock name="top.search">
        <arguments>
            <argument name="rendererList" xsi:type="array">
                <item name="product" xsi:type="array">
                    <item name="title" xsi:type="string" translate="true">Products</item>
                    <item name="template" xsi:type="string">Smile_ElasticsuiteCatalog/autocomplete/product</item>
                </item>
                <item name="category" xsi:type="array">
                    <item name="title" xsi:type="string" translate="true">Categories</item>
                    <item name="template" xsi:type="string">Smile_ElasticsuiteCatalog/autocomplete/category</item>
                </item>
                <item name="product_attribute" xsi:type="array">
                    <item name="title" xsi:type="string" translate="true">Attributes</item>
                    <item name="template" xsi:type="string">Smile_ElasticsuiteCore/autocomplete/term</item>
                    <item name="titleRenderer" xsi:type="string">Smile_ElasticsuiteCatalog/js/autocomplete/product-attribute</item>
                </item>
            </argument>
        </arguments>
    </referenceBlock>        
</body>

This will load the correct js and css for the ElasticSuite search form and auto complete.

Related Topic