Skip to main content

Search Box

Basic configuration​

  1. Edit the page and add a 'PnP Modern Search Core Components - Search Box'.

    PnP Modern Search Core Search Box

    Search box default

  2. Specify a placeholder

    Search box placeholder

    warning

    Placeholder doesn't support translations.

  3. Connect the other web parts on page:

Send query to a new page​

Instead of using the search box value in the same page, you also have the possibility to send the entered keywords to an other page (SharePoint page or not).

Send query to new page

  1. Send the query to a new page ➝ configure following options:

    • Page URL: the URL of the page to redirect to.
    • Opening behavior: use teh current tab or use a new tab
    • Method: the way the search box value is passed to other page.
      • By URL fragment: in this case, the value with be sent like https://mypage#searchbox_value.
      • By Query string parameter: in this case, the value with be sent like https:/mypage?myParam=searchbox_value where myParam is a arbitrary value you can define in the settings.

    Configure target page to use the search box value

    The value can be used in target page, in a search results web part by configuring a dynamic query text.