Please ask your question on our Shopify forum: https://discourse.algolia.com/c/shopify.
This way, you'll get access to other great minds using our integration and anybody with the same question in the future will be able to benefit from the solution.
Our aim is to make our integration work with as much themes as possible.
However, we can't guarantee that this will be the case.
If you're having CSS issues with the autocomplete, please reach out to us on our forum so that we can try to improve the autocomplete to be fully theme-independent.
However, if you want to use as a replacement for your search page, there are too many factors that we won't be able to fully cover.
You should expect having some CSS to do in order to have it fully integrated in your theme.
To help you debug front-end issues in a theme that isn't your live one, we'll need to see this specific theme in action. We'll hence ask you to share with us a preview link to the theme you're installing us in.
Getting it is easy:
Also, if your store isn't live yet, you might be using a password to block users. If you feel like this is sensitive, feel free to send it to us via email with a link to the associated question on our forum.
No! The application is really split in two tasks: data indexing and front-end implementation. You can definitely only use the app to index data.
This can be useful in multiple cases:
- You want to use those indices elsewhere than Shopify
- The implementation you want to do is too far from ours to use it as a base
Absolutely! You can find some detailed explanations on this page.
This is expected to happen from time to time. There are multiple points in the data duplication chain that could explain some records being out of sync.
In that case, head to the Settings tab of the application and click the
Reindex button of the faulty data type. This will trigger a full reindex (which can take up to 24 hours), after which your data should be updated as expected.
If your data keeps getting out of sync, this might be a sign of an indexing error on our side. Please report it to us so that we can investigate what could be the cause.
More information in the Indexing introduction section of the documentation.
Indexing with the app works in two steps:
- Complete reindexing: This consists in creating a completely new index by listing all of your products / collections / blog posts / pages.
- Real-time updating: This relies on Shopify webhooks to keep your index up to date
When doing a complete reindexing, we'll browse through your list of products and save them in a temporary index. When complete, this index then replaces your live index with a fully up to date index.
This step can be slow, especially when using Metafields, as we'll need to run a Shopify API request for each product to retrieve them. See our Metafields section for more information.
Blog posts and Pages do not have update webhooks, so we provide a periodic complete reindexing instead.
Here's the full lifecycle of a product update:
Shopify When you save a product in Shopify, it's added to a Shopify internal queue, where it waits for previous jobs to be executed before being itself processed. When this job is processed, Shopify will now have an updated product for your store, and loading it in your store should show it up to date. When the job has finished processing, this job will then be sent to our Algolia for Shopify app with a webhook.
Algolia for Shopify app We'll receive this webhook call, and add an indexing job to our app's internal queue. When the job processes, it forwards this update to the Algolia API.
Algolia API The Algolia API itself also has an indexing queue in which those jobs will be added. Once processed, search results will have the up to date version of your product.
Both the Shopify API and the Algolia API can be bottlenecks if they're heavily loaded. However, this should be fairly rare, as those two are heavily optimized.
The main bottleneck will often be our app, which, since it's provided for free, has limited resources. We've done a lot of optimizations since our first release as you can see in our ChangeLog, but if your frequency of updates is too big, we might process updates slower than you're sending them to Shopify.
Using metafields will not slow down this step, as Shopify allows to ask for metafields to be included within webhooks.
If you believe that your indexing is stuck, please first check that you have no error when opening the app. If you don't, don't hesitate to contact us to investigate.
Definitely! You'll find at the bottom of the Credentials tab a field to change the index prefix used in Algolia.
Just set up each of your stores with a different prefix, and you're good to go!
Of course! In order to do this, just follow the steps explained in Collection search page.
If you're using an external system to manage your theme files, you should have an exclusion on one of our files,
Indeed, this file contains the front-end settings that you configure in our admin interface.
An example of this would be when you change the amount of products displayed on the search page.
Our front-end code needs to have this updated information.
The way we do this is by updating the
algolia_config.js.liquid file on every change you make in the admin interface.
An issue arises if you:
- copy all of our files in your theme to an external system
- do modifications in our admin interface which modifies the live
- do code changes in this system
- then deploy your code with the old version of the file which will override the new one
The easy solution is that most of those systems allow you to add an ignore rule. Just add a rule for this file, and everything should work fine!
To keep your data up to date between Shopify and Algolia, we're registering to webhooks provided by Shopify.
You should never have this warning, but it happens that we're not able to register correctly to those webhooks (e.g. a network error for instance).
In that case, you'll need to :
- Restore the webhooks by clicking the button in the warning
- Optionally reindex everything from the Settings tab
When opening your layout file, you might be concerned about the performance impacts of our app. Indeed, we're installing and loading quite a few files.
There are multiple things to be aware of there:
How is all of this impacting your page load time? Snippets are loaded while your page is rendered and executing liquid. They're all small, so their impact is negligible. Assets are loaded using external requests for each of them. Libraries take some time to be fetched (<1M total) and the scripts are really small, but the big bottleneck is on the HTTP requests needed to fetch them.
Fetching them will be required only once, which on the first load of your page by a customer. Furthermore, they're all hosted on the Shopify CDN, which is distributed around the globe to send those page faster. Finally, most browsers will actually run 5 or 6 HTTP requests in parallel, so we're actually talking about two or three round-trips only.
This is a valid suggestion, and there is an easy way to do so.
- Open your layout file (often
- Identify the block delimited by
<!-- Algolia head -->and
<!-- /Algolia head -->
- Move it just before your closing
</body>tag, which should be at the very end of the file
The reason we're not doing this by default is because almost all of the Shopify scripts we've seen are added inside the
This allows our users to clearly see that there was code appended.
Most themes already include jQuery, but since some don't, or include an old version, we need to include it everytime.
However, if you're using a recent version of jQuery, you might want to remove ours.
Simply remove the line including it from the block.
You'll also need to edit one file,
// Replace algolia.$ = algolia.jQuery = $.noConflict(true); // By algolia.$ = algolia.jQuery = $;
If you are not using Autocomplete, then you can remove:
If you are not using Instant Search, then you can remove:
instantsearch.jslibrary (both the CSS and JS file)