Adding a search capability to a Hugo website
Posted: | Categories: “tech"
Today, I added a way to search for content in frankcontrepois.com simply by adding the following lines to my Hugo header. <div class="input-group"> <input id='search-input' type="text" class="form-control" placeholder="Search for..."> <span class="input-group-btn"> <button id='search-button' class="btn btn-default">Go!</button> </span> </div> <script type="text/javascript"> var button = document.getElementById('search-button'); var input = document.getElementById('search-input'); function performSearch() { var query = '?q=site%3Afrankcontrepois.com+' + encodeURIComponent(input.value); window.open('https://duckduckgo.com/' + query, '_blank'); } button.onclick = performSearch; input.addEventListener('keydown', function(event) { if (event.key === 'Enter') { performSearch(); } }); </script> Read more...