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.
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.