Answersheet to 'Building a custom search landing page'

// store/routes.json
{
  "store.custom#about-us": {
    "path": "/about-us"
  },
  "store.custom#landing": {
    "path": "/landing"
  }
}
// store/blocks/search-landing.jsonc
{
  "store.custom#landing": {
    "blocks": ["image#landingbanner", "search-result-layout.customQuery"]
  },
  "image#landingbanner": {
    "props": {
      "src": "https://storecomponents.vteximg.com.br/arquivos/box.png",
      "minWidth": "100%"
    }
  },
  "search-result-layout.customQuery": {
    "props": {
      "querySchema": {
        "orderByField": "OrderByReleaseDateDESC",
        "hideUnavailableItems": true,
        "maxItemsPerPage": 8,
        "queryField": "Blue Top Retro Camera",
        "mapField": "ft"
      }
    }
  }
}

Help us make this content better!

VTEX IO courses are open source. If you see something wrong, you can open a pull request!

Make a contribution

or open an issue