Multiple search fields (different engines) on the same page without jQuery


The typical installation from the admin panel is done by adding an engine via:

(function (w, d, t, u, n, s, e) {
                        w['SwiftypeObject'] = n;
                        w[n] = w[n] || function () {
                            (w[n].q = w[n].q || []).push(arguments);
                        s = d.createElement(t);
                        e = d.getElementsByTagName(t)[0];
                        s.async = 1;
                        s.src = u;
                        e.parentNode.insertBefore(s, e);
                    })(window, document, 'script', '//', '_st');

                    _st('install','api-key', '2.0.0');

And then in the admin panel you can set a class of the search field.

.st-default-search-input and for example you can create a .st-custom-search-input.

However, with two search fields you’d also need two api keys probably.

How can two engines be added on the same page for different search input fields?