Error in Search Style

Hello,

I encountered problems when I searched

I use the magento platform

-> Home Page

Uncaught TypeError: Can not read property ‘top’ of undefined
at window.fixAutocompleteCssSticky (common.js: 327)
at HTMLSpanElement. (autocomplete.js: 96)
at HTMLSpanElement.dispatch (jquery.js: 5226)
at HTMLSpanElement.v.handle (jquery.js: 4878)
at Object.trigger (jquery.js: 5130)
at HTMLInputElement. (jquery.js: 5860)
at Function.each (jquery.js: 370)
at ge.fn.init.each (jquery.js: 137)
at ge.fn.init.trigger (jquery.js: 5859)
at r.trigger (event_bus.js: 30)

-> Search results page

http://dev.seoze.com/catalogsearch/result/?q=empty

Search does not work
(F12)
instantsearch.js: 10 Uncaught [Algolia] Invalid instant-search selector: .main

Can someone help me ?

Site Dev: http://dev.seoze.com

Hello @claudio,

I checked your website and the issue is, that you have very custom Magento theme which doesn’t have element with class main.
In most Magento themes, you’ll find a DIV container with class main , where the main content of the website is rendered. So the Algolia extension uses this DIV as default to render the search results page.

In your case, the DIV is missing and you’ll need to change the selector in Algolia configuration in Magento:

For you, the right selector most probably will be #maincontent.

But from what I saw you have a different HTML structure for Homepage and Catalog pages. So it might not work 100%. If that’s the case, you’ll need a developer to make sure Algolia works correctly with your theme.

Hi @jan.petr , thanks for the reply?

But what is the reason for this error?

Uncaught TypeError: Can not read property ‘top’ of undefined
at window.fixAutocompleteCssSticky (common.js: 327)
at HTMLSpanElement. (autocomplete.js: 96)
at HTMLSpanElement.dispatch (jquery.js: 5226)
at HTMLSpanElement.v.handle (jquery.js: 4878)
at Object.trigger (jquery.js: 5130)
at HTMLInputElement. (jquery.js: 5860)
at Function.each (jquery.js: 370)
at ge.fn.init.each (jquery.js: 137)
at ge.fn.init.trigger (jquery.js: 5859)
at r.trigger (event_bus.js: 30)

The reason is that you have a wrong selector set in configuration. That triggers the error.

Hello @jan.petr

I found a class, it was a “.container”

a search result page is normal now

I added the correct DOM in module, but the home page still does not work

That’s because you have a theme, which differs on different page types (like homepage vs. catalog pages), @claudio . Do you have a developer who could help you figure it out and programatically set different selector for each page?

Hi, @jan.petr

yes I am, it’s me.

You already have where I can start the correction?

Hello @claudio,

sorry for the late answer.

In tha case, you’ll need to find a specific selector for each page type.
And they, you’ll need to write a listener on algolia_after_create_configuration event to set the correct selector to algoliaConfiguration for each specific page type.

Can you do that?