I've done as much as I can to try to figure out what is going on here to no avail.
I installed Algolia, as per the instructions, on my local development instance of a client website. After disabling Elasticsearch, I can inspect element and see that the algolia-searchbox div shows up properly. However, it does not work as it is supposed to. It seems to be using the magento search functionality even though that search is within the algolia searchbox.
I dug a little deeper. I found out that the topsearch was being rendered twice on the page due to the off-canvas menu. When I shrink my window down to the appropriate size for show-for-small-only to render, the search is ALSO in that section, but it actually works as the Algolia search is supposed to work.
<reference name="header">
<remove name="top.search"/>
<block type="algoliasearch/search_form" name="top.algoliasearch" as="topSearch"/>
<action method="setTemplate"><template>algoliasearch/topsearch.phtml</template></action>
</reference>
So the first question is: what is the best way to get this to work with responsive designs utilizing the off-canvas menu functionalities? The off-canvas menu, rendered second, ends up overriding what was done to the normal topsearch area due to it rendering twice and this is a huge problem
The only way I have been able to see the correct search bar on normal header so far is to put this in the algoliasearch.xml:
This completely gets rid of my header, but it actually displays the correct search bar. I know it isn't correct syntaxt, but when troubleshooting...
The second issue I am facing is that, even when I utilize the search bar that actually shows up (via the above header xml piece or by using the smaller browser size to render the off canvas menu search), the results page I end up on is the normal Magento results page. I can see activity in the Network panel when I am typing into the search bar, but as soon as I submit, it all disappears and stays blank.
Thanks for any help you can offer.