Recent searches


No recent searches

Search Results - select Article type by default

Answered


Posted May 10, 2023

Hi all,

Is it possible to select by default the Articles type on the search results page (instead of All types)? 

We're finding in our help center that most users don't even know to select the Articles type to show the By category subfilter. We didn't even realize that function ourselves when we were building the help center. It's just not intuitive.

If Articles is selected by default, users will always see the categories.

Thanks


1

13

13 comments

image avatar

Ifra Saqlain

Zendesk LuminaryMost Engaged Community Member - 2022Most Engaged Community Member of The Year - 2021Community Moderator

Hi :) 

@Rob R

 

I worked on your query and I found this:

Add it to document_head.hbs file.

<meta id="meta-location" http-equiv="refresh" />
<script>
  if(window.location.href.indexOf("/search") > -1) {
       document.querySelector('#meta-location').setAttribute('content', '0;url=https://support.zendesk.com/hc/en-us/community/posts/5683688413338-Search-Results-select-Article-type-by-default');
    }
</script>

 

Replace this URL with yours:

https://support.zendesk.com/hc/en-us/community/posts/5683688413338-Search-Results-select-Article-type-by-default

0


Thanks for the quick reply, Ifra!

The only thing is that the page still loads to the standard results view, then one second later it refreshes to the redirect URL. I thought the '0' in the code is supposed to make it immediate?

Side note: I needed to change /search to search?utf8, since both the original results URL and the redirect both contain /search (and resulted in a page refresh loop). 

0


image avatar

Ifra Saqlain

Zendesk LuminaryMost Engaged Community Member - 2022Most Engaged Community Member of The Year - 2021Community Moderator

O o!  I only tested for external URL instead of search results. 

I'll fix it and provide new solutoin.

0


OK, thanks!

0


Hi, just asking politely for some help on this as I can't get the code to work (it goes in the loop as mentioned by Rob).

Is the URL that's meant to be replaced (https://support.zendesk.com/hc/en-us/community/posts/5683688413338-Search-Results-select-Article-type-by-default) supposed to be the just the domain? The link to the search page?

And with the replacement of the search?utf8, does that mean the code is this?

<meta id="meta-location" http-equiv="refresh" />
<script>
if(window.location.href.indexOf("/search?utf8") > -1) {
       document.querySelector('#meta-location').setAttribute('content', '0;url=https://support.zendesk.com/hc/en-us/community/posts/5683688413338-Search-Results-select-Article-type-by-default');
  }
</script>

0


image avatar

Ifra Saqlain

Zendesk LuminaryMost Engaged Community Member - 2022Most Engaged Community Member of The Year - 2021Community Moderator

Hi Kel S., actually when you add external URL in the code it won't be stuck in a loop but I'm checking the search page in the condition so the page is same on every reload that's why code executes again and again.

I tried to solve it from my side but my bad :(

0


Hi Ifra Saqlain,
I had the same issue in the sense that I wanted the user to able to clearly understand where their search was applied - and we don't have a community yet.

I'm using the following script based on yours :)

But would there be a more elegant way to do it? Especially that doesn't involve a refresh of the page?

<meta id="meta-location" http-equiv="refresh" />
<script>
  if(window.location.href.indexOf("/search?utf8") > -1) {
  var url=window.location.href;
  var pattern= '/search?type=knowledge_base&utf8';
  newUrl= url.replace("/search?utf8",pattern)
       document.querySelector('#meta-location').setAttribute('content', '0;url='+newUrl);
    }
</script>

0


image avatar

Ifra Saqlain

Zendesk LuminaryMost Engaged Community Member - 2022Most Engaged Community Member of The Year - 2021Community Moderator

Hi David Monteiro, I tried it to get it done but that same bug occurs, infinite page refresh loop...

The code is working for external URL but when I try for search page I stuck in same issue :)

 

0


image avatar

Fernando

Zendesk Luminary

Ifra Saqlain, after a lot of tinkering I was able to add the script tag below at the bottom of the search_results.hbs with the following results:

  • Hide the Menu with Source and Category on the side
  • Select the Category by default
  • Show all Categories expanded
<script>
    (function() {
        // Function to hide the 'Type' section
        function hideTypeSection() {
            const typeSection = Array.from(document.querySelectorAll('.collapsible-sidebar-title.sidenav-title')).find(section => section.textContent.trim() === 'Type');
            if (typeSection) {
                typeSection.closest('.filters-in-section').style.display = 'none';
            }
        }

        // Check the last li > a element within .multibrand-filter-list
        const lastLink = document.querySelector('.multibrand-filter-list li:last-child > a');
        if (lastLink) {
            if (lastLink.classList.contains('current')) {
                // If it has class "current", hide the Type section
                hideTypeSection();
            } else {
                // If it doesn't have class "current", click it and then hide the Type section
                lastLink.click();
                hideTypeSection();
            }
        }

        // Observe changes in the sidebar for any subsequent updates
        const targetNode = document.querySelector('.search-results-sidebar');
        if (targetNode) {
            const config = { attributes: true, childList: true, subtree: true };

            const callback = function(mutationsList, observer) {
                for(let mutation of mutationsList) {
                    if (mutation.type === 'childList') {
                        if (lastLink.classList.contains('current')) {
                            hideTypeSection();
                        } else {
                            lastLink.click();
                            hideTypeSection();
                        }
                    }
                }
            };

            const observer = new MutationObserver(callback);
            observer.observe(targetNode, config);
        }
    })();
  </script>

 

2


image avatar

Ifra Saqlain

Zendesk LuminaryMost Engaged Community Member - 2022Most Engaged Community Member of The Year - 2021Community Moderator

Mr. Fernando, it's really nice trick and it will help to other members. Thank you so much that you shared it here and I learned it too :)

0


Another approach would be to let the form build the correct query string when submitting it, simply add a hidden input by adding this to script.js

const search_form = document.querySelector('form.search');
const input = document.createElement('input');
input.setAttribute('type', 'hidden');
input.setAttribute('name', 'type');
input.setAttribute('value', 'knowledge_base');
search_form.appendChild(input);

1


image avatar

Ifra Saqlain

Zendesk LuminaryMost Engaged Community Member - 2022Most Engaged Community Member of The Year - 2021Community Moderator

Hi Mr. Rasmus Hedback :),

Thank you for the nice tip.

0


Thank you Fernando
This was exactly what I was looking for! Kudos to you ^_^

0


Please sign in to leave a comment.

Didn't find what you're looking for?

New post