How do I include images in the autocomplete results when using the Swiftype Search plug-in for WordPress?
To customize the autocomplete dropdown for your search engine built with the Swiftype plug-in for WordPress, you’ll need to create a customRenderFunction
to be added to your theme’s functions.php
.
Here’s a general snippet to get you started:
<?php
function swiftype_javascript_config() {
?>
<script type="text/javascript">
var customRenderFunction = function(document_type, item) {
var title = item['highlight']['title'] || Swiftype.htmlEscape(item['title']);
var image = item['image'];
return '<p class="title"><img src="' + image + '">' + title + '</p>';
};
var swiftypeConfig = {
renderFunction: customRenderFunction
};
</script>
<?php
}
add_action('wp_head', 'swiftype_javascript_config');
?>
As long as you’re indexing thumbnail image values to your engine, you should now have images in your autocomplete dropdown!