DuckDuckGo search for your website

If you got your own place on the Internet, helping your visitors find what they are looking for is a great way to engage them and keep them staying a bit longer. A custom site search can achieve just that. Implement this feature with DuckDuckGo, a friendly search engine that doesn't track its users!

Tools of the trade

Quick links

DuckDuckGo: A different animal

DuckDuckGo (DDG for short) sprang to life in 2008. The name stems from the children's game duck, duck, goose. The company have their headquarters in Paoli, Pennsylvania. The search engine processed some 15 million direct daily queries as of early 2017.

Compare this to Google's 9 billion.

The engine uses over 400 sources in total, as well as own crawlers, to return "the best results, rather than the most results".

Its major differences from the popular search giants (you-know-who) are:

  • limited advertising on search results pages
  • no biased (personalized) search results
  • no search results censorship based on location
  • no tracking cookies
  • no IP address tracking

Create your DuckDuckGo search widget!

With the end of Google Site Search, the need for a reliable custom search with little advertising is out there.

If you don't offer a search function on your website or blog yet, think hard. 80% of Web use starts with a search. Your visitors just expect it to find their way around, and can be lost – in every sense – without it. Moreover, their queries let you know what they are looking for when visiting, so you can better understand their needs and suit those by providing this exact information.

DuckDuckGo logoDuckDuckGo mascot, Dax

Using DuckDuckGo search on your site is easy if you want it this way, but can be adjusted with many parameters to be as sophisticated as you need it.

You can generate a search widget for your domain on a dedicated page from DuckDuckGo (the link opens in a new browser tab/window).

However, the widget resides on the DuckDuckGo server – you access it through an iframe –, and is somewhat restricted in terms of search features and styling options.

If you prefer having full control over how the search results are fetched and presented, use the form below to configure a custom search you can host on your own site.

You will be able to test it immediately from this same page as you proceed.

NB: The widget is only functional in browsers with JavaScript turned on. There is no workaround for this, unfortunately.

The reason for this limitation is, the domain to search within (i.e., yours) must be part of the query string. Since your visitors are unlikely to type it in, it needs to be added in some way automatically. This is done by script.

Ready? Here you go! Make some easy choices, generate the code, and test your widget within minutes! If stuck, scroll down for further explanations and assistance.

Search settings

 
 Search for the exact entire phrase instead of single words.
 
 Let DuckDuckGo redirect search queries to Google, anonymously.

Behaviour

 
 Feeling ducky? Bypass the search results page, and instantly proceed to the first match. If no results are available, an empty results page will be shown.
 
 If you installed Google Analytics on your site, ticking this box will trigger an event every time your visitors use the search function. The query string will be recorded as event label.
 
 

Results page

Search widget

 
 Provide a hint for visitors with JavaScript turned off.

How it works

I tried to set up the configurator above as easy and straightforward to use as possible – that is, from my point of view. If you have difficulty with it, find some explanations below, or feel free to ask for assistance!

What you see is what you get, almost

The widget presented on this page uses the same generated code from the box below it. When you click on the update button, both elements receive the new code.

This code will work just the same way on your site, with following exceptions:

  • When you test the widget here, the results page will always open in a new tab or window, even if you didn't select this. This is done for two reasons: First, you don't have to jump back and forth between results and this page through your browser history. Second, you are able to compare results achieved with different settings. In any case, the widget installed on your site will behave exactly as you specified it.
  • If you choose to generate Google Analytics events with your widget, no such events can/will be generated when testing it from this page.
  • If you select a per cent value for the widget width, it will display differently on your site, depending on the container it will be placed in.
  • Since you can't update the widget with JavaScript disabled, you won't be able to see your version with the NOSCRIPT warning. However, if you turn JavaScript off and reload the page, you should get a feeling of how it might appear to your visitors. Be careful not to loose your settings while trying.

Some animals are more equal than others

Though you can choose any combination of settings, not all of them are 100% compatible.

For example, you can't search with Google over two domains. Or, you can't skip the results page when searching with Google.

When two conflicting options are chosen, the widget will behave to satisfy the one located earlier in the form.

