Adding DuckDuckGo Search to Your Website
Since my website is now powered by Hugo, the website just a bunch of static files. While that’s great for speed, one downside of being completely static is that there’s no dynamic searching capabilities built-in (such as with Wordpress).
A popular option is to add a DuckDuckGo search box to your website, which is great because your users get to take advantage of their great searching algorithms to search your website.
The primary downside to this approach, however, is that despite some limited styling options, the search box will likely look out of place on your website. Thankfully, there’s a very simple solution to this problem: create your own search box that directs the user to a DuckDuckGo search page.
First and foremost, a DuckDuckGo search box on your website does no good if your website isn’t indexed. There’s no page to submit your website directly to them, but there are indirect ways. It has been quite a while, but if I remember correctly, I submitted my website to Yandex and that ended up getting picked up by DuckDuckGo within a few days.
Here’s the little function that will do all the heavy lifting. You can add it to the bottom of your
<body> tag, or put it in a separate file.
On the line that starts with
var query = ..., you’ll want to replace “jonbeebe.net” with your domain name, otherwise you’ll be adding a site search for my website to yours.
What this function does is grab the input element with an
id of “searchField”, and redirect the user to a secure DuckDuckGo search page, filtered to only include results from your website.
HTML Search Box
Here’s an example of what the search form might look like (it’s what mine looks like):
This part is flexible, and it depends on your specific website. I chose to not have a “search” button and just have the user submit the form using Enter/Return. You’ll also want to style it with CSS to match your website design.
What you need keep is the first line, and to make sure the
id matches the one that is looked up in the
Once all that is in place, and your website is indexed by DuckDuckGo, your visitors will be able to search your website with a powerful search engine, and the search box will look exactly like you want it to. You can also substitute the DuckDuckGo search query URL with Google’s (or Bing, or whatever else supports site searches) if you prefer.
The only downside is that the search results page won’t be on your website, but I don’t think that’s an issue. After all, most of the links on the search page will take the user right back to your website. Even extremely high-profile blogs such as Daring Fireball kick the user to an external DuckDuckGo search page, so I take that as positive validation of the concept.