Custom search on iOS

05 Sep, 2024

I like to use a combination of Brave and Kagi searches, however on iOS you can't install your own search engines. This article describes how I managed to set up search behavior in Safari on iOS to my own liking.

Here is how it works:

• By default typing in Safari's URL bar searches with Brave.
• If the first word of the search is a single letter "k" then it automatically redirects the search to Kagi (while removing that first letter "k" from the search query).
• At the top of the Brave's search results page I display a yellow banner with a link to search the same query in Kagi (in case I am not satisfied with Brave's results).

Instructions

• Install Modificator from the app store.
• Open app, read instructions on how to use it, go to Settings > Safari > Extensions and make sure it's allowed to work on all website.
• Set "DuckDuckGo" as a default search engine in Safari's settings.
• Go back to app and click on a plus button.
• Switch to JS tab.
• For "Website URL" enter "https://duckduckgo.com/*".
• In a textbox below that enter the following JavaScript:

window.stop();
document.body.innerHTML = "";
var w = ((/q=([^&#=]*)/.exec(window.location.search))[1]).split("+");
if (w[0] === "k") {
    w.shift();
    window.location.replace("https://kagi.com/search?q=" + w.join("+"));
} else {
    window.location.replace("https://search.brave.com/search?q=" + w.join("+"));
}

• Save.
• Click on a plus button again, switch to JS tab.
• Under "Website URL" now enter "https://search.brave.com/*".
• In a textbox below that enter the following JavaScript:

var swke = document.getElementById("searchWithKagi");
if (!swke) {
    var q = /q=([^&#=]*)/.exec(window.location.search)[1];
    var body = document.getElementsByTagName("body")[0];
    var kagi = document.createElement("div");
    var link = document.createElement("a");
    link.href = "https://kagi.com/search?q=" + q;
    link.innerHTML = "Search with Kagi";
    kagi.appendChild(link);
    kagi.style.background = "yellow";
    kagi.style.textAlign = "center";
    kagi.style.padding = "10px";
    kagi.id = "searchWithKagi";
    body.insertBefore(kagi, body.firstChild);
}

• Save

You should be good to go now.