This means in case of the above examples:

  • If you provide a second domain name, the widget will search with DuckDuckGo even if you'd prefer to search with Google.
    In other words: To search with Google, leave the alternate domain empty.
  • If you chose to search with Google – and didn't provide a second domain –, your visitors will land on the Google SERP no matter how you opted to deal with it.
    In other words: To bypass the results page, don't search with Google.

The conflicting settings are discussed, among other things, in the section below.

Tune it up

Search settings

Literal search

When you query for several words, engines behave differently if you enclose them in quotes. The returned results tend to contain the exact search phrase, as opposed to all its words found somewhere in the page.

I might be wrong, but I got the feeling that literal search also yields fewer advertisements.

Search with Google

As mentioned above, if you choose to search over two domains, this option is disregarded.

Behaviour

Fast forward to the first result

This option is only possible with DuckDuckGo search. Even in this case, the empty SERP will be shown if no results are available.

The good: If the search is successful, the visitor is sure to stay put.

The bad: The visitor is left without a choice.

Connect with Google Analytics

I think this is quite useful.

If you have Google Analytics installed on your site, this option can send an event every time your visitors search for something with the widget. The event category is set to Search, its action is the current page URL, while its label records the search query itself.

In this way, you will not only be able to monitor what your visitors are looking for on your site, but also to know which queries originate from what pages.

The events report is found in Analytics under Behavior/Events. Learn about events here.

If you don't use Google Analytics yet, you can still select this option, just in case. Including it is safe, no matter whether Analytics is in place on your site or not.

Show results/open links in new window

These options look alike, but work different. The first one concerns the SERP, while the second one affects the links on it.

The latter option is only in effect with DuckDuckGo search, not when searching with Google.

If neither is chosen, all redirects happen in the same tab. The original page gets replaced by the SERP, which leads to whatever the user selects on it, or inputs in its address or search bar, for that matter.

If you don't want to take a risk loosing your visitor on the SERP, these are your choices:

  • Select one of these options to minimise the chance of visitors straying off. (The SERP in a new window option is safer in this regard.)
  • Make use of the feeling ducky option to skip the SERP for good.
  • Work on your page titles, descriptions, and content to get that click from the SERP.

Whatever you decide, don't select both new tab options – this can be rather irritating.

Results page

The settings in this section are only in effect with DDG. They style the DuckDuckGo search results page.

Start with choosing the background colour for its header and content part. There are several presets, but you can also choose your own custom colour.

The next three settings style the result snippets. If you don't provide them, they will be chosen automatically over at DuckDuckGo's. Test these choices first, as they are surprisingly well made.

If you are after the exact look-and-feel of your site, follow the suggestions for choosing custom colours in their respective input boxes.

Search widget

Width

Use your favourite width specification together with units. Anything goes here — the value you enter is taken over as is.

Don't forget px if you choose pixels.

For responsive templates, per cent or viewport units would work best.

NOSCRIPT warning

The widget relies on JavaScript being enabled in visitor's browser. When selected, this option will show a corresponding hint to users with JavaScript turned off—other visitors won't be affected.

The standard message would look like This feature requires JavaScript to be turned on. in your site's style.

You can modify it to your liking; scroll to Advanced fine-tuning for details.

Button image

The original DuckDuckGo search widget only offers the green button, which can make some people actually avoid using it.

I can relate to it.

Choose your favourite one out of five here!

Testing and getting the code

Important notice: Changes you make in the configurator are not applied on the fly. To update the widget with your settings and generate its code, click on the Update widget button.

Essentially, if you still see your last search query in the input field, it's time to hit the Update button! The "loaded", up-to-date and ready-to-test widget will show the placeholder text instead.

To test the widget, just enter a sample query.

When you are satisfied with the results, click on Select code, then copy (Ctrl-C in Windows, Cmd-C on a Mac) and paste it (Ctrl-V or Cmd-V, respectively) in a simple text editor without fancy formatting options—plain text is all what you need.

Advanced fine-tuning

If you think you got everything you need, and can't wait to see it in action—wow, great! Double-check the code is still in the clipboard (just kidding). Skip the editor step above and the boring stuff below altogether, and proceed to Installing the widget. You are almost done.

