Limiting Query Options for Integrated Search Bars

Search
1

Hi team!
I have a client that wants to limit the amount of options that display when you start typing in the Search Bar (but only for their mobile experiences). I used the following code in Code Editor for their Search Results Page, which successfully limited the amount of options from 10 to 8:
{
.yxt-AutoComplete-results li:nth-child(n+9) {
@media (max-width:900px) {
display: none;
}
}

However, this fix did not apply to the Search Bars that are integrated in their header and on their Support Page, since it appears the fix needs to be made to the page code. Is there any guidance that I can provide to the client to limit the options for their integrated Search Bars? Would I give them a code snippet similar to the one above, or is this something they need to work through directly with their IT team that we cannot assist on?

Thanks!

2

Hi Camille,

You are correct in that the Code Editor only affects the search bar on the search results page and that to change the integrated search bars, you’ll have to apply the fix to the pages that house the code, which you’ll need the client (or whomever owns those pages) to do. You can give them a code snippet similar to the one you used above, but you should inspect the pages those search bars are on to confirm the appropriate element to target. Of course, the client can also work with their IT team to do this.