Easy Site Search logo Easy Site Search

Adding search to NextJS website

Widget installation is quick and easy, typically taking only a few minutes.

Sign in to your account

Access your Easy Site Search account through dashboard.

Create a website

In the Easy Site Search dashboard, create a new website entry and provide the necessary details, such as your website's URL.

Install the widget

Copy the provided code snippet from the Easy Site Search dashboard and make sure it renders on your website, inside the <Script> element. This is required to complete the verification.

An example of how to set this up. Remember to set YOUR_KEY to your website key.

Also make sure to change the ACTIVATOR to be a valid css selector, pointing at the element that should open the search when clicked.

<Script id="my-inline-script" strategy="afterInteractive">
  {`
    (() => {
      const b = 'https://cdn.easysitesearch.com';
      const s = document.createElement('link');
      s.href = b + '/easy-site-search.css';
      s.rel = 'stylesheet';

      const w = document.createElement('script');
      w.src = b + '/easy-site-search.umd.js';
      w.async = 1;
      w.onload = () => {
        EasySiteSearch.setup('ACTIVATOR', {
          key: 'YOUR_KEY',
        });
      }

      document.body.appendChild(s);
      document.head.appendChild(w);
    })()
`}
</Script>

Verify your website

Make sure to paste the code snippet on your website before verification attempt.

Return to the Easy Site Search dashboard and click the "Verify Website" button to confirm the installation and website ownership.

Page verification

Start searching

Once verified, the search functionality will be live on your website.

Too complicated?

Reach out to our support, we are happy to help along the way. Our support engineers will guide you through the installation process in person.