Basics
The embedded widget variant is the easiest integration. We provide you with a code snippet you can add to your search page.
The basics
Step 1: add the div with a unique id
<div id="searchinenet"></div>
Step 2: Add the snippet to your page.
<script type="text/javascript">
window._sn = window._sn || [];
window._sn.config = {
engineid: '-- insert your id --'
};
window._sn.widgets = [];
window._sn.widgets.push({
container: '#searchinenet',
engineid: '-- insert your id --'
});
</script>
<script type="text/javascript">
(function () {
var snloadf = function() {
if (typeof window.__snld != "undefined") { return; }
window.__snld = 1;
var s = document.getElementsByTagName("script")[0];
var b = document.createElement("script");
b.type = "text/javascript";
b.async = true;
b.id = "snscript";
b.src = "//cdn.searchine.net/scripts/searchine.min.js";
s.parentNode.insertBefore(b, s);
};
setTimeout(snloadf, 0);
})();
</script>
The Engine ID is located on the Search Configuration page in our portal.
Press the icon for "Get embed script" that will give you a preview of the Iframe widget. Above the preview you can find the Engine ID.
The best practice is to add the snippet just before the </body> tag.
Part 3: Enjoy your search
Example:
More options
Styling
Out of the box the colours and styles from the website will be used.
This is done by the script that will interpret and calculate the colours based on the parent HTML element that was added in step 1.
You can also provide a set of colours to style the widget and override this behaviour.
More about styling options
Custom options
You can translate labels like the text in the search button and enable / disable some other options.
Read more about this here.
Methods / events
The embedded widget comes with some events.