Show Search Results on a Different Page
Some users may want or need to have a search bar on a different page than where their collection exists. This is very simple to set up, and we have a couple ways to show you below.
Video Tutorial:
Written Instructions:
- Navigate to your collection list that you have set up the search booster for and make sure it has the correct generated jetboost class which should look like this "jetboost-list-wrapper-xxxx" on it.
- Inside yoru Jetboost dashboard, head to the Booster Editor for that Search Booster to > Settings (first page in Editor) > Step 4 – Add search query to the URL?
Make sure this option has "Yes" selected.
- Next we go back into Webflow and to the page where your search bar will be. On this page you will only need to focus on simple adjustments to the form settings for the search bar, but this page won't require anything from Jetboost.
- Select the Form Block element that the search input field is in, and then navigate to the settings tab in the right side panel within the designer.
Once we have the Element Settings panel open, we want to set the Action field to navigate to the results page by entering a "/" followed by the page slug along with making sure that the Method is set to "Get." See example below:
Note: To get the page slug navigate to your pages panel and select the cog wheel icon (when hovering the page) and you will see it in the first Page Settings section called
Next, we will select our input field for the search bar and make sure our Name field has the value of "search" (all lowercase).
Now we are ready to publish and test it out 😉
You can also have a search bar on the results page as well. Just make sure that the input field has the generated Jetboost Search Input class on it which should look something like this: "jetboost-list-search-input-xxxx"
If you have any questions or need further help, please feel free to reach out to support@jetboost.io