diff --git a/docs/tutorial/browser-search-engine.md b/docs/tutorial/browser-search-engine.md new file mode 100644 index 0000000..2d48c4b --- /dev/null +++ b/docs/tutorial/browser-search-engine.md @@ -0,0 +1,89 @@ +--- +sidebar_position: 16 +title: "Browser Search Engine Integration" +--- + +# Browser Search Engine Integration + +Open WebUI allows you to integrate directly into your web browser. This tutorial will guide you through the process of setting up Open WebUI as a custom search engine, enabling you to execute queries easily from your browser's address bar. + +## Setting Up Open WebUI as a Search Engine + +### Prerequisites + +Before you begin, ensure that: + +- You have Chrome or another supported browser installed. +- The `WEBUI_URL` environment variable is set correctly, either using Docker environment variables or in the `.env` file as specified in the [Getting Started](getting-started/env-configuration) guide. + +### Step 1: Set the WEBUI_URL Environment Variable + +Setting the `WEBUI_URL` environment variable ensures your browser knows where to direct queries. + +#### Using Docker Environment Variables + +If you are running Open WebUI using Docker, you can set the environment variable in your `docker run` command: + +```bash +docker run -d \ + -p 3000:8080 \ + --add-host=host.docker.internal:host-gateway \ + -v open-webui:/app/backend/data \ + --name open-webui \ + --restart always \ + -e WEBUI_URL="https://" \ + ghcr.io/open-webui/open-webui:main +``` + +Alternatively, you can add the variable to your `.env` file: + +```plaintext +WEBUI_URL=https:// +``` + +### Step 2: Add Open WebUI as a Custom Search Engine + +#### For Chrome: + +1. Open Chrome and navigate to **Settings**. +2. Select **Search engine** from the sidebar, then click on **Manage search engines**. +3. Click **Add** to create a new search engine. +4. Fill in the details as follows: + - **Search engine**: Open WebUI Search + - **Keyword**: webui (or any keyword you prefer) + - **URL with %s in place of query**: + ``` + https:///?q=%s + ``` +5. Click **Add** to save the configuration. + +![Add Custom Search Engine](/img/tutorial_add_search_engine.png) + +### Optional: Using Specific Models + +If you wish to utilize a specific model for your search, modify the URL format to include the model ID: + +``` +https:///?models=&q=%s +``` + +**Note:** The model ID will need to be URL-encoded. Special characters like spaces or slashes need to be encoded (e.g., `my model` becomes `my%20model`). + +## Example Usage + +Once the search engine is set up, you can perform searches directly from the address bar. Simply type your chosen keyword followed by your query: + +``` +webui your search query +``` + +This command will redirect you to the Open WebUI interface with your search results. + +## Troubleshooting + +If you encounter any issues, check the following: + +- Ensure the `WEBUI_URL` is correctly configured and points to a valid Open WebUI instance. +- Double-check that the search engine URL format is correctly entered in your browser settings. +- Confirm your internet connection is active and that the Open WebUI service is running smoothly. +