Missing something simple in setup

Hello, I’m struggling with an initial setup of Algolia on my PHP site. I have indexed my db, and can see results using the search demo in my dashboard indices. So, for lack of a better solution, I’m asking for help here by pasting my code (minus my key and app id) that I’m using for my app.js file, and my index.html file. I basically copied and pasted from the tutorial. What am I missing?
You can see the broken search page at: http://www.malikoutdoor.com/searchy/
Try searching for the string ‘planter’ which should yield results. Any assistance would be much appreciated!!

app.js

var search = instantsearch({
// Replace with your own values
appId: ‘xxxxxxx’,
apiKey: ‘xxxxxxxxxx’, // search only API key, no ADMIN key
indexName: ‘products’,
urlSync: true,
searchParameters: {
hitsPerPage:5
}
});

search.addWidget(
instantsearch.widgets.searchBox({
container: ‘#search-input
})
);

search.addWidget(
instantsearch.widgets.hits({
container: ‘#hits’,
templates: {
item: document.getElementById(‘hit-template’).innerHTML,
empty: “We didn’t find any results for the search “{{query}}”
}
})
);

search.start();

index.html

<!doctype html>

<script type="text/html" id="hit-template">
{{name}}

{{{_highlightResult.name.value}}}

${{price}}

{{{_highlightResult.description.value}}}

You just need to update your hit-template to match your particular schema.

For example, instead of the tutorial’s {{{_highlightResult.name.value}}}, you’d want {{{_highlightResult.product_name.value}}} as your results have product_name (not name).

PS - welcome to Algolia.

Chad, thank you! Mystery solved, and yes, it was something simple I was missing. :slight_smile:

1 Like

One more question for the experts out there. Is there a way to force upper or lowercase values on an Algolia variable when rendering? In my case, my image names are the lowercase version of my item numbers in my database. So I need to force lowercase on {{{_highlightResult.item_number.value}}} in order to see my images. Any help would be much appreciated.

Hi Andrew, you could use transformData to create a new field that would store this value in lowercase https://community.algolia.com/instantsearch.js/v2/widgets-common-api.html#transformdata

Hi Andrew, you could also use {{{_highlightResult.item_number.value.toLowerCase()}}} to get the lowercase of the variable.