A powerful, customizable search widget for Web3 domain safety
Easily integrate the Kerberus Search Widget into your website to help users verify the safety of Web3 domains before interacting with them. Simple implementation with powerful customization options.
Enhance your website's experience with our powerful, easy-to-integrate security search widget
Verify the safety of Web3 sites against Kerberus' comprehensive threat intelligence live detection engines.
Add the widget to your website with just a few lines of code. No complex setup or configuration required.
Get immediate safety assessments for Web3 sites, helping users avoid scams and getting drained.
Easily adapt the widget's appearance to match your website's design with simple configuration options.
Integrate with your application's logic using the powerful JavaScript API for programmatic control.
Works flawlessly across all devices, from desktop to mobile, with a fully responsive design.
Add the Kerberus Search Widget to your website in three simple steps
Include the Kerberus Search Widget script in your HTML file. Place it before the closing </body> tag for best performance.
<script
src="https://cdn.kerberus.com/widgets/kerberus-search-widget-latest.js"
async defer></script>For Enhanced Security: Use Subresource Integrity (SRI) with a specific version.
Using SRI you won't get updates until you update the js version and SRI hash.
<script
src="https://cdn.kerberus.com/widgets/(loading...)"
integrity="(loading...)"
crossorigin="anonymous"></script>Create a container element where you want the widget to be displayed. The widget will automatically be initialized in any element with the ID kerberus-search-widget or kerberus-search-widget-dark.
<div id="kerberus-search-widget" data-api-key="YOUR_KERBERUS_API_KEY"></div>The widget will automatically initialize when the page loads. No additional configuration is required for basic functionality.
Tailor the widget to match your website's design and requirements
The widget can be customized using data attributes on the container element. These attributes allow you to change the appearance and behavior of the widget.
| Attribute | Description | Default Value |
|---|---|---|
data-placeholder | Custom placeholder text for the search input | "Enter a Web3 site to check its safety..." |
data-dark-mode | Enable dark mode for the widget | "false" |
data-api-key | Your Kerberus API key for authentication | None (demo mode) |
data-ref-code | Your referral code for tracking installations | None |
<div id="kerberus-search-widget"
data-placeholder="Enter a web3 domain to check..."
data-dark-mode="false"
data-api-key="YOUR_KERBERUS_API_KEY"
data-ref-code="YOUR_REFERRAL_CODE"
></div>Use the controls below to customize a widget and see the results in real-time:
Programmatically interact with the Kerberus Search Widget
The widget provides a JavaScript API that allows you to interact with it programmatically. This can be useful for triggering searches or responding to search results from your own code.
// Trigger a search programmatically
const event = new CustomEvent('kerberus:search', {
detail: { domain: 'example.eth' }
});
window.dispatchEvent(event);// Listen for search results
window.addEventListener('kerberus:result', (event) => {
const { domain, isBlocked } = event.detail;
console.log(`Domain $${domain} is $${isBlocked ? 'unsafe' : 'safe'}`);
});Take your implementation to the next level with advanced features
You can dynamically create and add widgets to your page after it has loaded:
// Create a new container element
const container = document.createElement('div');
container.id = 'kerberus-search-widget';
container.setAttribute('data-dark-mode', 'true');
// Add it to the DOM
document.getElementById('my-container').appendChild(container);
// The widget will be automatically initializedYou can have multiple widgets on the same page with different configurations: