Ajax search results not displayed on category page

[robinmanoli90Participant]

Hi!
I think this problem appeared when I created my own search result page. Ajax search works on normal pages, but not on category pages. On the search results page only live load results works, but not the normal ajax results. How can I make ajax search results appear as on the starting page on the site, when I’m on a category page or the search result page?

I’m searching for: 800w or nitrox

On the starting page ajax search works fine and gives ajax results: https://sandbox.eevee.store/

But clicking on a category page: https://sandbox.eevee.store/product-category/elcyklar/
now the ajax search results don’t appear at all (but at least the loader appears)

Same problem with the search page, but here even the loader doesn’t appear: https://sandbox.eevee.store/2021-search-results/?asp_ls=nitrox&asp_active=1&p_asid=1&p_asp_data=1&current_page_id=559&woo_currency=SEK&qtranslate_lang=0&filters_changed=0&filters_initial=1&asp_gen%5B%5D=title&asp_gen%5B%5D=content&asp_gen%5B%5D=excerpt&customset%5B%5D=product

[Ernest MarcinkoKeymaster]

Hi,

On both the archive and the results page the “asp_es_1” class is added to the elementor archive widget – so the plugin automatically switches to elementor filtering mode. The live triggers for the elementor widgets are however turned off, so it appears as if nothing was happening.

If you remove the “asp_es_1” class from the widget, it will start working agin.

Best,
Ernest Marcinko
If you like my products, don't forget to rate them on codecanyon :)

[robinmanoli90Participant]

oh right, that works perfectly

Another question though, I have the “Make the whole result area clickable?” setting turned on, but clicking the image won’t take me to the product page. Shouldn’t this make the image clickable? Can I make it clickable?

Also, now all search results are snapped to the left, even though center is selected.

[Ernest MarcinkoKeymaster]

You are welcome!

Well, the isotopic masonry layout will always put the items to the right when calculating the space, but you can try a custom CSS to sort of center them:

.resdrg {
    display: flex !important;
    align-items:center;
    justify-content: center;
    gap: 12px;
    flex-wrap: wrap;
}

.resdrg .item {
    position: relative !important;
    flex-shrink: 0;
    left: auto !important;
    top: auto !important;
}

However I can not guarantee this is going to work.
Try this configuratiom to make the whole area clickable: https://i.imgur.com/NpCgaUy.png

Best,
Ernest Marcinko
If you like my products, don't forget to rate them on codecanyon :)

[robinmanoli90Participant]

Hi,
it seems to work. Thanks!

I’m wondering how to make a lightbox effect, so that when search results are displayed everything else on the body should become a bit darker to highlight the search results?

[Ernest MarcinkoKeymaster]

That is only available in the compact layout mode, when the position is set to “fixed”. Otherwise it is no doable, because an element needs to be in a fixed position to apply backgrouind between it and the rest of the elements.

Best,
Ernest Marcinko
If you like my products, don't forget to rate them on codecanyon :)

[robinmanoli90Participant]

well the element is fixed on the real page, though it is the elmentor element that is fixed.. is it possible to do it then?

[Ernest MarcinkoKeymaster]

No unfortunately, that would require some custom coding for sure.

Best,
Ernest Marcinko
If you like my products, don't forget to rate them on codecanyon :)

[robinmanoli90Participant]

Hi,
when I search for something and the ajax results show up, and then I erase everything in the search form, there are still results coming up. Is there a way so that it doesn’t perform a search when erasing all characters from the search form?

[Ernest MarcinkoKeymaster]

Sure!

Just change the minimum character count to trigger the search to 1 or more here: https://i.imgur.com/ciFjSCL.png

Best,
Ernest Marcinko
If you like my products, don't forget to rate them on codecanyon :)

[robinmanoli90Participant]

hi, I could actually do the grayed out effect when the results are inside a fixed position div:
#ajaxsearchprores1_1{
box-shadow: 100vh 100vh 990px 100vh rgb(33 33 33 / 50%), -100vh 100vh 0 100vh rgb(33 33 33 / 50%);
}

check it out here: https://test.eevee.store/

the scrolling effect still needs coding though, but I will take care of fhat myself

[Ernest MarcinkoKeymaster]

That is actually a very clever solution, great job.

Best,
Ernest Marcinko
If you like my products, don't forget to rate them on codecanyon :)

[Author]

Posts