Connecting CMS Collection to Search Results [ Search Results to Search Collection List Not Page Meta Data]

Hello, I am trying to make a Property Listing website, On the home page i have a search bar, the search bar takes me to the search results page. The search items are connected to the Meta Tags and Description of the Page , but what I want is to show a property card ( with it’s icons and styling ) rather than searching all the pages and pulling their Meta data

This is the card view that I want to show

Hey Konn, the site search feature accepts a text string and uses it to search indexed pages. Are you meaning that you want it to naturally find whatever it finds but that IF it happens to find a property listing, that the property listing is displayed as a card?

This is not a native feature but it can be done with custom code.

  • On the search results page you’d identify results that match your CMS page path, e.g. /property/p2345
  • You’d then need to retrieve all of the data for your card, and display if here in place of the site search excerpt.
  • You’d also restructure the results by moving DOM elements, and making good use of CSS grids.

To get the content, you can either have on an-page, hidden collection lists to pull your content from. That works if your property list is < say 300. Alternatively you can fetch() it, which is slower but allows you to have any number of possible properties in your list.

1 Like