Custom NOSCRIPT message

As mentioned above, the widget only works in JavaScript enabled browsers. If you expect that some of your visitors might have turned it off, opt for showing a short explanation.

To change the standard wording, e.g., translate it into another language, locate the <noscript>...</noscript> string in the generated code and replace its inner part, i.e., that represented by ..., with your own HTML content.

Other DuckDuckGo search parameters

If you opted for DuckDuckGo search, you can further adjust the results page, with custom fonts, for example. The complete list of available parameters is provided in the links section near the end of the page.

If you need help with applying some of them to your widget, send me your code along with the explanation of what you are trying to achieve.

Other search engines

If you believe that Bing or Yahoo! know your site better than Google or DDG do, it is possible to make one of them do the job. For this:

  • Generate your widget to Search with Google.
  • In its code, look for the string ?q=%21g (near the end).
  • Replace g with b for Bing, or y for Yahoo!
  • Install the modified code.

Keeping your button next to you

The generated widget code references button image files on my server. I don't expect it to crash under requests for them. However, if you want to keep the image on your site, or if you run the latter with HTTPS, follow these steps to move it there.

  • Click the Download button with your favourite button selected.
  • Save the image from the opening tab/window.
  • Upload the image to your site and locate it there – notice the folder name where it lands.
  • In the text editor with your code, find the string beginning with url( and replace the following http://www.plainlight.com/images with your own domain and folder.
  • Proceed with installing the widget below.

Widget style

The widget is self-contained, meaning its code includes the style as well.

To modify the input field and the button, try playing with the settings in the provided <style> element.

To change the global appearance, for example, the size of the enclosing div, edit its style attribute.

Installing the widget

Just paste your final code into an HTML file. If working with page templates, select a block which holds raw HTML and make it appear on all your pages. Rebuild, upload, and test for real. Finished!

This was easy, wasn't it? If you still have questions, feel free to ask!

Ask a question!

Please note that all fields followed by an asterisk must be filled in.
 
 

The very small print

The widget is free to use. I would only ask you to retain the leading comment in its code on your site. If you deem it useful, please spread the word!

Search with Scrabble

Tags: #customsearch #ComeToTheDuckSide #duckduckgo #widget

DuckDuckGo search
The search engine that doesn't track you. Make it your browser's default, and learn what it can do for you.
DuckDuckGo search parameters
The complete list of search parameters and their values for your widget.
IrfanView image viewer and editor
The buttons for the search widget were created from the DuckDuckGo green original in IrfanView. The shareware application has been around for over 15 years. I remember creating contact sheets for the first pages of my gallery with it, in 2002.

jscolor colour picker by Jan Odvarko.

Unattributed images on this page are sourced from public domain via Pixabay and Wikimedia Commons.

Site search with DuckDuckGo

Back to Top

Tell me what you think!

Is it useful 👍? Awful 👎? Leave a message! Your comments help making this site better (and give me a kick—one way or another).

Popular articles

  1. "Might as well have the best"

    Aiming for better images? Think better lenses! This is your most important piece of gear, so you better get it sorted out.—Need some advice?

    Read on

  2. A duck for a dog

    If you got your own place on the Internet, helping your visitors find what they are looking for is a great way to engage them and keep them staying a bit longer. A custom site search can achieve just …

    Read on

  3. Perfectly legal

    Going on a trip and bringing a camera along? — Great! However, be sure to know what you can photograph at your destination without breaking the law. The short answer to what is legal, is: it very much…

    Read on

Back to Top

What's new

  1. Outnumbered

    Aug 31, 17 04:48 AM

    We live by numbers. We make decisions based on them. We study ratings, statistics, and trends. We compare prices, count stars, and draw charts — first, then conclusions. Everything we do in the end …

    Read on

  2. Photoshopping

    Jul 21, 17 05:55 AM

    With almost 30 years of market presence under its belt, Photoshop is one of the most popular and powerful image editing software packages. From the beginning, it has become the tool of choice for many…

    Read on

Featured article