Hi,
I did not realise this forum was specifically for Webflow.
I integrated it into a website that does not use Webflow.
I used Tipue static mode because it is easiest to implement and does not need an external server.
I imagine it can work in Webflow though - you can add custom scripts and code:
This is the code that needs to go in the body, where you want the search form to appear:
<form action="search.html">
<input type="text" name="q" id="tipue_search_input" autocomplete="off" required>
<!--<input type="button" id="tipue_search_button" onclick="this.form.submit();"> -->
</form>
search.html in this case is the page where the search results will be shown.
This is the javascript needed to activate the search function:
<script>
$(document).ready(function() {
$('#tipue_search_input').tipuesearch({
'show': 10,
'newWindow' : false,
'showURL' : false,
'showTitleCount' : true,
'descriptiveWords' : 20,
'highlightTerms' : true,
'mode': 'static',
});
});
</script>
It needs to go in the body section as well, underneath the code for the search form.
In the head section you will need to add links to the Tipue javascript files, like this:
<!--- Search functionality --->
<script type="text/javascript" src="tipuesearch/tipuesearch_set.js"></script>
<script type="text/javascript" src="tipuesearch/tipuesearch_content.js"></script>
<script type="text/javascript" src="tipuesearch/tipuesearch.min.js"></script>
<!--- End search functionality --->
So in this case the files are in a folder called ‘tipuesearch’. You can also store them elsewhere on the web and link to the URL. I imagine it will also work if you simply add it as javascript code to your Webflow project.
You can also simply add the CSS for Tipue to your already existing CSS code.
Make sure to add all your site’s content to the tipuesearch_content javascript.
I hope this helps.
-Ralph