CINXE.COM

Integrate Salesforce Commerce Cloud with Algolia | Algolia

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html lang="en" xmlns="http://www.w3.org/1999/xhtml"> <head><link rel="canonical" href="https://www.algolia.com/search-solutions/salesforce-commerce-cloud" /><link rel="alternate" hreflang="en" href="https://www.algolia.com/search-solutions/salesforce-commerce-cloud" /> <link rel="alternate" hreflang="de" href="https://www.algolia.com/de/search-solutions/salesforce-commerce-cloud" /> <link rel="alternate" hreflang="fr" href="https://www.algolia.com/fr/search-solutions/salesforce-commerce-cloud" /> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Integrate Salesforce Commerce Cloud with Algolia | Algolia</title> <meta content="width=device-width, initial-scale=1, maximum-scale=1, viewport-fit=cover" name="viewport"> <!--Global Level META DATA Here <meta charset="utf-8"> Niket --> <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, viewport-fit=cover"> <meta name="og:sitename" content="Algolia"> <meta name="og:type" content="website"> <meta name="twitter:site" content="@algolia"> <meta name="twitter:domain" content="www.algolia.com"> <meta name="twitter:card" content="summary_large_image"> <meta name="msapplication-TileColor" content="#003DFF"> <meta name="theme-color" content="#003DFF"> <meta name="google-site-verification" content="unmVpnHdKJyjZSxuXKPyWxx8HRmb9VCCaBHQw4uCsW4"> <script type="application/ld+json"> [ { "@context": "http://schema.org", "@type": "Organization", "name": "Algolia", "url": "https://www.algolia.com/", "logo": "https://www.algolia.com/algolia-logo-blue.svg", "image": "https://www.algolia.com/files/live/sites/algolia-assets/files/opengraph/algolia-opengraph-image.jpg", "description": "Fast, reliable and modern Search & Discovery", "address": { "@type": "PostalAddress", "streetAddress": "3790 El Camino Real, Unit #518", "addressLocality": "Palo Alto", "addressRegion": "California", "postalCode": "94306", "addressCountry": "USA" }, "sameAs": [ "https://www.linkedin.com/company/algolia/", "https://www.facebook.com/algolia/", "https://www.github.com/Algolia/", "https://www.youtube.com/user/Algolia/", "https://www.twitter.com/Algolia/", "https://www.instagram.com/algoliahq/" ], "contactPoint" : [ { "@type" : "ContactPoint", "url": "https://www.algolia.com/demorequest/", "contactType": "prospects" }, { "@type" : "ContactPoint", "url": "https://www.algolia.com/contact/enterprise/", "contactType": "enterprise" }, { "@type" : "ContactPoint", "url": "https://www.algolia.com/for-open-source/", "contactType": "open source" } ] }, { "@context": "http://schema.org", "@type": "WebSite", "url": "https://www.algolia.com/", "name": "Algolia", "alternateName": "AlgoliaSearch", "potentialAction": [{ "@type": "SearchAction", "target": "https://www.algolia.com/search/?query={search_term_string}", "query-input": "required name=search_term_string" }] }, { "@context": "http://schema.org", "@type": "SpeakableSpecification", "xpath": [ "/html/head/title", "/html/head/meta[@name='description']/@content" ] } ] </script><!--Global Level META DATA Ends Here--> <!--Page Level META DATA--> <meta name="description" content="Need a fast Salesforce commerce cloud search solution? Increase conversions + accelerate your business with Algolia鈥檚 Salesforce Commerce Cloud Search."> <meta name="og:title" content="Integrate Salesforce Commerce Cloud with Algolia | Algolia"> <meta name="og:description" content="Need a fast Salesforce commerce cloud search solution? Increase conversions + accelerate your business with Algolia鈥檚 Salesforce Commerce Cloud Search."> <meta name="og:url" content="/cms/render/live/en/sites/www/home/search-solutions/salesforce-commerce-cloud.html"> <meta name="twitter:title" content="Integrate Salesforce Commerce Cloud with Algolia | Algolia"> <meta name="twitter:description" content="Need a fast Salesforce commerce cloud search solution? Increase conversions + accelerate your business with Algolia鈥檚 Salesforce Commerce Cloud Search."> <!--Meta Data Section Ends Here--> <link rel="icon" type="image/png" sizes="32x32" href="/files/live/sites/algolia-assets/files/algoliaweb-static-favicons/light-mode/favicon-32x32.png" media="(prefers-color-scheme: light)"/> <link rel="icon" type="image/png" sizes="16x16" href="/files/live/sites/algolia-assets/files/algoliaweb-static-favicons/light-mode/favicon-16x16.png" media="(prefers-color-scheme: light)"/> <link rel="manifest" href="/files/live/sites/algolia-assets/files/algoliaweb-static-favicons/light-mode/site.webmanifest" media="(prefers-color-scheme: light)"/> <link rel="mask-icon" href="/files/live/sites/algolia-assets/files/algoliaweb-static-favicons/light-mode/safari-pinned-tab.svg" media="(prefers-color-scheme: light)" color="#003DFF"/> <link rel="apple-touch-icon" sizes="180x180" href="/files/live/sites/algolia-assets/files/algoliaweb-static-favicons/dark-mode/apple-touch-icon.png" media="(prefers-color-scheme: dark)"/> <link rel="icon" type="image/png" sizes="32x32" href="/files/live/sites/algolia-assets/files/algoliaweb-static-favicons/dark-mode/favicon-32x32.png" media="(prefers-color-scheme: dark)"/> <link rel="icon" type="image/png" sizes="16x16" href="/files/live/sites/algolia-assets/files/algoliaweb-static-favicons/dark-mode/favicon-16x16.png" media="(prefers-color-scheme: dark)"/><script type="text/javascript" src="https://cdn.cookielaw.org/consent/5e9f5149-bde8-4a13-b973-b7a9385e8ebb-test/OtAutoBlock.js" ></script> <script src="https://cdn.cookielaw.org/scripttemplates/otSDKStub.js" type="text/javascript" charset="UTF-8" data-domain-script="5e9f5149-bde8-4a13-b973-b7a9385e8ebb-test" ></script> <script type="text/javascript"> function OptanonWrapper() { } </script><script> !function(){var analytics=window.analytics=window.analytics||[];if(!analytics.initialize)if(analytics.invoked)window.console&&console.error&&console.error("Segment snippet included twice.");else{analytics.invoked=!0;analytics.methods=["trackSubmit","trackClick","trackLink","trackForm","pageview","identify","reset","group","track","ready","alias","debug","page","once","off","on","addSourceMiddleware","addIntegrationMiddleware","setAnonymousId","addDestinationMiddleware"];analytics.factory=function(e){return function(){var t=Array.prototype.slice.call(arguments);t.unshift(e);analytics.push(t);return analytics}};for(var e=0;e<analytics.methods.length;e++){var key=analytics.methods[e];analytics[key]=analytics.factory(key)}analytics.load=function(key,e){var t=document.createElement("script");t.type="text/javascript";t.async=!0;t.src="https://cdn.segment.com/analytics.js/v1/" + key + "/analytics.min.js";var n=document.getElementsByTagName("script")[0];n.parentNode.insertBefore(t,n);analytics._loadOptions=e};analytics._writeKey="eEj3ERCjH7KxK1jEMjQF7uzmtZGALFHn";;analytics.SNIPPET_VERSION="4.15.3"; analytics.load("eEj3ERCjH7KxK1jEMjQF7uzmtZGALFHn"); //"eEj3ERCjH7KxK1jEMjQF7uzmtZGALFHn" //eEj3ERCjH7KxK1jEMjQF7uzmtZGALFHn analytics.page(); }}(); </script><link rel="icon" type="image/x-icon" href="/files/live/sites/algolia-assets/files/icons/algolia-logo-for-favicon.svg"> <script src="/modules/algolia-base-template/javascript/header.js"></script> <script src="/modules/algolia-base-template/javascript/codeExchangeSearch.js"></script> <script type="application/json" id="jahia-data-ctx">{"contextPath":"","lang":"en","uilang":"en","siteUuid":"5dd2fdd4-a9a0-46fe-8b1b-f7457ee77e1d","wcag":true,"ckeCfg":""}</script> <script type="application/json" id="jahia-data-ck">{"path":"/modules/ckeditor/javascript/","lng":"en_US"}</script> <script src="/javascript/initJahiaContext.js"></script> <link id="staticAssetCSS0" rel="stylesheet" href="/generated-resources/1aee5d23b42294f0b619d59ac8c157.min.css" media="screen" type="text/css"/> <script id="staticAssetJavascript0" src="/generated-resources/e54217558753b5c689fea22bbd56206d.min.js" ></script> <script type="text/javascript" nonce="NmE5ZDg2NGEtNGU4Yy00NmIyLWFmMWYtOTQxNThjZDJiMDEw"> window.digitalDataOverrides = []; window.digitalData = { "scope": "www", "site": { "siteInfo": { "siteID": "5dd2fdd4-a9a0-46fe-8b1b-f7457ee77e1d" } }, "page": { "pageInfo": { "pageID": "a8f3ecd6-810e-4eb1-9c35-e4c6aa9ab965", "nodeType": "jnt:page", "pageName": "Integrate Salesforce Commerce Cloud with Algolia | Algolia", "pagePath": "/sites/www/home/search-solutions/salesforce-commerce-cloud", "templateName": "home", "destinationURL": document.location.origin + document.location.pathname, "destinationSearch": document.location.search, "referringURL": null, "language": "en", "categories": [], "tags": [] }, "consentTypes":[ ] }, "events": [], "contextServerPublicUrl": "/modules/jexperience/proxy/www", "sourceLocalIdentifierMap" : {}, "wemInitConfig": { "contextServerUrl" : "/modules/jexperience/proxy/www", "isPreview": false, "timeoutInMilliseconds": 1500, "dxUsername" : "guest", "contextServerCookieName" : "context-profile-id", "activateWem": true, "enableWemActionUrl": "/en/sites/www.enableWem.do", "requiredProfileProperties": ['j:nodename'], "requiredSessionProperties": [], "requireSegments": false, "requireScores": false }, }; // Expose Wem init functions wem.init(); </script> <script type="application/json" id="jahia-data-aggregatedjs">{"scripts":["/modules/jexperience/javascript/jexperience/dist/3_5_1/wem.min.js","/modules/ad-base-components/javascript/component/ctaGradient.js","/modules/ad-base-components/javascript/component/logoPopover.js","/modules/algolia-base-components/javascript/component/accordion.js","/modules/ad-base-components/javascript/component/banner.js","/modules/algolia-base-template/javascript/screenTab.js"]}</script> <script type="text/javascript" src="/modules/CsrfServlet"></script> </head> <body data-tracking="salesforce-commerce-cloud" class=" font-inter text-base" data-site-theme="dark" data-parent-theme="" data-page-theme="light" data-languageparam="websitelanguage" data-indexnameprefix="ALGOLIA_WWW" > <!-- Header Component --> <div class="dark inset-0 z-[999] sticky "> <!-- Over Ride Footer Logic is written in footer-logic--> <li id="languageSwitcher" class=" flex items-center languageSwitcher border-0 border-l-1 border-solid py-1 lg:pl-4 pl-0 border-grey-700 z-[99] hidden"> <div class="lg:relative lg:flex lg:items-center"> <button href="javascript:void(0);" class="dropdown-toggle flex cursor-pointer appearance-none items-center rounded-lg border-0 lg:p-1 text-grey-900 gap-1" aria-haspopup="listbox" aria-expanded="false" id="dropdownMenuLink" data-bs-toggle="dropdown"> <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="#1E59FF" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="text-grey-900 dark:text-white"> <circle cx="12" cy="12" r="10"></circle> <line x1="2" y1="12" x2="22" y2="12"></line> <path d="M12 2a15.3 15.3 0 0 1 4 10 15.3 15.3 0 0 1-4 10 15.3 15.3 0 0 1-4-10 15.3 15.3 0 0 1 4-10z"> </path> </svg> <p class="font-inter font-normal leading-normal lg:text-sm text-xs dark:text-white text-grey-900 m-0 lg:mx-2 capitalize"> <span id="showDefaultLanguage"></span> </p> <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="text-grey-900 dark:text-white"> <polyline points="6 9 12 15 18 9"></polyline> </svg> </button> <div class="lg:absolute lg:right-1 lg:top-[42px] languageList" hidden> <ul class="z-max w-[150px] list-none overflow-hidden rounded-lg p-0 shadow-small-light" role="listbox"> <a title="Switch to " class="de font-inter leading-normal lg:text-sm text-xs text-grey-900 m-0 capitalize" href="/de/search-solutions/salesforce-commerce-cloud/"> <li data-language-code="de" class="dropdown-item dropdown-item w-[100px] cursor-pointer p-4 bg-grey-100 hover:bg-grey-200 w-full"> Deutsch</li> </a> <a href="#" class="en font-inter leading-normal lg:text-sm text-xs text-xenon-600 m-0 capitalize"> <li data-language-code="en" class="active bg-xenon-200 dropdown-item w-[100px] cursor-pointer p-4 w-full"> English</li> </a> <a title="Switch to " class="fr font-inter leading-normal lg:text-sm text-xs text-grey-900 m-0 capitalize" href="/fr/search-solutions/salesforce-commerce-cloud/"> <li data-language-code="fr" class="dropdown-item dropdown-item w-[100px] cursor-pointer p-4 bg-grey-100 hover:bg-grey-200 w-full"> fran莽ais</li> </a> </ul> </div> </div> </li> <script> document.addEventListener("DOMContentLoaded", function() { let activeElement = document.querySelector("#languageSwitcher .active"); const languageCode = document.querySelector('#languageSwitcher .active').getAttribute("data-language-code"); function updateDefaultLanguageText() { if (activeElement && activeElement.textContent) { const defaultLanguage = activeElement.textContent.trim(); const showDefaultLanguage = document.querySelector("#languageSwitcher #showDefaultLanguage"); showDefaultLanguage.classList.add(languageCode) if (window.matchMedia("(max-width: 768px)").matches) { showDefaultLanguage.innerHTML = defaultLanguage; } else { showDefaultLanguage.innerHTML = defaultLanguage.length > 3 ? defaultLanguage.substring(0, 3) : defaultLanguage; } } } const toggleButton = document.querySelector("#dropdownMenuLink"); const content = document.querySelector(".languageList"); const languageDropButton = document.querySelector('.languageSwitcher .dropdown-toggle'); languageDropButton.addEventListener("click", function (event) { event.stopPropagation(); if (content.hasAttribute('hidden')) { content.removeAttribute('hidden'); languageDropButton.setAttribute("aria-expanded", "true"); } else { content.setAttribute('hidden', ''); languageDropButton.setAttribute("aria-expanded", "false"); } }); document.body.addEventListener("click", function () { content.setAttribute('hidden', '') }); function appendLanguageSwitcher() { const languagesNode = document.querySelector(".languageSwitcher"); const topNavDesktop = document.querySelector(".header__top-nav ul"); const topNavMobile = document.querySelector(".header__top-nav.mobile ul"); if (window.matchMedia("(max-width: 768px)").matches) { if (topNavMobile && languagesNode) { if (!topNavMobile.querySelector(".languageSwitcher")) { topNavMobile.appendChild(languagesNode); } } } else { if (topNavDesktop && languagesNode) { if (!topNavDesktop.querySelector(".languageSwitcher")) { topNavDesktop.appendChild(languagesNode); } } } languagesNode.classList.remove('hidden'); updateDefaultLanguageText(); } appendLanguageSwitcher(); window.addEventListener("resize", appendLanguageSwitcher); window.addEventListener("resize", updateDefaultLanguageText); }); // Function to add a trailing slash only if conditions are met // function addTrailingSlash(url) { // // Check if the URL contains '#' or '.' and return without modification // if (url.includes('#') || url.includes('.')) { // return url; // } // // Check if the last character is not a '/' // if (url.charAt(url.length - 1) !== '/') { // // Add a '/' to the end of the URL // url += '/'; // } // return url; // } // // Function to update all <a> elements on the page // function updateAnchorHrefs() { // // Get all <a> elements in the document // const anchors = document.querySelectorAll('a[href]'); // // Loop through each <a> element // anchors.forEach(anchor => { // let href = anchor.getAttribute('href'); // Get the current href value // // Only update if href starts with a valid path (avoid mailto, tel, etc.) // if (href.startsWith('http') || href.startsWith('/')) { // let updatedHref = addTrailingSlash(href); // Add trailing slash if necessary // anchor.setAttribute('href', updatedHref); // Update the href attribute // } // }); // } // // Call the function to update <a> hrefs when the DOM is fully loaded // document.addEventListener('DOMContentLoaded', updateAnchorHrefs); </script><header data-tracking="" class="header-bg after:lg:block after:hidden inset-0 z-[999] sticky lg:border-b lg:border-grey-200 text-white dark:bg-xenon-900 bg-white"> <div class="header__top-nav h-10 justify-between hidden lg:flex max-w-[1440px] mx-auto lg:px-14 px-4"> <a href="/products/features/data-transformation" data-gtm="true" class="no-underline flex items-center no-underline"> <p class="font-inter font-normal leading-1.5 text-sm text-grey-900 my-0 mr-2 font-semibold"> <span class="text-xenon-400">New:</span></p> <p class="font-inter font-normal leading-1.5 text-sm dark:text-white text-grey-900 m-0">Data Transformation for AI Search</p> <span class="group inline-flex cursor-pointer items-center no-underline lg:ml-4"> <span class="font-sora font-semibold leading-1.5 text-sm lg:text-base tracking-[0.28px] lg:tracking-[0.32px] dark:text-white text-grey-900"> <span class="hidden text-sm lg:block">Learn more</span></span> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" role="img" title="ArrowRightCircle" class=" h-8 group-hover:fill-xenon-400 dark:group-hover:text-black group-hover:text-white shrink-0 transition-all duration-[400ms] ease-in group-hover:scale-[1.1] text-xenon-400 w-6 h-6 ml-3"><circle cx="12" cy="12" r="10"></circle><polyline points="12 16 16 12 12 8"></polyline><line x1="8" y1="12" x2="16" y2="12"></line></svg> </span> </a> <ul class="flex items-center justify-end"> <li id="" data-tracking="" class="border-r border-solid last:border-r-0 border-grey-700 "> <a href="/about" data-finalurl="/cms/render/live/en/sites/www/home/about.html" class="flex px-4 no-underline text-grey-900 dark:text-white text-sm font-normal hover:font-bold"> <span>Company</span> </a> </li><li id="" data-tracking="" class="border-r border-solid last:border-r-0 border-grey-700 "> <a href="https://partners.algolia.com/" data-finalurl="https://partners.algolia.com/" class="flex px-4 no-underline text-grey-900 dark:text-white text-sm font-normal hover:font-bold"> <span>Partners</span> </a> </li><li id="" data-tracking="" class="border-r border-solid last:border-r-0 border-grey-700 "> <a href="https://support.algolia.com/" data-finalurl="https://support.algolia.com/" class="flex px-4 no-underline text-grey-900 dark:text-white text-sm font-normal hover:font-bold"> <span>Support</span> </a> </li><li id="mainLogin" data-tracking="" class="border-r border-solid last:border-r-0 border-grey-700 hidden"> <a href="https://dashboard.algolia.com/users/sign_in" data-finalurl="https://dashboard.algolia.com/users/sign_in" class="flex px-4 no-underline text-grey-900 dark:text-white text-sm font-normal hover:font-bold"> <img class="mr-2" height="16" width="16" src="/files/live/sites/algolia-assets/files/icons/person_blue.svg" alt="" /> <span>Login</span> </a> </li><li id="mainLogout" data-tracking="" class="border-r border-solid last:border-r-0 border-grey-700 hidden"> <a href="https://dashboard.algolia.com/users/sign_out" data-finalurl="https://dashboard.algolia.com/users/sign_out" class="flex px-4 no-underline text-grey-900 dark:text-white text-sm font-normal hover:font-bold"> <img class="mr-2" height="16" width="16" src="/files/live/sites/algolia-assets/files/icons/Check%20Square.svg" alt="" /> <span>Logout</span> </a> </li></ul> </div> <!-- Start This is only visible in all Child Page Header Display--> <!-- End This is only visible in all Child Page Header Display--> <div class="header__middle-bar relative h-20 flex items-center lg:px-14 px-4 pr-0 max-w-[1440px] mx-auto"> <div class="logo flex shrink-0 items-center logoPopover cursor-pointer"> <a href="https://www.algolia.com/" class="mr-3"> <svg class="block h-6 w-6 lg:hidden" width="501" height="501" viewBox="0 0 501 501" fill="none" xmlns="http://www.w3.org/2000/svg"> <title>Algolia mark white</title> <path d="M250.926 0C114.306 0 2.926 110.16.956 246.32c-2 138.29 110.19 252.87 248.49 253.67 42.71.25 83.85-10.2 120.38-30.05 3.56-1.93 4.11-6.83 1.08-9.52l-23.39-20.74c-4.75-4.22-11.52-5.41-17.37-2.92-25.5 10.85-53.21 16.39-81.76 16.04-111.75-1.37-202.04-94.35-200.26-206.1 1.76-110.33 92.06-199.55 202.8-199.55h202.83v360.53l-115.08-102.25c-3.72-3.31-9.43-2.66-12.43 1.31-18.47 24.46-48.56 39.67-81.98 37.36-46.36-3.2-83.92-40.52-87.4-86.86-4.15-55.28 39.65-101.58 94.07-101.58 49.21 0 89.74 37.88 93.97 86.01.38 4.28 2.31 8.28 5.53 11.13l29.97 26.57c3.4 3.01 8.8 1.17 9.63-3.3 2.16-11.55 2.92-23.6 2.07-35.95-4.83-70.39-61.84-127.01-132.26-131.35-80.73-4.98-148.23 58.18-150.37 137.35-2.09 77.15 61.12 143.66 138.28 145.36 32.21.71 62.07-9.42 86.2-26.97l150.36 133.29c6.45 5.71 16.62 1.14 16.62-7.48V9.49c0-5.24-4.25-9.49-9.49-9.49H250.926Z" fill="#fff"></path> </svg> <svg class="hidden lg:w-auto lg:block lg:h-[25px]" width="2197" height="501" viewBox="0 0 2197 501" fill="none" xmlns="http://www.w3.org/2000/svg"> <title>Algolia logo white</title> <path fill-rule="evenodd" clip-rule="evenodd" d="M1070.38 275.47V6.08c0-3.63-3.24-6.39-6.82-5.83l-50.46 7.94a5.912 5.912 0 0 0-4.99 5.84l.17 273.22c0 12.92 0 92.7 95.97 95.49 3.33.1 6.09-2.58 6.09-5.91v-40.78c0-2.96-2.19-5.51-5.12-5.84-34.85-4.01-34.85-47.57-34.85-54.72l.01-.02Z" fill="#fff"></path> <path d="M1902.56 104.9h-50.78a5.9 5.9 0 0 0-5.9 5.9v266.1c0 3.259 2.64 5.9 5.9 5.9h50.78c3.25 0 5.9-2.641 5.9-5.9V110.8c0-3.258-2.65-5.9-5.9-5.9Z" fill="#fff"></path> <path fill-rule="evenodd" clip-rule="evenodd" d="M1851.78 71.55h50.77c3.26 0 5.9-2.64 5.9-5.9V6.07c0-3.62-3.24-6.39-6.82-5.83l-50.77 7.95a5.902 5.902 0 0 0-4.99 5.83v51.62c0 3.26 2.64 5.9 5.9 5.9l.01.01ZM1764.03 275.47V6.08c0-3.63-3.24-6.39-6.82-5.83l-50.46 7.94a5.912 5.912 0 0 0-4.99 5.84l.17 273.22c0 12.92 0 92.7 95.97 95.49 3.33.1 6.09-2.58 6.09-5.91v-40.78c0-2.96-2.19-5.51-5.12-5.84-34.85-4.01-34.85-47.57-34.85-54.72l.01-.02ZM1631.95 142.89c-11.14-12.25-24.83-21.65-40.78-28.31-15.92-6.53-33.26-9.85-52.07-9.85-18.78 0-36.15 3.17-51.92 9.85-15.59 6.66-29.29 16.05-40.76 28.31-11.47 12.23-20.38 26.87-26.76 44.03-6.38 17.17-9.24 37.37-9.24 58.36 0 20.99 3.19 36.87 9.55 54.21 6.38 17.32 15.14 32.11 26.45 44.36 11.29 12.23 24.83 21.62 40.6 28.46 15.77 6.83 40.12 10.33 52.4 10.48 12.25 0 36.78-3.82 52.7-10.48 15.92-6.68 29.46-16.23 40.78-28.46 11.29-12.25 20.05-27.04 26.25-44.36 6.22-17.34 9.24-33.22 9.24-54.21 0-20.99-3.34-41.19-10.03-58.36-6.38-17.17-15.14-31.8-26.43-44.03h.02Zm-44.43 163.75c-11.47 15.75-27.56 23.7-48.09 23.7-20.55 0-36.63-7.8-48.1-23.7-11.47-15.75-17.21-34.01-17.21-61.2 0-26.89 5.59-49.14 17.06-64.87 11.45-15.75 27.54-23.52 48.07-23.52 20.55 0 36.63 7.78 48.09 23.52 11.47 15.57 17.36 37.98 17.36 64.87 0 27.19-5.72 45.3-17.19 61.2h.01ZM894.416 104.9h-49.33c-48.36 0-90.91 25.48-115.75 64.1-14.52 22.58-22.99 49.63-22.99 78.73 0 44.89 20.13 84.92 51.59 111.1 2.93 2.6 6.05 4.98 9.31 7.14 12.86 8.49 28.11 13.47 44.52 13.47 1.23 0 2.46-.03 3.68-.09.36-.02.71-.05 1.07-.07.87-.05 1.75-.11 2.62-.2.34-.03.68-.08 1.02-.12.91-.1 1.82-.21 2.73-.34.21-.03.42-.07.63-.1 32.89-5.07 61.56-30.82 70.9-62.81v57.83c0 3.26 2.64 5.9 5.9 5.9h50.42c3.26 0 5.9-2.64 5.9-5.9V110.8c0-3.26-2.64-5.9-5.9-5.9h-56.32Zm0 206.92c-12.2 10.16-27.97 13.98-44.84 15.12-.16.01-.33.03-.49.04-1.12.07-2.24.1-3.36.1-42.24 0-77.12-35.89-77.12-79.37 0-10.25 1.96-20.01 5.42-28.98 11.22-29.12 38.77-49.74 71.06-49.74h49.33v142.83ZM2133.97 104.9h-49.33c-48.36 0-90.91 25.48-115.75 64.1-14.52 22.58-22.99 49.63-22.99 78.73 0 44.89 20.13 84.92 51.59 111.1 2.93 2.6 6.05 4.98 9.31 7.14 12.86 8.49 28.11 13.47 44.52 13.47 1.23 0 2.46-.03 3.68-.09.36-.02.71-.05 1.07-.07.87-.05 1.75-.11 2.62-.2.34-.03.68-.08 1.02-.12.91-.1 1.82-.21 2.73-.34.21-.03.42-.07.63-.1 32.89-5.07 61.56-30.82 70.9-62.81v57.83c0 3.26 2.64 5.9 5.9 5.9h50.42c3.26 0 5.9-2.64 5.9-5.9V110.8c0-3.26-2.64-5.9-5.9-5.9h-56.32Zm0 206.92c-12.2 10.16-27.97 13.98-44.84 15.12-.16.01-.33.03-.49.04-1.12.07-2.24.1-3.36.1-42.24 0-77.12-35.89-77.12-79.37 0-10.25 1.96-20.01 5.42-28.98 11.22-29.12 38.77-49.74 71.06-49.74h49.33v142.83ZM1314.05 104.9h-49.33c-48.36 0-90.91 25.48-115.75 64.1-11.79 18.34-19.6 39.64-22.11 62.59a148.518 148.518 0 0 0 .05 32.73c4.28 38.09 23.14 71.61 50.66 94.52 2.93 2.6 6.05 4.98 9.31 7.14 12.86 8.49 28.11 13.47 44.52 13.47 17.99 0 34.61-5.93 48.16-15.97 16.29-11.58 28.88-28.54 34.48-47.75v50.26h-.11v11.08c0 21.84-5.71 38.27-17.34 49.36-11.61 11.08-31.04 16.63-58.25 16.63-11.12 0-28.79-.59-46.6-2.41-2.83-.29-5.46 1.5-6.27 4.22l-12.78 43.11c-1.02 3.46 1.27 7.02 4.83 7.53 21.52 3.08 42.52 4.68 54.65 4.68 48.91 0 85.16-10.75 108.89-32.21 21.48-19.41 33.15-48.89 35.2-88.52V110.8c0-3.26-2.64-5.9-5.9-5.9h-56.32.01Zm0 64.1s.65 139.13 0 143.36c-12.08 9.77-27.11 13.59-43.49 14.7-.16.01-.33.03-.49.04-1.12.07-2.24.1-3.36.1-1.32 0-2.63-.03-3.94-.1-40.41-2.11-74.52-37.26-74.52-79.38 0-10.25 1.96-20.01 5.42-28.98 11.22-29.12 38.77-49.74 71.06-49.74h49.33-.01Z" fill="#fff"></path> <path d="M249.826.17C113.296.17 1.996 110.25.026 246.32c-2 138.19 110.12 252.7 248.33 253.5 42.68.25 83.79-10.19 120.3-30.03 3.56-1.93 4.11-6.83 1.08-9.51l-23.38-20.72c-4.75-4.21-11.51-5.4-17.36-2.92-25.48 10.84-53.17 16.38-81.71 16.03-111.68-1.37-201.91-94.29-200.13-205.96 1.76-110.26 92-199.41 202.67-199.41h202.69v360.28l-115-102.18c-3.72-3.31-9.42-2.66-12.42 1.31-18.46 24.44-48.53 39.64-81.93 37.34-46.33-3.2-83.87-40.5-87.34-86.81-4.15-55.24 39.63-101.52 94-101.52 49.18 0 89.68 37.85 93.91 85.95.38 4.28 2.31 8.27 5.52 11.12l29.95 26.55c3.4 3.01 8.79 1.17 9.63-3.3 2.16-11.55 2.92-23.58 2.07-35.92-4.82-70.34-61.8-126.93-132.17-131.26-80.68-4.97-148.13 58.14-150.27 137.25-2.09 77.1 61.08 143.56 138.19 145.26 32.19.71 62.03-9.41 86.14-26.95l150.26 133.2c6.44 5.71 16.61 1.14 16.61-7.47V9.65c0-5.24-4.24-9.48-9.48-9.48h-240.36Z" fill="#fff"></path> </svg> </a> </div> <button type="button" id="toggleMobileNav" class="flex lg:hidden text-white items-center"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="block h-5 w-5 dark:text-white text-xenon-600"> <line x1="3" y1="12" x2="21" y2="12"></line> <line x1="3" y1="6" x2="21" y2="6"></line> <line x1="3" y1="18" x2="21" y2="18"></line> </svg> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="block h-5 w-5 dark:text-white text-xenon-600 hidden"> <line x1="18" y1="6" x2="6" y2="18"></line> <line x1="6" y1="6" x2="18" y2="18"></line> </svg> <span class="toggleBtnName ml-2 font-inter font-medium uppercase leading-1.5 text-sm lg:text-base dark:text-white text-grey-900 ">Menu</span> </button> <!-- This is only visible in Home Page Header for Configuration--> <ul class="header__nav px-4 hidden lg:flex lg:flex-wrap lg:flex-row w-full lg:ml-6 xl:ml-10 relative max-lg:h-screen max-lg:overflow-auto pb-40 lg:pb-0"> <li data-tracking="" class="lg:mr-3 xl:mr-6 flex flex-col lg:flex-row items-center last:lg:mr-0 border-b-[1px] border-grey-200 lg:border-none"> <button data-tracking="" type="button" class="font-inter font-normal w-full py-4 lg:py-7 lg:px-0 text-left dark:text-white text-grey-900 lg:text-sm xl:text-base dropdown-link flex justify-between lg:hover:text-xenon-600">Solutions<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="dropdown-link-caret block lg:hidden shrink-0"> <polyline points="6 9 12 15 18 9"></polyline> </svg> </button> <div class="dropdown-menu lg:shadow-md lg:absolute top-full flex flex-col md:flex-row gap-10 px-3 md:p-7 rounded-lg lg:w-max opacity-0 invisible lg:bg-white"> <div class="lg:first:border-r border-grey-200 first:pr-8"> <!-- --> <ul class="flex flex-col gap-2.5 grid "> <li data-tracking=""> <a href="/products/ai-search" data-finalurl="/cms/render/live/en/sites/www/home/products/ai-search.html" class="flex items-center py-2"> <img class="mr-2" height="16" width="16" src="/files/live/sites/algolia-assets/files/nav/ai-blue.svg" alt="" /> <span class="text-sm text-black dark:text-white dark:lg:text-black hover:text-xenon-600">AI Search</span> </a> <div class="text-zinc-400 lg:text-sm lg:text-grey-400 lg:lg:font-normal ml-5"> The results users need to see</div> </li><li data-tracking=""> <a href="/products/ai-browse" data-finalurl="/cms/render/live/en/sites/www/home/products/ai-browse.html" class="flex items-center py-2"> <img class="mr-2" height="16" width="16" src="/files/live/sites/algolia-assets/files/nav/browse-blue.svg" alt="" /> <span class="text-sm text-black dark:text-white dark:lg:text-black hover:text-xenon-600">AI Browse</span> </a> <div class="text-zinc-400 lg:text-sm lg:text-grey-400 lg:lg:font-normal ml-5"> Category and collection pages built by AI</div> </li><li data-tracking=""> <a href="/products/ai-recommendations" data-finalurl="/cms/render/live/en/sites/www/home/products/ai-recommendations.html" class="flex items-center py-2"> <img class="mr-2" height="16" width="16" src="/files/live/sites/algolia-assets/files/nav/recommendations-blue.svg" alt="" /> <span class="text-sm text-black dark:text-white dark:lg:text-black hover:text-xenon-600">AI Recommendations</span> </a> <div class="text-zinc-400 lg:text-sm lg:text-grey-400 lg:lg:font-normal ml-5"> Suggestions anywhere in the user journey</div> </li><li data-tracking=""> <a href="/industries/ecommerce/digital-merchandising" data-finalurl="/cms/render/live/en/sites/www/home/industries/ecommerce/digital-merchandising.html" class="flex items-center py-2"> <img class="mr-2" height="16" width="16" src="/files/live/sites/algolia-assets/files/nav/local_mall_1.svg" alt="" /> <span class="text-sm text-black dark:text-white dark:lg:text-black hover:text-xenon-600">Merchandising Studio</span> </a> <div class="text-zinc-400 lg:text-sm lg:text-grey-400 lg:lg:font-normal ml-5"> Data-enhanced customer experiences, without code</div> </li><li data-tracking=""> <a href="/products/features/analytics" data-finalurl="/cms/render/live/en/sites/www/home/products/features/analytics.html" class="flex items-center py-2"> <img class="mr-2" height="16" width="16" src="/files/live/sites/algolia-assets/files/nav/pie-blue.svg" alt="" /> <span class="text-sm text-black dark:text-white dark:lg:text-black hover:text-xenon-600">Analytics</span> </a> <div class="text-zinc-400 lg:text-sm lg:text-grey-400 lg:lg:font-normal ml-5"> All your insights in one dashboard</div> </li><li data-tracking=""> <a href="/developers/search-ui" data-finalurl="/cms/render/live/en/sites/www/home/developers/search-ui.html" class="flex items-center py-2"> <img class="mr-2" height="16" width="16" src="/files/live/sites/algolia-assets/files/nav/space_dashboard_1.svg" alt="" /> <span class="text-sm text-black dark:text-white dark:lg:text-black hover:text-xenon-600">UI Components</span> </a> <div class="text-zinc-400 lg:text-sm lg:text-grey-400 lg:lg:font-normal ml-5"> Pre-built components for custom journeys</div> </li><li data-tracking=""> <a href="/products" data-finalurl="/cms/render/live/en/sites/www/home/products.html" class="flex items-center py-2"> <span class="text-sm text-black dark:text-white dark:lg:text-black hover:text-xenon-600">Read more</span> <img class="ml-2" height="24" width="24" src="/files/live/sites/algolia-assets/files/icons/arrowRightCircle.svg" alt="" /> </a> </li></ul></div> <div class="lg:first:border-r border-grey-200 first:pr-8"> <!-- --> <h6 class="text-sm mb-4 font-semibold text-grey-400">INTEGRATIONS</h6> <ul class="flex flex-col gap-2.5 grid "> <li data-tracking=""> <a href="/search-solutions/adobe-commerce-magento" data-finalurl="/cms/render/live/en/sites/www/home/search-solutions/adobe-commerce-magento.html" class="flex items-center py-2"> <img class="mr-2" height="16" width="16" src="/files/live/sites/algolia-assets/files/nav/adobe.svg" alt="" /> <span class="text-sm text-black dark:text-white dark:lg:text-black hover:text-xenon-600">Adobe Commerce</span> </a> </li><li data-tracking=""> <a href="/search-solutions/adobe-experience-manager" data-finalurl="/cms/render/live/en/sites/www/home/search-solutions/adobe-experience-manager.html" class="flex items-center py-2"> <img class="mr-2" height="16" width="16" src="/files/live/sites/algolia-assets/files/nav/adobe.svg" alt="" /> <span class="text-sm text-black dark:text-white dark:lg:text-black hover:text-xenon-600">Adobe AEM</span> </a> </li><li data-tracking=""> <a href="/search-solutions/bigcommerce" data-finalurl="/cms/render/live/en/sites/www/home/search-solutions/bigcommerce.html" class="flex items-center py-2"> <img class="mr-2" height="16" width="16" src="/files/live/sites/algolia-assets/files/nav/bigcommerce-icon_1.svg" alt="" /> <span class="text-sm text-black dark:text-white dark:lg:text-black hover:text-xenon-600">BigCommerce</span> </a> </li><li data-tracking=""> <a href="/search-solutions/commercetools" data-finalurl="/cms/render/live/en/sites/www/home/search-solutions/commercetools.html" class="flex items-center py-2"> <img class="mr-2" height="16" width="16" src="/files/live/sites/algolia-assets/files/nav/commercetools-symbol.svg" alt="" /> <span class="text-sm text-black dark:text-white dark:lg:text-black hover:text-xenon-600">Commercetools</span> </a> </li><li data-tracking=""> <a href="/search-solutions/salesforce-commerce-cloud" data-finalurl="/cms/render/live/en/sites/www/home/search-solutions/salesforce-commerce-cloud.html" class="flex items-center py-2"> <img class="mr-2" height="16" width="16" src="/files/live/sites/algolia-assets/files/nav/salesforce.svg" alt="" /> <span class="text-sm text-black dark:text-white dark:lg:text-black hover:text-xenon-600">Salesforce CC</span> </a> </li><li data-tracking=""> <a href="/search-solutions/shopify" data-finalurl="/cms/render/live/en/sites/www/home/search-solutions/shopify.html" class="flex items-center py-2"> <img class="mr-2" height="16" width="16" src="/files/live/sites/algolia-assets/files/nav/shopify.svg" alt="" /> <span class="text-sm text-black dark:text-white dark:lg:text-black hover:text-xenon-600">Shopify</span> </a> </li><li data-tracking=""> <a href="/developers/integrations" data-finalurl="/cms/render/live/en/sites/www/home/developers/integrations.html" class="flex items-center py-2"> <span class="text-sm text-black dark:text-white dark:lg:text-black hover:text-xenon-600">See all integrations</span> <img class="ml-2" height="24" width="24" src="/files/live/sites/algolia-assets/files/icons/arrowRightCircle.svg" alt="" /> </a> </li></ul></div> </div> </li><li data-tracking="" class="lg:mr-3 xl:mr-6 flex flex-col lg:flex-row items-center last:lg:mr-0 border-b-[1px] border-grey-200 lg:border-none"> <button data-tracking="" type="button" class="font-inter font-normal w-full py-4 lg:py-7 lg:px-0 text-left dark:text-white text-grey-900 lg:text-sm xl:text-base dropdown-link flex justify-between lg:hover:text-xenon-600">Industries<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="dropdown-link-caret block lg:hidden shrink-0"> <polyline points="6 9 12 15 18 9"></polyline> </svg> </button> <div class="dropdown-menu lg:shadow-md lg:absolute top-full flex flex-col md:flex-row gap-10 px-3 md:p-7 rounded-lg lg:w-max opacity-0 invisible lg:bg-white"> <div class=""> <!-- --> <ul class="flex flex-col gap-2.5 grid "> <li data-tracking=""> <a href="/industries/ecommerce" data-finalurl="/cms/render/live/en/sites/www/home/industries/ecommerce.html" class="flex items-center py-2"> <img class="mr-2" height="16" width="16" src="/files/live/sites/algolia-assets/files/nav/shopping_cart_1.svg" alt="" /> <span class="text-sm text-black dark:text-white dark:lg:text-black hover:text-xenon-600">Retail Ecommerce</span> </a> </li><li data-tracking=""> <a href="/industries/b2b-ecommerce" data-finalurl="/cms/render/live/en/sites/www/home/industries/b2b-ecommerce.html" class="flex items-center py-2"> <img class="mr-2" height="16" width="16" src="/files/live/sites/algolia-assets/files/nav/business_center_1.svg" alt="" /> <span class="text-sm text-black dark:text-white dark:lg:text-black hover:text-xenon-600">B2B Ecommerce</span> </a> </li><li data-tracking=""> <a href="/industries/marketplaces" data-finalurl="/cms/render/live/en/sites/www/home/industries/marketplaces.html" class="flex items-center py-2"> <img class="mr-2" height="16" width="16" src="/files/live/sites/algolia-assets/files/nav/store_1.svg" alt="" /> <span class="text-sm text-black dark:text-white dark:lg:text-black hover:text-xenon-600">Marketplaces</span> </a> </li><li data-tracking=""> <a href="/industries/media" data-finalurl="/cms/render/live/en/sites/www/home/industries/media.html" class="flex items-center py-2"> <img class="mr-2" height="16" width="16" src="/files/live/sites/algolia-assets/files/nav/perm_media_1.svg" alt="" /> <span class="text-sm text-black dark:text-white dark:lg:text-black hover:text-xenon-600">Media</span> </a> </li><li data-tracking=""> <a href="/industries/saas" data-finalurl="/cms/render/live/en/sites/www/home/industries/saas.html" class="flex items-center py-2"> <img class="mr-2" height="16" width="16" src="/files/live/sites/algolia-assets/files/nav/cloud_done.svg" alt="" /> <span class="text-sm text-black dark:text-white dark:lg:text-black hover:text-xenon-600">SaaS</span> </a> </li><li data-tracking=""> <a href="/industries" data-finalurl="/cms/render/live/en/sites/www/home/industries.html" class="flex items-center py-2"> <span class="text-sm text-black dark:text-white dark:lg:text-black hover:text-xenon-600">Read more</span> <img class="ml-2" height="24" width="24" src="/files/live/sites/algolia-assets/files/icons/arrowRightCircle.svg" alt="" /> </a> </li></ul></div> </div> </li><li data-tracking="" class="lg:mr-3 xl:mr-6 flex flex-col lg:flex-row items-center last:lg:mr-0 border-b-[1px] border-grey-200 lg:border-none"> <a href="/pricing" class="font-inter font-normal w-full py-4 lg:py-7 lg:px-0 text-left dark:text-white text-grey-900 lg:text-sm xl:text-base hover:text-xenon-600">Pricing</a> </li><li data-tracking="" class="lg:mr-3 xl:mr-6 flex flex-col lg:flex-row items-center last:lg:mr-0 border-b-[1px] border-grey-200 lg:border-none"> <button data-tracking="" type="button" class="font-inter font-normal w-full py-4 lg:py-7 lg:px-0 text-left dark:text-white text-grey-900 lg:text-sm xl:text-base dropdown-link flex justify-between lg:hover:text-xenon-600">Developers<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="dropdown-link-caret block lg:hidden shrink-0"> <polyline points="6 9 12 15 18 9"></polyline> </svg> </button> <div class="dropdown-menu lg:shadow-md lg:absolute top-full flex flex-col md:flex-row gap-10 px-3 md:p-7 rounded-lg lg:w-max opacity-0 invisible lg:bg-white"> <div class=""> <!-- --> <h6 class="text-sm mb-4 font-semibold text-grey-400">GET STARTED</h6> <ul class="flex flex-col gap-2.5 grid "> <li data-tracking=""> <a href="/developers" data-finalurl="/cms/render/live/en/sites/www/home/developers.html" class="flex items-center py-2"> <img class="mr-2" height="16" width="16" src="/files/live/sites/algolia-assets/files/nav/desktop-blue.svg" alt="" /> <span class="text-sm text-black dark:text-white dark:lg:text-black hover:text-xenon-600">Developer Hub</span> </a> </li><li data-tracking=""> <a href="https://www.algolia.com/doc/" data-finalurl="https://www.algolia.com/doc/" class="flex items-center py-2"> <img class="mr-2" height="16" width="16" src="/files/live/sites/algolia-assets/files/nav/menu_book_1.svg" alt="" /> <span class="text-sm text-black dark:text-white dark:lg:text-black hover:text-xenon-600">Documentation</span> </a> </li><li data-tracking=""> <a href="/developers/integrations" data-finalurl="/cms/render/live/en/sites/www/home/developers/integrations.html" class="flex items-center py-2"> <img class="mr-2" height="16" width="16" src="/files/live/sites/algolia-assets/files/nav/category_1.svg" alt="" /> <span class="text-sm text-black dark:text-white dark:lg:text-black hover:text-xenon-600">Integrations</span> </a> </li><li data-tracking=""> <a href="/developers/search-ui" data-finalurl="/cms/render/live/en/sites/www/home/developers/search-ui.html" class="flex items-center py-2"> <img class="mr-2" height="16" width="16" src="/files/live/sites/algolia-assets/files/nav/space_dashboard_1.svg" alt="" /> <span class="text-sm text-black dark:text-white dark:lg:text-black hover:text-xenon-600">UI Components</span> </a> </li><li data-tracking=""> <a href="/products/features/search-autocomplete" data-finalurl="/cms/render/live/en/sites/www/home/products/features/search-autocomplete.html" class="flex items-center py-2"> <img class="mr-2" height="16" width="16" src="/files/live/sites/algolia-assets/files/nav/pageview_1.svg" alt="" /> <span class="text-sm text-black dark:text-white dark:lg:text-black hover:text-xenon-600">Autocomplete</span> </a> </li></ul></div> <div class=""> <!-- --> <h6 class="text-sm mb-4 font-semibold text-grey-400">RESOURCES</h6> <ul class="flex flex-col gap-2.5 grid "> <li data-tracking=""> <a href="/developers/code-exchange" data-finalurl="/cms/render/live/en/sites/www/home/developers/code-exchange.html" class="flex items-center py-2"> <img class="mr-2" height="16" width="16" src="/files/live/sites/algolia-assets/files/nav/integration_instructions_1.svg" alt="" /> <span class="text-sm text-black dark:text-white dark:lg:text-black hover:text-xenon-600">Code Exchange</span> </a> </li><li data-tracking=""> <a href="/blog/engineering" data-finalurl="/cms/render/live/en/sites/www/home/blog/engineering.html" class="flex items-center py-2"> <img class="mr-2" height="16" width="16" src="/files/live/sites/algolia-assets/files/nav/terminal_1.svg" alt="" /> <span class="text-sm text-black dark:text-white dark:lg:text-black hover:text-xenon-600">Engineering Blog</span> </a> </li><li data-tracking=""> <a href="https://alg.li/discord" data-finalurl="https://alg.li/discord" class="flex items-center py-2"> <img class="mr-2" height="16" width="16" src="/files/live/sites/algolia-assets/files/nav/group_1.svg" alt="" /> <span class="text-sm text-black dark:text-white dark:lg:text-black hover:text-xenon-600">Discord</span> </a> </li><li data-tracking=""> <a href="/events" data-finalurl="/cms/render/live/en/sites/www/home/events.html" class="flex items-center py-2"> <img class="mr-2" height="16" width="16" src="/files/live/sites/algolia-assets/files/nav/event_note_1.svg" alt="" /> <span class="text-sm text-black dark:text-white dark:lg:text-black hover:text-xenon-600">Webinars & Events</span> </a> </li></ul></div> <div class=""> <!-- --> <h6 class="text-sm mb-4 font-semibold text-grey-400">QUICK LINKS</h6> <ul class="flex flex-col gap-2.5 grid "> <li data-tracking=""> <a href="https://www.algolia.com/doc/guides/getting-started/quick-start/" data-finalurl="https://www.algolia.com/doc/guides/getting-started/quick-start/" class="flex items-center py-2"> <img class="mr-2" height="16" width="16" src="/files/live/sites/algolia-assets/files/nav/assignment_turned_in_1.svg" alt="" /> <span class="text-sm text-black dark:text-white dark:lg:text-black hover:text-xenon-600">Quick Start Guide</span> </a> </li><li data-tracking=""> <a href="/for-open-source" data-finalurl="/cms/render/live/en/sites/www/home/for-open-source.html" class="flex items-center py-2"> <img class="mr-2" height="16" width="16" src="/files/live/sites/algolia-assets/files/nav/Subtract_1.svg" alt="" /> <span class="text-sm text-black dark:text-white dark:lg:text-black hover:text-xenon-600">For Open Source</span> </a> </li><li data-tracking=""> <a href="https://status.algolia.com/" data-finalurl="https://status.algolia.com/" class="flex items-center py-2"> <img class="mr-2" height="16" width="16" src="/files/live/sites/algolia-assets/files/nav/dns_1.svg" alt="" /> <span class="text-sm text-black dark:text-white dark:lg:text-black hover:text-xenon-600">API Status</span> </a> </li><li data-tracking=""> <a href="https://support.algolia.com/hc/en-us" data-finalurl="https://support.algolia.com/hc/en-us" class="flex items-center py-2"> <img class="mr-2" height="16" width="16" src="/files/live/sites/algolia-assets/files/nav/support_1.svg" alt="" /> <span class="text-sm text-black dark:text-white dark:lg:text-black hover:text-xenon-600">Support</span> </a> </li></ul></div> </div> </li><li data-tracking="" class="lg:mr-3 xl:mr-6 flex flex-col lg:flex-row items-center last:lg:mr-0 border-b-[1px] border-grey-200 lg:border-none"> <button data-tracking="" type="button" class="font-inter font-normal w-full py-4 lg:py-7 lg:px-0 text-left dark:text-white text-grey-900 lg:text-sm xl:text-base dropdown-link flex justify-between lg:hover:text-xenon-600">Resources<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="dropdown-link-caret block lg:hidden shrink-0"> <polyline points="6 9 12 15 18 9"></polyline> </svg> </button> <div class="dropdown-menu lg:shadow-md lg:absolute top-full flex flex-col md:flex-row gap-10 px-3 md:p-7 rounded-lg lg:w-max opacity-0 invisible lg:bg-white"> <div class=""> <!-- --> <h6 class="text-sm mb-4 font-semibold text-grey-400">INSPIRATION</h6> <ul class="flex flex-col gap-2.5 grid "> <li data-tracking=""> <a href="/blog" data-finalurl="/cms/render/live/en/sites/www/home/blog.html" class="flex items-center py-2"> <img class="mr-2" height="16" width="16" src="/files/live/sites/algolia-assets/files/nav/description_FILL1_wght400_GRAD0_opsz48_1_1.svg" alt="" /> <span class="text-sm text-black dark:text-white dark:lg:text-black hover:text-xenon-600">Algolia Blog</span> </a> </li><li data-tracking=""> <a href="https://resources.algolia.com/" data-finalurl="https://resources.algolia.com/" class="flex items-center py-2"> <img class="mr-2" height="16" width="16" src="/files/live/sites/algolia-assets/files/nav/folder_open_FILL1_wght400_GRAD0_opsz48_1_1.svg" alt="" /> <span class="text-sm text-black dark:text-white dark:lg:text-black hover:text-xenon-600">Resource Center</span> </a> </li><li data-tracking=""> <a href="/customers" data-finalurl="/cms/render/live/en/sites/www/home/customers.html" class="flex items-center py-2"> <img class="mr-2" height="16" width="16" src="/files/live/sites/algolia-assets/files/nav/contacts_FILL1_wght400_GRAD0_opsz48_1_1.svg" alt="" /> <span class="text-sm text-black dark:text-white dark:lg:text-black hover:text-xenon-600">Customer Stories</span> </a> </li></ul></div> <div class=""> <!-- --> <h6 class="text-sm mb-4 font-semibold text-grey-400">LEARN</h6> <ul class="flex flex-col gap-2.5 grid "> <li data-tracking=""> <a href="https://academy.algolia.com/trainings" data-finalurl="https://academy.algolia.com/trainings" class="flex items-center py-2"> <img class="mr-2" height="16" width="16" src="/files/live/sites/algolia-assets/files/nav/school_FILL1_wght400_GRAD0_opsz48_1_1.svg" alt="" /> <span class="text-sm text-black dark:text-white dark:lg:text-black hover:text-xenon-600">Algolia Academy</span> </a> </li><li data-tracking=""> <a href="/ecommerce-merchandising-playbook" data-finalurl="/cms/render/live/en/sites/www/home/ecommerce-merchandising-playbook.html" class="flex items-center py-2"> <img class="mr-2" height="16" width="16" src="/files/live/sites/algolia-assets/files/nav/local_mall_1.svg" alt="" /> <span class="text-sm text-black dark:text-white dark:lg:text-black hover:text-xenon-600">Merchandising Playbook</span> </a> </li><li data-tracking=""> <a href="/search-audit" data-finalurl="/cms/render/live/en/sites/www/home/search-audit.html" class="flex items-center py-2"> <img class="mr-2" height="16" width="16" src="/files/live/sites/algolia-assets/files/nav/flaky_1.svg" alt="" /> <span class="text-sm text-black dark:text-white dark:lg:text-black hover:text-xenon-600">Ecommerce Search Audit</span> </a> </li><li data-tracking=""> <a href="/events" data-finalurl="/cms/render/live/en/sites/www/home/events.html" class="flex items-center py-2"> <img class="mr-2" height="16" width="16" src="/files/live/sites/algolia-assets/files/nav/event_note_1.svg" alt="" /> <span class="text-sm text-black dark:text-white dark:lg:text-black hover:text-xenon-600">Events</span> </a> </li></ul></div> <div class=""> <!-- --> <h6 class="text-sm mb-4 font-semibold text-grey-400">NEW</h6> <ul class="flex flex-col gap-2.5 grid "> <li data-tracking=""> <a href="/customer-hub" data-finalurl="/cms/render/live/en/sites/www/home/customer-hub.html" class="flex items-center py-2"> <img class="mr-2" height="16" width="16" src="/files/live/sites/algolia-assets/files/nav/diversity_3_FILL1_wght400_GRAD0_opsz48_1_1.svg" alt="" /> <span class="text-sm text-black dark:text-white dark:lg:text-black hover:text-xenon-600">Customer Hub</span> </a> </li><li data-tracking=""> <a href="https://changelog.algolia.com/" data-finalurl="https://changelog.algolia.com/" class="flex items-center py-2"> <img class="mr-2" height="16" width="16" src="/files/live/sites/algolia-assets/files/nav/screen_search_desktop_1.svg" alt="" /> <span class="text-sm text-black dark:text-white dark:lg:text-black hover:text-xenon-600">Changelog</span> </a> </li><li data-tracking=""> <a href="/about/news" data-finalurl="/cms/render/live/en/sites/www/home/about/news.html" class="flex items-center py-2"> <img class="mr-2" height="16" width="16" src="/files/live/sites/algolia-assets/files/nav/newspaper_1.svg" alt="" /> <span class="text-sm text-black dark:text-white dark:lg:text-black hover:text-xenon-600">Newsroom</span> </a> </li></ul></div> </div> </li><div class="header__top-nav mobile lg:hidden z-1 mt-4 grid grid-cols-2 pr-2 max-w-[1440px]"> <span class=" font-inter leading-normal text-sm text-grey-400 dark:text-white mb-2 font-medium uppercase tracking-[0.7px]">Quick Access</span> <ul class="col-start-1 col-end-3 grid list-none grid-cols-2 gap-2 p-0"> <li data-tracking=""> <a href="/about" data-finalurl="/cms/render/live/en/sites/www/home/about.html" class="no-underline group flex w-max min-w-[150px] max-w-[280px] flex-col items-start py-2"> <div class="flex items-center gap-1"> <img class="" height="16" width="16" src="/files/live/sites/algolia-assets/files/icons/apartment_blue.svg" alt="" /> <span class="block text-left font-inter font-normal leading-normal text-xs lg:text-sm text-grey-900 dark:text-white group-hover:text-xenon-400"> Company</span> </div> </a> <!-- text-white --> </li><li data-tracking=""> <a href="https://partners.algolia.com/" data-finalurl="https://partners.algolia.com/" class="no-underline group flex w-max min-w-[150px] max-w-[280px] flex-col items-start py-2"> <div class="flex items-center gap-1"> <img class="" height="16" width="16" src="/files/live/sites/algolia-assets/files/icons/handshake_blue.svg" alt="" /> <span class="block text-left font-inter font-normal leading-normal text-xs lg:text-sm text-grey-900 dark:text-white group-hover:text-xenon-400"> Partners</span> </div> </a> <!-- text-white --> </li><li data-tracking=""> <a href="https://support.algolia.com/" data-finalurl="https://support.algolia.com/" class="no-underline group flex w-max min-w-[150px] max-w-[280px] flex-col items-start py-2"> <div class="flex items-center gap-1"> <img class="" height="16" width="16" src="/files/live/sites/algolia-assets/files/icons/support_blue.svg" alt="" /> <span class="block text-left font-inter font-normal leading-normal text-xs lg:text-sm text-grey-900 dark:text-white group-hover:text-xenon-400"> Support</span> </div> </a> <!-- text-white --> </li><li data-tracking=""> <a href="https://dashboard.algolia.com/users/sign_in" data-finalurl="https://dashboard.algolia.com/users/sign_in" class="no-underline group flex w-max min-w-[150px] max-w-[280px] flex-col items-start py-2"> <div class="flex items-center gap-1"> <img class="" height="16" width="16" src="/files/live/sites/algolia-assets/files/icons/person_blue.svg" alt="" /> <span class="block text-left font-inter font-normal leading-normal text-xs lg:text-sm text-grey-900 dark:text-white group-hover:text-xenon-400"> Login</span> </div> </a> <!-- text-white --> </li><li data-tracking=""> <a href="https://dashboard.algolia.com/users/sign_out" data-finalurl="https://dashboard.algolia.com/users/sign_out" class="no-underline group flex w-max min-w-[150px] max-w-[280px] flex-col items-start py-2"> <div class="flex items-center gap-1"> <img class="" height="16" width="16" src="/files/live/sites/algolia-assets/files/icons/Check%20Square.svg" alt="" /> <span class="block text-left font-inter font-normal leading-normal text-xs lg:text-sm text-grey-900 dark:text-white group-hover:text-xenon-400"> Logout</span> </div> </a> <!-- text-white --> </li></ul> </div> <ul class="shrink-0 list-none gap-4 lg:mr-2 lg:hidden lg:flex mobile pt-6 pb-3 flex justify-center"> <span class="last:hidden"> <!-- Check if the property is null or empty --> <!-- End here Check if the property is null or empty --> <div data-tracking="" class="flex font-sora "> <div class=" font-sora button last:me-0 inline-flex w-fit group"> <a href="/demorequest" data-finalurl="/cms/render/live/en/sites/www/home/demorequest.html" data-locale="en" data-is-internal="true" target="_self" class=" ctaGradient cmp-button overflow-hidden flex flex-wrap items-center cursor-pointer font-sora w-full noBackGround-cta transparent dark:text-white text-grey-900 px-4 lg:px-6 bg-transparent shadow-[0_0_6px_2px_rgba(0,61,255,0.12)] border-2 dark:border-white border-grey-200 rounded-lg min-h-12 lg:min-h-14 " style="--x: 0px; --y: 0px;"> <span class="cmp-button__text font-semibold mx-auto font-sora leading-1.5 text-sm lg:text-base tracking-[0.28px] lg:tracking-[0.32px]"> Request Demo</span> </a> </div> </div> </span> <span class="last:hidden"> <!-- Check if the property is null or empty --> <!-- End here Check if the property is null or empty --> <div data-tracking="" class="flex font-sora "> <div class=" font-sora button last:me-0 inline-flex w-fit group"> <a href="https://dashboard.algolia.com/users/sign_up" data-finalurl="https://dashboard.algolia.com/users/sign_up" data-locale="en" data-is-internal="true" target="_blank" class=" ctaGradient cmp-button overflow-hidden flex flex-wrap items-center cursor-pointer font-sora w-full primary-cta text-white px-4 lg:px-6 bg-xenon-400 rounded-lg min-h-12 lg:min-h-14 blue-gradient" style="--x: 0px; --y: 0px;"> <span class="cmp-button__text font-semibold mx-auto font-sora leading-1.5 text-sm lg:text-base tracking-[0.28px] lg:tracking-[0.32px]"> Get started</span> </a> </div> </div> </span> </ul> </ul> <div class="header__global-search shrink-0 mr-4 ml-auto"> <a href="/search" class="flex flex-wrap no-underline border lg:border-2 dark:border-grey-700 border-grey-200 rounded-lg text-white px-3 py-3 gap-4 lg:w-[220px] xl:w-[300px] items-center"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="h-5 w-5 text-xenon-400"> <circle cx="11" cy="11" r="8"></circle> <line x1="21" y1="21" x2="16.65" y2="16.65"></line> </svg> <span class="hidden lg:block lg:text-sm xl:text-base dark:text-white text-grey-900">Search Algolia</span> </a> </div> <ul class="shrink-0 list-none gap-4 lg:mr-2 hidden lg:flex desktop"> <!-- Check if the property is null or empty --> <!-- End here Check if the property is null or empty --> <div data-tracking="" class="flex font-sora "> <div class=" font-sora button last:me-0 inline-flex w-fit group"> <a href="/demorequest" data-finalurl="/cms/render/live/en/sites/www/home/demorequest.html" data-locale="en" data-is-internal="true" target="_self" class=" ctaGradient cmp-button overflow-hidden flex flex-wrap items-center cursor-pointer font-sora w-full noBackGround-cta transparent dark:text-white text-grey-900 px-4 lg:px-6 bg-transparent shadow-[0_0_6px_2px_rgba(0,61,255,0.12)] border-2 dark:border-white border-grey-200 rounded-lg min-h-12 lg:min-h-14 " style="--x: 0px; --y: 0px;"> <span class="cmp-button__text font-semibold mx-auto font-sora leading-1.5 text-sm lg:text-base tracking-[0.28px] lg:tracking-[0.32px]"> Request Demo</span> </a> </div> </div> <!-- Check if the property is null or empty --> <!-- End here Check if the property is null or empty --> <div data-tracking="" class="flex font-sora "> <div class=" font-sora button last:me-0 inline-flex w-fit group"> <a href="https://dashboard.algolia.com/users/sign_up" data-finalurl="https://dashboard.algolia.com/users/sign_up" data-locale="en" data-is-internal="true" target="_blank" class=" ctaGradient cmp-button overflow-hidden flex flex-wrap items-center cursor-pointer font-sora w-full primary-cta text-white px-4 lg:px-6 bg-xenon-400 rounded-lg min-h-12 lg:min-h-14 blue-gradient" style="--x: 0px; --y: 0px;"> <span class="cmp-button__text font-semibold mx-auto font-sora leading-1.5 text-sm lg:text-base tracking-[0.28px] lg:tracking-[0.32px]"> Get started</span> </a> </div> </div> </ul> </div> <!-- Start This is only visible in all Child Page Header Display--> <!-- End This is only visible in all Child Page Header Display--> </header> <script> document.addEventListener('DOMContentLoaded', () => { const headerNavToggleBtn = document.getElementById("toggleMobileNav"); const headerNavContainer = document.querySelector(".header__nav"); const headerNavListItems = document.querySelectorAll(".header__nav .dropdown-link"); const header = document.querySelector('.header-bg'); headerNavToggleBtn.addEventListener("click", () => { if (headerNavContainer.classList.contains("showHeaderMobNav")) { headerNavContainer.classList.remove("showHeaderMobNav"); header.classList.add("sticky") header.classList.remove("fixed") document.querySelector(".toggleBtnName").textContent = "Menu"; document.getElementById("toggleMobileNav").childNodes[3].classList.add("hidden"); document.getElementById("toggleMobileNav").childNodes[1].classList.remove("hidden"); document.body.classList.remove("overflow-hidden") } else { headerNavContainer.classList.add("showHeaderMobNav"); header.classList.add("fixed") header.classList.remove("sticky") document.querySelector(".toggleBtnName").textContent = "Close"; document.getElementById("toggleMobileNav").childNodes[3].classList.remove("hidden"); document.getElementById("toggleMobileNav").childNodes[1].classList.add("hidden"); document.body.classList.add("overflow-hidden") } }); headerNavListItems.forEach((listItem) => { listItem.addEventListener("click", () => { const hasActiveDropdown = listItem.parentElement.classList.contains("active"); if (hasActiveDropdown) { listItem.parentElement.classList.remove("active"); } else { listItem.parentElement.classList.add("active"); } }) }) }); </script><!-- Check if the property is null or empty --> <!-- End here Check if the property is null or empty --> <!-- Check if the property is null or empty --> <!-- Check if the property is null or empty --> <div class=" cmp__logo-popover font-sora bg-gradient-to-r from-[#022eb9] to-[#003dff] w-[500px] m-3 border-2 border-[rgb(214 214 231)] rounded-md mt-6 hidden absolute"> <button aria-label="Close logo modal"> <svg xmlns="http://www.w3.org/2000/svg" class="crossIcon absolute right-0 top-0 my-1 mx-2 text-grey-200 opacity-[0.9] hover:text-white" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1" stroke-linecap="round" stroke-linejoin="round"> <line x1="18" y1="6" x2="6" y2="18"></line> <line x1="6" y1="6" x2="18" y2="18"></line> </svg> </button> <header class="flex flex-col items-center"> <div class="cmp-teaser__image"> <img style="width:px; height:px;" class="w-full" src="/files/live/sites/algolia-assets/files/icons/algolialogo.svg" alt=""/> </div> </header> </div> </div> <!-- End Header Component --> <span class="block"> </span> <div class="banner-section"> <!-- Check if the property is null or empty --> <!-- Check if the property is null or empty --> <div data-tracking="" class=" homepge_banner banner__default dark bg-tertiary"> <div id="algoliabanner" class="banner_item relative max-w-[1440px] mx-auto lg:px-14 px-4"> <!-- Check if the property is null or empty --> <!-- Check if the property is null or empty --> <div class="text-white"> <div class="cmp-teaser__content w-full flex flex-wrap justify-between py-14 lg:py-28 top-0 z-10"> <div class="lg:w-6/12 w-full text-center md:text-left self-center"> <span class="font-inter font-medium uppercase text-base text-xenon-400 mb-2 block banner_tag">ALGOLIA + SALESFORCE COMMERCE CLOUD</span> <h1 class="cmp-teaser__title leading-tight text-5xl lg:text-[56px] tracking-[-2px] font-sora font-bold mb-4 dark:text-white text-grey-900 break-words">Supercharge Salesforce Commerce Cloud with AI search</h1> <span class="font-sora font-light text-lg lg:text-2xl text-grey-700 dark:text-grey-200 my-0 mr-8"> <p>Power growth at scale with lightning-fast and flexible search.</p> </span> <div class="cmp-teaser__action-container grid justify-center gap-4 mt-10 md:flex md:justify-start lg:my-8 my-0 gap-x-4"> <!-- Check if the property is null or empty --> <!-- End here Check if the property is null or empty --> <div data-tracking="" class="flex font-sora "> <div class=" font-sora button last:me-0 inline-flex w-fit group"> <a href="/demorequest" data-finalurl="/cms/render/live/en/sites/www/home/demorequest.html" data-locale="en" data-is-internal="true" target="_self" class=" ctaGradient cmp-button overflow-hidden flex flex-wrap items-center cursor-pointer font-sora w-full primary-cta text-white px-4 lg:px-6 bg-xenon-400 rounded-lg min-h-12 lg:min-h-14 blue-gradient" style="--x: 0px; --y: 0px;"> <span class="cmp-button__text font-semibold mx-auto font-sora leading-1.5 text-sm lg:text-base tracking-[0.28px] lg:tracking-[0.32px]"> Get a demo</span> </a> </div> </div> <!-- Check if the property is null or empty --> <!-- End here Check if the property is null or empty --> <div data-tracking="" class="flex font-sora "> <div class=" font-sora button last:me-0 inline-flex w-fit group"> <a href="https://www.algolia.com/doc/integration/salesforce-commerce-cloud-b2c/getting-started/set-up-the-algolia-cartridge/?client=javascript" data-finalurl="https://www.algolia.com/doc/integration/salesforce-commerce-cloud-b2c/getting-started/set-up-the-algolia-cartridge/?client=javascript" data-locale="en" data-is-internal="true" target="_self" class=" ctaGradient cmp-button overflow-hidden flex flex-wrap items-center cursor-pointer font-sora w-full noBackGround-cta transparent dark:text-white text-grey-900 px-4 lg:px-6 bg-transparent shadow-[0_0_6px_2px_rgba(0,61,255,0.12)] border-2 dark:border-white border-grey-200 rounded-lg min-h-12 lg:min-h-14 " style="--x: 0px; --y: 0px;"> <span class="cmp-button__text font-semibold mx-auto font-sora leading-1.5 text-sm lg:text-base tracking-[0.28px] lg:tracking-[0.32px]"> Download the cartidge</span> </a> </div> </div> </div> </div> <div class="lg:w-6/12 cmp-teaser__image w-full h-full top-0 right-0 bottom-0 left-0 mt-6 lg:mt-0"> <img src='/files/live/sites/algolia-assets/files/integrated-salesforce/Integrations_SFCC.svg' class="w-full h-full object-center object-cover" alt="" /> </div> </div> </div></div> </div></div> <!-- Check if the property is null or empty --> <!-- Check if the property is null or empty --> <div id="" data-tracking="" class="main__container "> <div class=" mx-auto max-w-[1440px] lg:px-14 lg:py-28 px-4 py-8"> <div class="grid grid-cols-12 md:gap-x-16 gap-y-8"> <div class="col-span-12"> <!-- Check if the property is null or empty --> <!-- Check if the property is null or empty --> <div class="mx-auto mt-16 lg:mt-4"> <div class="flex flex-col items-center w-4/5 m-auto mb-4"> <div class=" text-center"> <h2 class="font-sora font-bold text-s34 lg:text-s42 mt-0 mb-4 text-grey-900 dark:text-white"> Leading global Salesforce Commerce Cloud retailers choose Algolia</h2> </div> </div> <div class=" z-10 grid gap-x-4 gap-y-8 px-16 grid-cols-1 "> <div class="slick multi-item-carousel" data-dots="false" data-arrows="true" data-centermode="false" data-autoplay="false" data-variablewidth="false" data-infinitescroll="true" data-slidetoshowxl="1" data-slidetoscrollxl="1" data-slidetoshowlg="1" data-slidetoscrolllg="1" data-slidetoshowmd="1" data-slidetoscrollmd="1" data-slidetoshowsm="1" data-slidetoscrollsm="1"> <div class="mx-auto mt-16 lg:mt-4"> <div class="flex w-[100px] lg:w-[200px] justify-center mx-auto"> <img alt="" src="/files/live/sites/algolia-assets/files/integrated-salesforce/ubisoft.svg" class="max-w-full object-contain w-auto h-1/5 mb-6 lg:mb-8" width="500" height="53"> </div> <div class=" z-1 grid gap-x-4 gap-y-8 lg:grid-cols-2 md:[&>*:nth-child(3n)]:border-l md:[&>*:nth-child(3n-1)]:border-l "> <!-- Check if the property is null or empty --> <!-- End here Check if the property is null or empty --> <!-- text-blue-500 bold --> <div class="teaser px-3 teaser-item-big-bold-title"> <div class="cmp-teaser flex flex-wrap"> <div class="cmp-teaser__content w-full text-center"> <h5 class="cmp-teaser__title font-bold lg:text-s42 text-s34 leading-9 font-sora mb-2 group-hover:text-xenon-600 text-xenon-400">>75%</h5> <div class="cmp-teaser__description font-inter font-normal mb-6 mt-4"> <span class="text-base lg:text-lg font-sora text-grey-700 dark:text-grey-200 group-hover:text-xenon-600"><p>reduction in &quot;no results&quot;</p> </span> </div> </div> </div> </div><!-- Check if the property is null or empty --> <!-- End here Check if the property is null or empty --> <!-- text-blue-500 bold --> <div class="teaser px-3 teaser-item-big-bold-title"> <div class="cmp-teaser flex flex-wrap"> <div class="cmp-teaser__content w-full text-center"> <h5 class="cmp-teaser__title font-bold lg:text-s42 text-s34 leading-9 font-sora mb-2 group-hover:text-xenon-600 text-xenon-400">+35%</h5> <div class="cmp-teaser__description font-inter font-normal mb-6 mt-4"> <span class="text-base lg:text-lg font-sora text-grey-700 dark:text-grey-200 group-hover:text-xenon-600"><p>uplift in conversion rate</p> </span> </div> </div> </div> </div></div> </div><div class="mx-auto mt-16 lg:mt-4"> <div class="flex w-[100px] lg:w-[200px] justify-center mx-auto"> <img alt="" src="/files/live/sites/algolia-assets/files/integrated-salesforce/lacoste.svg" class="max-w-full object-contain w-auto h-1/5 mb-6 lg:mb-8" width="500" height="53"> </div> <div class=" z-1 grid gap-x-4 gap-y-8 lg:grid-cols-2 md:[&>*:nth-child(3n)]:border-l md:[&>*:nth-child(3n-1)]:border-l "> <!-- Check if the property is null or empty --> <!-- End here Check if the property is null or empty --> <!-- text-blue-500 bold --> <div class="teaser px-3 teaser-item-big-bold-title"> <div class="cmp-teaser flex flex-wrap"> <div class="cmp-teaser__content w-full text-center"> <h5 class="cmp-teaser__title font-bold lg:text-s42 text-s34 leading-9 font-sora mb-2 group-hover:text-xenon-600 text-xenon-400">88%</h5> <div class="cmp-teaser__description font-inter font-normal mb-6 mt-4"> <span class="text-base lg:text-lg font-sora text-grey-700 dark:text-grey-200 group-hover:text-xenon-600"><p>decrease in bounce rate</p> </span> </div> </div> </div> </div><!-- Check if the property is null or empty --> <!-- End here Check if the property is null or empty --> <!-- text-blue-500 bold --> <div class="teaser px-3 teaser-item-big-bold-title"> <div class="cmp-teaser flex flex-wrap"> <div class="cmp-teaser__content w-full text-center"> <h5 class="cmp-teaser__title font-bold lg:text-s42 text-s34 leading-9 font-sora mb-2 group-hover:text-xenon-600 text-xenon-400">+62%</h5> <div class="cmp-teaser__description font-inter font-normal mb-6 mt-4"> <span class="text-base lg:text-lg font-sora text-grey-700 dark:text-grey-200 group-hover:text-xenon-600"><p>uplift in conversion rate on mobile</p> </span> </div> </div> </div> </div></div> </div><div class="mx-auto mt-16 lg:mt-4"> <div class="flex w-[100px] lg:w-[200px] justify-center mx-auto"> <img alt="" src="/files/live/sites/algolia-assets/files/integrated-salesforce/shoe-carnival.svg" class="max-w-full object-contain w-auto h-1/5 mb-6 lg:mb-8" width="500" height="53"> </div> <div class=" z-1 grid gap-x-4 gap-y-8 lg:grid-cols-2 md:[&>*:nth-child(3n)]:border-l md:[&>*:nth-child(3n-1)]:border-l "> <!-- Check if the property is null or empty --> <!-- End here Check if the property is null or empty --> <!-- text-blue-500 bold --> <div class="teaser px-3 teaser-item-big-bold-title"> <div class="cmp-teaser flex flex-wrap"> <div class="cmp-teaser__content w-full text-center"> <h5 class="cmp-teaser__title font-bold lg:text-s42 text-s34 leading-9 font-sora mb-2 group-hover:text-xenon-600 text-xenon-400">+4.5%</h5> <div class="cmp-teaser__description font-inter font-normal mb-6 mt-4"> <span class="text-base lg:text-lg font-sora text-grey-700 dark:text-grey-200 group-hover:text-xenon-600"><p>uplift in conversion rate</p> </span> </div> </div> </div> </div><!-- Check if the property is null or empty --> <!-- End here Check if the property is null or empty --> <!-- text-blue-500 bold --> <div class="teaser px-3 teaser-item-big-bold-title"> <div class="cmp-teaser flex flex-wrap"> <div class="cmp-teaser__content w-full text-center"> <h5 class="cmp-teaser__title font-bold lg:text-s42 text-s34 leading-9 font-sora mb-2 group-hover:text-xenon-600 text-xenon-400">2x</h5> <div class="cmp-teaser__description font-inter font-normal mb-6 mt-4"> <span class="text-base lg:text-lg font-sora text-grey-700 dark:text-grey-200 group-hover:text-xenon-600"><p>improvement in productivity</p> </span> </div> </div> </div> </div></div> </div></div> </div> </div></div> </div> </div> </div><!-- Check if the property is null or empty --> <!-- Check if the property is null or empty --> <div id="" data-tracking="" class="main__container bg-secondary"> <div class=" mx-auto max-w-[1440px] lg:px-14 lg:py-28 px-4 py-8"> <div class="grid grid-cols-12 md:gap-x-16 gap-y-8"> <div class="col-span-12"> <!-- Check if the property is null or empty --> <div data-tracking="" class="mx-auto "> <div class="flex flex-col items-center mb-4"> <div class=" text-center lg:w-[90%] w-full"> <h2 class="font-sora font-bold mt-0 mb-4 text-grey-900 dark:text-white text-s34 lg:text-s42"> AI-driven search for large catalogs without compromising on performance</h2> <div class="font-normal mb-8"> <span class="text-grey-700 text-base lg:text-lg dark:text-grey-200"><p>Integrate industry-leading AI search into Salesforce with multiple frontend options.</p> </span> </div> </div> </div> <!-- Check if the property is null or empty --> <!-- End here Check if the property is null or empty --> <!-- teaser with image left-right alignment --> <div class="teaser left-right-image px-4 first:mt-0 md:mt-24 mt-12"> <div class="cmp-teaser flex flex-wrap items-center justify-between"> <div class="cmp-teaser__image md:w-5/12"> <img src='/files/live/sites/algolia-assets/files/integrated-salesforce/Integration_Speed_9.avif' alt="" class="w-full mb-6" /> <figcaption class="block text-left font-inter font-normal leading-1.5 text-xs lg:text-sm text-grey-900 text-center"></figcaption> </div> <div class="cmp-teaser__content md:w-5/12 lg:px-4"> <h5 class='cmp-teaser__title lg:text-[32px] text-[26px] leading-[42px] font-sora mb-2 font-bold text-grey-900 dark:text-white'> Embrace unparalleled speed</h5> <div class="cmp-teaser__description font-inter font-normal mb-6 lg:mb-10 mt-2 lg:mt-3 "> <span class="text-base lg:text-lg text-grey-700 dark:text-grey-200 teaser-richtext check"><p>Algolia ensures lightning-fast search query responses in under 20 milliseconds. Our capability to fully reindex 100,000 products in under 10 minutes enables timely product information updates at scale.</p> </span> </div> </div> </div> </div><!-- Check if the property is null or empty --> <!-- End here Check if the property is null or empty --> <!-- teaser with image left-right alignment --> <div class="teaser left-right-image px-4 first:mt-0 md:mt-24 mt-12"> <div class="cmp-teaser flex flex-wrap items-center justify-between"> <div class="cmp-teaser__image md:w-5/12"> <img src='/files/live/sites/algolia-assets/files/integrated-salesforce/Salesforce-graphic-2.avif' alt="" class="w-full mb-6" /> <figcaption class="block text-left font-inter font-normal leading-1.5 text-xs lg:text-sm text-grey-900 text-center"></figcaption> </div> <div class="cmp-teaser__content md:w-5/12 lg:px-4"> <h5 class='cmp-teaser__title lg:text-[32px] text-[26px] leading-[42px] font-sora mb-2 font-bold text-grey-900 dark:text-white'> Boost customer experience with federated search</h5> <div class="cmp-teaser__description font-inter font-normal mb-6 lg:mb-10 mt-2 lg:mt-3 "> <span class="text-base lg:text-lg text-grey-700 dark:text-grey-200 teaser-richtext check"><p>Algolia&rsquo;s API-first approach enables unified experiences across multiple sources of content from Salesforce Clouds and external systems.</p> </span> </div> </div> </div> </div><!-- Check if the property is null or empty --> <!-- End here Check if the property is null or empty --> <!-- teaser with image left-right alignment --> <div class="teaser left-right-image px-4 first:mt-0 md:mt-24 mt-12"> <div class="cmp-teaser flex flex-wrap items-center justify-between"> <div class="cmp-teaser__image md:w-5/12"> <img src='/files/live/sites/algolia-assets/files/integrated-salesforce/Features_Create_truly_unique_AI_36.avif' alt="" class="w-full mb-6" /> <figcaption class="block text-left font-inter font-normal leading-1.5 text-xs lg:text-sm text-grey-900 text-center"></figcaption> </div> <div class="cmp-teaser__content md:w-5/12 lg:px-4"> <h5 class='cmp-teaser__title lg:text-[32px] text-[26px] leading-[42px] font-sora mb-2 font-bold text-grey-900 dark:text-white'> Deliver unmatched relevance and personalization to your customers</h5> <div class="cmp-teaser__description font-inter font-normal mb-6 lg:mb-10 mt-2 lg:mt-3 "> <span class="text-base lg:text-lg text-grey-700 dark:text-grey-200 teaser-richtext check"><p>Use&nbsp;<a href="https://www.algolia.com/products/search-and-discovery/personalization/">AI Personalization</a>&nbsp;to offer relevant and tailored results across all touchpoints, increasing the chance of conversion.</p> </span> </div> </div> </div> </div><!-- Check if the property is null or empty --> <!-- End here Check if the property is null or empty --> <!-- teaser with image left-right alignment --> <div class="teaser left-right-image px-4 first:mt-0 md:mt-24 mt-12"> <div class="cmp-teaser flex flex-wrap items-center justify-between"> <div class="cmp-teaser__image md:w-5/12"> <img src='/files/live/sites/algolia-assets/files/integrated-salesforce/Features_Searchandising_47.svg' alt="" class="w-full mb-6" /> <figcaption class="block text-left font-inter font-normal leading-1.5 text-xs lg:text-sm text-grey-900 text-center"></figcaption> </div> <div class="cmp-teaser__content md:w-5/12 lg:px-4"> <h5 class='cmp-teaser__title lg:text-[32px] text-[26px] leading-[42px] font-sora mb-2 font-bold text-grey-900 dark:text-white'> Improve productivity while being in control</h5> <div class="cmp-teaser__description font-inter font-normal mb-6 lg:mb-10 mt-2 lg:mt-3 "> <span class="text-base lg:text-lg text-grey-700 dark:text-grey-200 teaser-richtext check"><p>Through a blend of AI, data-driven insights and manual controls, Algolia&rsquo;s&nbsp;<a href="https://www.algolia.com/industries-and-solutions/ecommerce/digital-merchandising/">Merchandising Studio</a>&nbsp;empowers retailers to create optimized and high-converting shopping experiences, while saving time and effort for merchandisers.</p> </span> </div> </div> </div> </div></div> <style> .slick-next, .slick-prev{ z-index: 5; color: black; top: 50%; } .slick-next:focus, .slick-prev:focus{ color: black; } .slick-prev{ left: -50px; } .slick-next{ right: -50px; } .slick-dots li button{ background-color: rgb(230, 230, 230); border: 1px solid rgb(190, 190, 190); border-radius: 100%; } .slick-dots li button:before{ content: ''; } .slick-prev:hover, .slick-next:hover{ color: black; background: linear-gradient( 138deg, rgba(187, 209, 255, 0.2) 0%, rgba(118, 160, 255, 0.2) 25.08%, rgba(226, 167, 255, 0.2) 56.38%, rgba(187, 209, 255, 0.2) 100% ) } .slick-next::before{ content: ""; color: black; } .slick-prev::before{ content: ""; color: black; } .slick-arrow{ border-radius: 100%; width: 3rem; height: 3rem; display: flex; justify-content: center; align-items: center; border: 2px solid rgb(214 214 231); } .left-right-image:nth-child(odd) .cmp-teaser{ flex-direction: row-reverse; } .slick .teaser.slick-slide { display: flex; flex-direction: column; align-items: center; } .slick .teaser.slick-slide .cmp-teaser { max-width: 800px; } @media (max-width: 768px) { .slick-prev { left: 132px; top: -62px; } .slick-next { left: 188px; top: -62px; } } /* @media (max-width: 768px) { .slick-arrow { display: none !important; } } */ </style></div> </div> </div> </div><!-- Check if the property is null or empty --> <!-- Check if the property is null or empty --> <div id="" data-tracking="" class="main__container "> <div class=" mx-auto max-w-[1440px] lg:px-14 lg:py-28 px-4 py-8"> <div class="grid grid-cols-12 md:gap-x-16 gap-y-8"> <div class="col-span-12"> <div class="container mx-auto mb-20"> <div class="flex flex-col items-center mb-8"> <div class=" text-center lg:w-[90%] w-full"> <h2 class="font-sora font-bold mt-0 mb-4 text-grey-900 text-s34 lg:text-s42 dark:text-white"> Combine the power of Salesforce Commerce Cloud and Algolia to drive revenue</h2> </div> </div> <div class="accordion flex flex-wrap items-center justify-between"> <div class="cmp-teaser__images lg:block hidden md:w-5/12 px-4 md:order-2 "> <img src='/files/live/sites/algolia-assets/files/integrated-salesforce/Features_Optimize_37.svg' alt="" class="w-full hidden" data-accordion-id="6200e4d8-4c3d-4405-8c28-4b8a41ec3f85"/> <img src='/files/live/sites/algolia-assets/files/integrated-salesforce/Solutions_Enterprise%20(1).svg' alt="" class="w-full hidden" data-accordion-id="d5ca695a-b147-46b5-a741-71483c32e426"/> <img src='/files/live/sites/algolia-assets/files/integrated-salesforce/Salesforce-graphic-1.avif' alt="" class="w-full hidden" data-accordion-id="bac21d1c-8831-4726-aea3-edd4934764fc"/> <img src='/files/live/sites/algolia-assets/files/integrated-salesforce/Industry_The_next_disruption_3.avif' alt="" class="w-full hidden" data-accordion-id="10cf44b3-6759-41b9-827e-10a9ee67918f"/> </div> <div class="cmp-accordion w-full md:w-[45%] " data-expansion-type="multiItem"> <div class="listAnimation"> <div class="cmp-accordion__item"> <div class="cmp-accordion__header dark:hover:bg-inherit hover:bg-xenon-100"> <button type="button" data-uid="6200e4d8-4c3d-4405-8c28-4b8a41ec3f85" class="cmp-accordion__button relative flex flex-nowrap justify-between items-center w-full px-4 py-4 lg:py-6 ps-0 text-2xl text-left font-sora font-light" id="accordion-6200e4d8-4c3d-4405-8c28-4b8a41ec3f85-button" aria-expanded="false" aria-controls="accordion-6200e4d8-4c3d-4405-8c28-4b8a41ec3f85-panel"> <span class="cmp-text flex flex-wrap items-center flex-1 font-sora text-lg lg:text-2xl font-bold dark:text-white"> Uplift in conversion</span> <span class="cmp-accordion-price justify-end flex-wrap items-center font-sora font-bold text-grey-900 font-sora text-lg lg:text-2xl font-bold dark:text-white hidden">0</span> <span class="cmp-caret-icon rotate-0 [.expanded_&]:rotate-180 text-blue-600"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" role="img" title="Arrow down" class=""> <polyline points="6 9 12 15 18 9"></polyline> </svg> </span> </button> </div> <div class="cmp-accordion__panel hidden pb-6 p-0" id="accordion-6200e4d8-4c3d-4405-8c28-4b8a41ec3f85-panel" aria-labelledby="accordion-6200e4d8-4c3d-4405-8c28-4b8a41ec3f85-button" aria-hidden="true"> <div class="font-inter font-normal text-grey-700 font-inter font-normal text-[16px] lg:text-[18px] dark:text-grey-200 "> <div class="algoliaRichText check"><p>Customers leveraging Algolia see improved conversion by up to 30%.</p> </div></div> <div class="cmp-teaser__image px-4 md:w-5/12 mb-4"> <img src='/files/live/sites/algolia-assets/files/integrated-salesforce/Features_Optimize_37.svg' alt="" class="w-full lg:hidden" data-accordion-id="6200e4d8-4c3d-4405-8c28-4b8a41ec3f85" /> </div> </div> </div> </div> <div class="listAnimation"> <div class="cmp-accordion__item"> <div class="cmp-accordion__header dark:hover:bg-inherit hover:bg-xenon-100"> <button type="button" data-uid="d5ca695a-b147-46b5-a741-71483c32e426" class="cmp-accordion__button relative flex flex-nowrap justify-between items-center w-full px-4 py-4 lg:py-6 ps-0 text-2xl text-left font-sora font-light" id="accordion-d5ca695a-b147-46b5-a741-71483c32e426-button" aria-expanded="false" aria-controls="accordion-d5ca695a-b147-46b5-a741-71483c32e426-panel"> <span class="cmp-text flex flex-wrap items-center flex-1 font-sora text-lg lg:text-2xl font-bold dark:text-white"> Search performance even for 20M+ SKUs</span> <span class="cmp-accordion-price justify-end flex-wrap items-center font-sora font-bold text-grey-900 font-sora text-lg lg:text-2xl font-bold dark:text-white hidden">0</span> <span class="cmp-caret-icon rotate-0 [.expanded_&]:rotate-180 text-blue-600"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" role="img" title="Arrow down" class=""> <polyline points="6 9 12 15 18 9"></polyline> </svg> </span> </button> </div> <div class="cmp-accordion__panel hidden pb-6 p-0" id="accordion-d5ca695a-b147-46b5-a741-71483c32e426-panel" aria-labelledby="accordion-d5ca695a-b147-46b5-a741-71483c32e426-button" aria-hidden="true"> <div class="font-inter font-normal text-grey-700 font-inter font-normal text-[16px] lg:text-[18px] dark:text-grey-200 "> <div class="algoliaRichText check"><p>Grow your catalog and keep it up-to-date effortlessly. Algolia supports advanced use cases and is able to handle large catalogs without sacrificing performance.</p> </div></div> <div class="cmp-teaser__image px-4 md:w-5/12 mb-4"> <img src='/files/live/sites/algolia-assets/files/integrated-salesforce/Solutions_Enterprise%20(1).svg' alt="" class="w-full lg:hidden" data-accordion-id="d5ca695a-b147-46b5-a741-71483c32e426" /> </div> </div> </div> </div> <div class="listAnimation"> <div class="cmp-accordion__item"> <div class="cmp-accordion__header dark:hover:bg-inherit hover:bg-xenon-100"> <button type="button" data-uid="bac21d1c-8831-4726-aea3-edd4934764fc" class="cmp-accordion__button relative flex flex-nowrap justify-between items-center w-full px-4 py-4 lg:py-6 ps-0 text-2xl text-left font-sora font-light" id="accordion-bac21d1c-8831-4726-aea3-edd4934764fc-button" aria-expanded="false" aria-controls="accordion-bac21d1c-8831-4726-aea3-edd4934764fc-panel"> <span class="cmp-text flex flex-wrap items-center flex-1 font-sora text-lg lg:text-2xl font-bold dark:text-white"> Seamless integration and flexible APIs</span> <span class="cmp-accordion-price justify-end flex-wrap items-center font-sora font-bold text-grey-900 font-sora text-lg lg:text-2xl font-bold dark:text-white hidden">0</span> <span class="cmp-caret-icon rotate-0 [.expanded_&]:rotate-180 text-blue-600"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" role="img" title="Arrow down" class=""> <polyline points="6 9 12 15 18 9"></polyline> </svg> </span> </button> </div> <div class="cmp-accordion__panel hidden pb-6 p-0" id="accordion-bac21d1c-8831-4726-aea3-edd4934764fc-panel" aria-labelledby="accordion-bac21d1c-8831-4726-aea3-edd4934764fc-button" aria-hidden="true"> <div class="font-inter font-normal text-grey-700 font-inter font-normal text-[16px] lg:text-[18px] dark:text-grey-200 "> <div class="algoliaRichText check"><p>Algolia is built for composable architectures and supports search across multiple data sources.&nbsp;<a href="https://www.algolia.com/doc/integration/salesforce-commerce-cloud-b2c/getting-started/introduction/?client=javascript">Deploy Algolia</a>&nbsp;with your native storefront (SiteGenesis or SFRA), or choose a headless approach, leveraging Algolia with Salesforce&rsquo;s PWA Kit or other modern frontend frameworks.</p> </div></div> <div class="cmp-teaser__image px-4 md:w-5/12 mb-4"> <img src='/files/live/sites/algolia-assets/files/integrated-salesforce/Salesforce-graphic-1.avif' alt="" class="w-full lg:hidden" data-accordion-id="bac21d1c-8831-4726-aea3-edd4934764fc" /> </div> </div> </div> </div> <div class="listAnimation"> <div class="cmp-accordion__item"> <div class="cmp-accordion__header dark:hover:bg-inherit hover:bg-xenon-100"> <button type="button" data-uid="10cf44b3-6759-41b9-827e-10a9ee67918f" class="cmp-accordion__button relative flex flex-nowrap justify-between items-center w-full px-4 py-4 lg:py-6 ps-0 text-2xl text-left font-sora font-light" id="accordion-10cf44b3-6759-41b9-827e-10a9ee67918f-button" aria-expanded="false" aria-controls="accordion-10cf44b3-6759-41b9-827e-10a9ee67918f-panel"> <span class="cmp-text flex flex-wrap items-center flex-1 font-sora text-lg lg:text-2xl font-bold dark:text-white"> Connected online and offline experiences with BOPIS</span> <span class="cmp-accordion-price justify-end flex-wrap items-center font-sora font-bold text-grey-900 font-sora text-lg lg:text-2xl font-bold dark:text-white hidden">0</span> <span class="cmp-caret-icon rotate-0 [.expanded_&]:rotate-180 text-blue-600"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" role="img" title="Arrow down" class=""> <polyline points="6 9 12 15 18 9"></polyline> </svg> </span> </button> </div> <div class="cmp-accordion__panel hidden pb-6 p-0" id="accordion-10cf44b3-6759-41b9-827e-10a9ee67918f-panel" aria-labelledby="accordion-10cf44b3-6759-41b9-827e-10a9ee67918f-button" aria-hidden="true"> <div class="font-inter font-normal text-grey-700 font-inter font-normal text-[16px] lg:text-[18px] dark:text-grey-200 "> <div class="algoliaRichText check"><p>Create optimized BOPIS (buy online, pick up in-store) experiences with geolocation and targeted store inventory search.</p> </div></div> <div class="cmp-teaser__image px-4 md:w-5/12 mb-4"> <img src='/files/live/sites/algolia-assets/files/integrated-salesforce/Industry_The_next_disruption_3.avif' alt="" class="w-full lg:hidden" data-accordion-id="10cf44b3-6759-41b9-827e-10a9ee67918f" /> </div> </div> </div> </div></div> </div> </div></div> </div> </div> </div><!-- Check if the property is null or empty --> <!-- Check if the property is null or empty --> <div id="" data-tracking="" class="main__container bg-secondary"> <div class=" mx-auto max-w-[1440px] lg:px-14 lg:py-28 px-4 py-8"> <div class="grid grid-cols-12 md:gap-x-16 gap-y-8"> <div class="col-span-12"> <!-- Check if the property is null or empty --> <div data-tracking="" class="mx-auto "> <div class="flex flex-col items-center mb-4"> <div class=" text-center lg:w-[90%] w-full"> <h2 class="font-sora font-bold text-s34 mt-0 mb-4 text-grey-900 dark:text-white lg:text-s42"> The one-stop-shop for AI Search</h2> </div> </div> <div class=" z-1 grid gap-8 md:grid-cols-4"> <!-- Check if the property is null or empty --> <!-- End here Check if the property is null or empty --> <!-- CardView With Left Image(Icon) --> <div class="teaser "> <div class="cmp-teaser flex flex-wrap"> <div class="cmp-teaser__image"> <img style="width:px; height:px;" src="/files/live/sites/algolia-assets/files/icons/checkcircle.svg" class="w-full" alt=""> </div> <div class="cmp-teaser__content w-full text-left mt-3"> <div class="cmp-teaser__description font-inter font-normal mb-6"> <span class="text-lg text-grey-700 teaser-richtext check"><p>Scale with a reliable solution, trusted by 17k+ customers.</p> </span> </div> </div> </div> </div><!-- Check if the property is null or empty --> <!-- End here Check if the property is null or empty --> <!-- CardView With Left Image(Icon) --> <div class="teaser "> <div class="cmp-teaser flex flex-wrap"> <div class="cmp-teaser__image"> <img style="width:px; height:px;" src="/files/live/sites/algolia-assets/files/icons/checkcircle.svg" class="w-full" alt=""> </div> <div class="cmp-teaser__content w-full text-left mt-3"> <div class="cmp-teaser__description font-inter font-normal mb-6"> <span class="text-lg text-grey-700 teaser-richtext check"><p>Enterprise ready with 140B+ search queries per month &amp; a 99.999% SLA.</p> </span> </div> </div> </div> </div><!-- Check if the property is null or empty --> <!-- End here Check if the property is null or empty --> <!-- CardView With Left Image(Icon) --> <div class="teaser "> <div class="cmp-teaser flex flex-wrap"> <div class="cmp-teaser__image"> <img style="width:px; height:px;" src="/files/live/sites/algolia-assets/files/icons/checkcircle.svg" class="w-full" alt=""> </div> <div class="cmp-teaser__content w-full text-left mt-3"> <div class="cmp-teaser__description font-inter font-normal mb-6"> <span class="text-lg text-grey-700 teaser-richtext check"><p>Adapting to your needs in both&nbsp;<a href="https://www.algolia.com/industries/ecommerce/">B2C</a>&nbsp;and&nbsp;<a href="https://www.algolia.com/industries/b2b-ecommerce/">B2B</a>&nbsp;environments.</p> </span> </div> </div> </div> </div><!-- Check if the property is null or empty --> <!-- End here Check if the property is null or empty --> <!-- CardView With Left Image(Icon) --> <div class="teaser "> <div class="cmp-teaser flex flex-wrap"> <div class="cmp-teaser__image"> <img style="width:px; height:px;" src="/files/live/sites/algolia-assets/files/icons/checkcircle.svg" class="w-full" alt=""> </div> <div class="cmp-teaser__content w-full text-left mt-3"> <div class="cmp-teaser__description font-inter font-normal mb-6"> <span class="text-lg text-grey-700 teaser-richtext check"><p>Advanced use cases support such as search performance for 20M+ SKUs, inventory-aware search, BOPIS and more.</p> </span> </div> </div> </div> </div></div> </div> <style> .slick-next, .slick-prev{ z-index: 5; color: black; top: 50%; } .slick-next:focus, .slick-prev:focus{ color: black; } .slick-prev{ left: -50px; } .slick-next{ right: -50px; } .slick-dots li button{ background-color: rgb(230, 230, 230); border: 1px solid rgb(190, 190, 190); border-radius: 100%; } .slick-dots li button:before{ content: ''; } .slick-prev:hover, .slick-next:hover{ color: black; background: linear-gradient( 138deg, rgba(187, 209, 255, 0.2) 0%, rgba(118, 160, 255, 0.2) 25.08%, rgba(226, 167, 255, 0.2) 56.38%, rgba(187, 209, 255, 0.2) 100% ) } .slick-next::before{ content: ""; color: black; } .slick-prev::before{ content: ""; color: black; } .slick-arrow{ border-radius: 100%; width: 3rem; height: 3rem; display: flex; justify-content: center; align-items: center; border: 2px solid rgb(214 214 231); } .mx-auto .left-right-image:nth-child(odd) .cmp-teaser{ flex-direction: row-reverse; } .slick .teaser.slick-slide { display: flex; flex-direction: column; align-items: center; } .slick .teaser.slick-slide .cmp-teaser { max-width: 800px; } @media (max-width: 768px) { .slick-prev{ left: 132px; top: -62px; } .slick-next{ left: 188px; top: -62px; } } </style></div> </div> </div> </div><!-- Check if the property is null or empty --> <!-- Check if the property is null or empty --> <div id="" data-tracking="" class="main__container "> <div class=" mx-auto max-w-[1440px] lg:px-14 lg:py-28 px-4 py-8"> <div class="grid grid-cols-12 md:gap-x-16 gap-y-8"> <div class="col-span-12"> <!-- Start Image List Container --> <!-- Check if the property is null or empty --> <div data-tracking="" class="teaser-container mx-auto "> <div class="flex flex-col items-center mb-4"> <div class=" text-center lg:w-[90%] w-full"> <h2 class="font-sora mt-0 mb-4 text-grey-900 dark:text-white text-s34 lg:text-s42 font-bold"> Leading brands rely on Algolia</h2> </div> </div> <div class=" z-1 grid gap-x-4 gap-y-8 mb-12 lg:mb-16 grid-cols-2 md:grid-cols-4"> <!-- Check if the property is null or empty --> <!-- End here Check if the property is null or empty --> <!-- Start Image List Teaser--> <div class="teaser imageList flex justify-center items-center "> <div class="cmp-teaser flex flex-wrap items-center justify-center flex-col"> <div class="cmp-teaser__image flex items-center justify-center h-12 lg:h-24" > <img style="width:px; height:px;" class="max-w-full object-contain m-auto w-auto h-full aspect-[3/2]" src="/files/live/sites/algolia-assets/files/integrated-salesforce/dior.svg" alt=""/> </div> </div> </div> <!-- End Image List Teaser--><!-- Check if the property is null or empty --> <!-- End here Check if the property is null or empty --> <!-- Start Image List Teaser--> <div class="teaser imageList flex justify-center items-center "> <div class="cmp-teaser flex flex-wrap items-center justify-center flex-col"> <div class="cmp-teaser__image flex items-center justify-center h-12 lg:h-24" > <img style="width:px; height:px;" class="max-w-full object-contain m-auto w-auto h-full aspect-[3/2]" src="/files/live/sites/algolia-assets/files/integrated-salesforce/lacoste.svg" alt=""/> </div> </div> </div> <!-- End Image List Teaser--><!-- Check if the property is null or empty --> <!-- End here Check if the property is null or empty --> <!-- Start Image List Teaser--> <div class="teaser imageList flex justify-center items-center "> <div class="cmp-teaser flex flex-wrap items-center justify-center flex-col"> <div class="cmp-teaser__image flex items-center justify-center h-12 lg:h-24" > <img style="width:px; height:px;" class="max-w-full object-contain m-auto w-auto h-full aspect-[3/2]" src="/files/live/sites/algolia-assets/files/integrated-salesforce/ubisoft.svg" alt=""/> </div> </div> </div> <!-- End Image List Teaser--><!-- Check if the property is null or empty --> <!-- End here Check if the property is null or empty --> <!-- Start Image List Teaser--> <div class="teaser imageList flex justify-center items-center "> <div class="cmp-teaser flex flex-wrap items-center justify-center flex-col"> <div class="cmp-teaser__image flex items-center justify-center h-12 lg:h-24" > <img style="width:px; height:px;" class="max-w-full object-contain m-auto w-auto h-full aspect-[3/2]" src="/files/live/sites/algolia-assets/files/integrated-salesforce/shoe-carnival.svg" alt=""/> </div> </div> </div> <!-- End Image List Teaser--></div> </div> <!-- End Image List Container --> <!-- if edit mode display button to add more images to the carousel --><!-- Check if the property is null or empty --> <div data-tracking="" class="mx-auto mt-16 md:mt-4"> <div class="slick multi-item-carousel" data-dots="false" data-arrows="true" data-centermode="false" data-autoplay="false" data-variablewidth="false" data-infinitescroll="true" data-slidetoshowxl="1" data-slidetoscrollxl="1" data-slidetoshowlg="1" data-slidetoscrolllg="1" data-slidetoshowmd="1" data-slidetoscrollmd="1" data-slidetoshowsm="1" data-slidetoscrollsm="1"> <!-- Check if the property is null or empty --> <!-- End here Check if the property is null or empty --> <!-- Teaser W/o Image --> <!-- text-blue-500 --> <div class="teaser px-3 "> <div class="cmp-teaser flex flex-wrap "> <div class="cmp-teaser__image w-full h-full lg:mb-8 mb-6"> <img style="width:px; height:px;" src='/files/live/sites/algolia-assets/files/integrated-salesforce/ubisoft.svg' class="w-[220px] mx-auto max-w-full object-contain max-h-[100px]" alt="" /> </div> <div class="cmp-teaser__content w-full text-center"> <div class="cmp-teaser__description font-inter font-normal mb-6 mt-4"> <span class="text-lg font-sora text-grey-700 dark:text-grey-200 group-hover:text-xenon-600"><blockquote>&ldquo;We&rsquo;ve had great results using Algolia, which has been really easy to integrate with Salesforce Commerce Cloud and manage configurations across different countries, and plan on extending its usage from 5 to all 17 online stores in 2020.&rdquo;</blockquote> <p>David Leveau</p> <p>Ecommerce Project Manager&nbsp;@ Ubisoft</p> </span> </div> <div class="cmp-teaser__action-container mb-8 lg:mb-0"> <!-- Check if the property is null or empty --> <!-- End here Check if the property is null or empty --> <div data-tracking="" class="flex font-sora justify-center"> <div class=" font-sora button last:me-0 inline-flex w-fit group"> <a href="" data-finalurl="" data-locale="en" data-is-internal="true" target="_self" class=" ctaGradient cmp-button overflow-hidden flex flex-wrap items-center justify-center cursor-pointer font-sora w-full white-cta white cta-bg-white px-4 lg:px-6 bg-white hover:text-grey-700 text-grey-900 shadow-md border-2 border-white rounded-lg min-h-12 lg:min-h-14 " style="--x: 0px; --y: 0px;"> <span class="cmp-button__text font-semibold mx-auto font-sora leading-1.5 text-sm lg:text-base tracking-[0.28px] lg:tracking-[0.32px]"> Read their story</span> </a> </div> </div> </div> </div> </div> </div> <!-- Check if the property is null or empty --> <!-- End here Check if the property is null or empty --> <!-- Teaser W/o Image --> <!-- text-blue-500 --> <div class="teaser px-3 "> <div class="cmp-teaser flex flex-wrap "> <div class="cmp-teaser__image w-full h-full lg:mb-8 mb-6"> <img style="width:px; height:px;" src='/files/live/sites/algolia-assets/files/integrated-salesforce/shoe-carnival.svg' class="w-[220px] mx-auto max-w-full object-contain max-h-[100px]" alt="" /> </div> <div class="cmp-teaser__content w-full text-center"> <div class="cmp-teaser__description font-inter font-normal mb-6 mt-4"> <span class="text-lg font-sora text-grey-700 dark:text-grey-200 group-hover:text-xenon-600"><blockquote>&ldquo;In today&rsquo;s competitive climate, it&rsquo;s more important than ever for retailers to have the tools needed to meet customer expectations. What our customers want today might be different tomorrow, and that&rsquo;s the level of speed that Algolia provides. Algolia&rsquo;s efficiency has led to increased conversion rates, higher revenue, and better overall experience.&rdquo;</blockquote> <p>Courtney Grisham</p> <p>Director of Ecommerce&nbsp;@ Shoe Carnival</p> </span> </div> <div class="cmp-teaser__action-container mb-8 lg:mb-0"> <!-- Check if the property is null or empty --> <!-- End here Check if the property is null or empty --> <div data-tracking="" class="flex font-sora justify-center"> <div class=" font-sora button last:me-0 inline-flex w-fit group"> <a href="" data-finalurl="" data-locale="en" data-is-internal="true" target="_self" class=" ctaGradient cmp-button overflow-hidden flex flex-wrap items-center justify-center cursor-pointer font-sora w-full white-cta white cta-bg-white px-4 lg:px-6 bg-white hover:text-grey-700 text-grey-900 shadow-md border-2 border-white rounded-lg min-h-12 lg:min-h-14 " style="--x: 0px; --y: 0px;"> <span class="cmp-button__text font-semibold mx-auto font-sora leading-1.5 text-sm lg:text-base tracking-[0.28px] lg:tracking-[0.32px]"> Read their story</span> </a> </div> </div> </div> </div> </div> </div> <!-- Check if the property is null or empty --> <!-- End here Check if the property is null or empty --> <!-- Teaser W/o Image --> <!-- text-blue-500 --> <div class="teaser px-3 "> <div class="cmp-teaser flex flex-wrap "> <div class="cmp-teaser__image w-full h-full lg:mb-8 mb-6"> <img style="width:px; height:px;" src='/files/live/sites/algolia-assets/files/integrated-salesforce/lacoste.svg' class="w-[220px] mx-auto max-w-full object-contain max-h-[100px]" alt="" /> </div> <div class="cmp-teaser__content w-full text-center"> <div class="cmp-teaser__description font-inter font-normal mb-6 mt-4"> <span class="text-lg font-sora text-grey-700 dark:text-grey-200 group-hover:text-xenon-600"><blockquote>&ldquo;The combination of Algolia and Salesforce Commerce Cloud is a critical part of delivering this digital experience across Lacoste platforms globally and has helped double our global sales.&rdquo;</blockquote> <p>J&eacute;r&eacute;mie Szpiro</p> <p>Global Digital Director&nbsp;@ Lacoste</p> </span> </div> <div class="cmp-teaser__action-container mb-8 lg:mb-0"> <!-- Check if the property is null or empty --> <!-- End here Check if the property is null or empty --> <div data-tracking="" class="flex font-sora justify-center"> <div class=" font-sora button last:me-0 inline-flex w-fit group"> <a href="" data-finalurl="" data-locale="en" data-is-internal="true" target="_blank" class=" ctaGradient cmp-button overflow-hidden flex flex-wrap items-center justify-center cursor-pointer font-sora w-full white-cta white cta-bg-white px-4 lg:px-6 bg-white hover:text-grey-700 text-grey-900 shadow-md border-2 border-white rounded-lg min-h-12 lg:min-h-14 " style="--x: 0px; --y: 0px;"> <span class="cmp-button__text font-semibold mx-auto font-sora leading-1.5 text-sm lg:text-base tracking-[0.28px] lg:tracking-[0.32px]"> Read their story</span> </a> </div> </div> </div> </div> </div> </div></div> </div> <style> .slick-next, .slick-prev{ z-index: 5; color: black; top: 50%; } .slick-next:focus, .slick-prev:focus{ color: black; } .slick-prev{ left: -50px; } .slick-next{ right: -50px; } .slick-dots li button{ background-color: rgb(230, 230, 230); border: 1px solid rgb(190, 190, 190); border-radius: 100%; } .slick-dots li button:before{ content: ''; } .slick-prev:hover, .slick-next:hover{ color: black; background: linear-gradient( 138deg, rgba(187, 209, 255, 0.2) 0%, rgba(118, 160, 255, 0.2) 25.08%, rgba(226, 167, 255, 0.2) 56.38%, rgba(187, 209, 255, 0.2) 100% ) } .slick-next::before{ content: ""; color: black; } .slick-prev::before{ content: ""; color: black; } .slick-arrow{ border-radius: 100%; width: 3rem; height: 3rem; display: flex; justify-content: center; align-items: center; border: 2px solid rgb(214 214 231); } .left-right-image:nth-child(odd) .cmp-teaser{ flex-direction: row-reverse; } /* ----------------- Start for teaser 1 view only --------------- */ .teaser .cmp-teaser .cmp-teaser__content blockquote{ margin-bottom: 1rem; } /* -----------------End for teaser 1 view only --------------- */ @media (max-width: 768px) { .slick-prev{ left: 132px; top: -62px; } .slick-next{ left: 188px; top: -62px; } .multi-item-carousel .teaser h5{ font-size: 1rem; } } .multi-item-carousel .teaser h5{ font-weight: normal; font-size: 1.5rem; } .grid-cols-12 .md\:col-span-6 .slick-slide blockquote{ line-height: 34px; font-weight: 300; color: #23263b; font-size: 24px; margin-bottom:2rem; } .dark .grid-cols-12 .md\:col-span-6 .slick-slide blockquote{ color: white; } .slick .teaser.slick-slide { display: flex; flex-direction: column; align-items: center; } .slick .teaser.slick-slide .cmp-teaser { max-width: 800px; } .teaser-item-big-bold-title .cmp-teaser .cmp-teaser__content > .cmp-teaser__title{ font-size: 42px; font-weight: 700; } </style></div> </div> </div> </div><!-- Check if the property is null or empty --> <!-- Check if the property is null or empty --> <div id="" data-tracking="" class="main__container "> <div class=" mx-auto max-w-[1440px] lg:px-14 lg:py-28 px-4 py-8"> <div class="grid grid-cols-12 md:gap-x-16 gap-y-8"> <div class="col-span-12"> <!-- Check if the property is null or empty --> <div data-tracking="" class="mx-auto "> <div class="flex flex-col items-center mb-4"> <div class=" text-center lg:w-[90%] w-full"> <h2 class="font-sora font-bold text-s34 mt-0 mb-4 text-grey-900 dark:text-white lg:text-s42"> Ready to accelerate your journey?</h2> </div> </div> <div class=" z-1 grid gap-8 md:grid-cols-2"> <!-- Check if the property is null or empty --> <!-- End here Check if the property is null or empty --> <!-- CardView With Left Image(Icon) --> <div class="teaser "> <div class="cmp-teaser flex flex-wrap"> <div class="cmp-teaser__content w-full text-left mt-3"> <h5 class='cmp-teaser__title lg:text-[32px] text-[26px] leading-9 font-sora font-bold mb-4 text-lg lg:text-2xl text-grey-900 dark:text-white'>Algolia Platform Accelerators</h5> <div class="cmp-teaser__description font-inter font-normal mb-6"> <span class="text-lg text-grey-700 teaser-richtext check"><p>If you have a specific use case and need assistance with deploying a custom integration, Algolia&rsquo;s Professional Services organization has developed a service offering aimed at accelerating the design and development of connectors for some of the most popular solutions in the market.</p> </span> </div> <div class="cmp-teaser__action-container"> <!-- Check if the property is null or empty --> <!-- End here Check if the property is null or empty --> <div data-tracking="" class="flex font-sora "> <div class=" font-sora button last:me-0 inline-flex w-fit group"> <a href="#" data-finalurl="#" data-locale="en" data-is-internal="true" target="" class=" ctaGradient cmp-button overflow-hidden flex flex-wrap items-center cursor-pointer font-sora w-full withIcon-cta text-grey-900 dark:text-white px-0 text-sm lg:text-base flex-nowrap " style="--x: 0px; --y: 0px;"> <span class="cmp-button__text font-semibold mx-auto font-sora leading-1.5 text-sm lg:text-base tracking-[0.28px] lg:tracking-[0.32px]"> Contact us for more information </span> <span class="cmp-button__icon ms-3 text-blue-600 "> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" role="img" title="ArrowRightCircle" class=" h-8 lg:w-full group-hover:fill-xenon-400 dark:group-hover:text-black group-hover:text-white transition-all duration-[400ms] ease-in group-hover:scale-[1.1]"><circle cx="12" cy="12" r="10"></circle><polyline points="12 16 16 12 12 8"></polyline><line x1="8" y1="12" x2="16" y2="12"></line></svg> </span></a> </div> </div> </div> </div> </div> </div><!-- Check if the property is null or empty --> <!-- End here Check if the property is null or empty --> <!-- CardView With Left Image(Icon) --> <div class="teaser "> <div class="cmp-teaser flex flex-wrap"> <div class="cmp-teaser__content w-full text-left mt-3"> <h5 class='cmp-teaser__title lg:text-[32px] text-[26px] leading-9 font-sora font-bold mb-4 text-lg lg:text-2xl text-grey-900 dark:text-white'>Implementation Partners</h5> <div class="cmp-teaser__description font-inter font-normal mb-6"> <span class="text-lg text-grey-700 teaser-richtext check"><p>Our ecosystem of implementation partners help customers deploy faster and customize your search ecommerce experience across industries and use cases.</p> </span> </div> </div> </div> </div></div> </div> <style> .slick-next, .slick-prev{ z-index: 5; color: black; top: 50%; } .slick-next:focus, .slick-prev:focus{ color: black; } .slick-prev{ left: -50px; } .slick-next{ right: -50px; } .slick-dots li button{ background-color: rgb(230, 230, 230); border: 1px solid rgb(190, 190, 190); border-radius: 100%; } .slick-dots li button:before{ content: ''; } .slick-prev:hover, .slick-next:hover{ color: black; background: linear-gradient( 138deg, rgba(187, 209, 255, 0.2) 0%, rgba(118, 160, 255, 0.2) 25.08%, rgba(226, 167, 255, 0.2) 56.38%, rgba(187, 209, 255, 0.2) 100% ) } .slick-next::before{ content: ""; color: black; } .slick-prev::before{ content: ""; color: black; } .slick-arrow{ border-radius: 100%; width: 3rem; height: 3rem; display: flex; justify-content: center; align-items: center; border: 2px solid rgb(214 214 231); } .mx-auto .left-right-image:nth-child(odd) .cmp-teaser{ flex-direction: row-reverse; } .slick .teaser.slick-slide { display: flex; flex-direction: column; align-items: center; } .slick .teaser.slick-slide .cmp-teaser { max-width: 800px; } @media (max-width: 768px) { .slick-prev{ left: 132px; top: -62px; } .slick-next{ left: 188px; top: -62px; } } </style></div> </div> </div> </div><!-- Check if the property is null or empty --> <!-- Check if the property is null or empty --> <div id="" data-tracking="" class="main__container "> <div class=" mx-auto max-w-[1440px] lg:px-14 lg:py-28 px-4 py-8"> <div class="grid grid-cols-12 md:gap-x-16 gap-y-8"> <div class="col-span-12"> <!-- Start Image List Container --> <!-- Check if the property is null or empty --> <div data-tracking="" class="teaser-container mx-auto "> <div class="flex flex-col items-center mb-4"> <div class=" text-center lg:w-[90%] w-full"> <h2 class="font-sora mt-0 mb-4 text-grey-900 dark:text-white text-s34 lg:text-s42 font-bold"> Work with our Salesforce expert partners</h2> </div> </div> <div class=" z-1 grid gap-x-4 gap-y-8 mb-12 lg:mb-16 grid-cols-2 md:grid-cols-5"> <!-- Check if the property is null or empty --> <!-- End here Check if the property is null or empty --> <!-- Start Image List Teaser--> <div class="teaser imageList flex justify-center items-center "> <div class="cmp-teaser flex flex-wrap items-center justify-center flex-col"> <div class="cmp-teaser__image flex items-center justify-center h-12 lg:h-24" > <img style="width:px; height:px;" class="max-w-full object-contain m-auto w-auto h-full aspect-[3/2]" src="/files/live/sites/algolia-assets/files/integrated-salesforce/logo-capgemini.svg" alt=""/> </div> </div> </div> <!-- End Image List Teaser--><!-- Check if the property is null or empty --> <!-- End here Check if the property is null or empty --> <!-- Start Image List Teaser--> <div class="teaser imageList flex justify-center items-center "> <div class="cmp-teaser flex flex-wrap items-center justify-center flex-col"> <div class="cmp-teaser__image flex items-center justify-center h-12 lg:h-24" > <img style="width:px; height:px;" class="max-w-full object-contain m-auto w-auto h-full aspect-[3/2]" src="/files/live/sites/algolia-assets/files/integrated-salesforce/publicis-sapient.svg" alt=""/> </div> </div> </div> <!-- End Image List Teaser--><!-- Check if the property is null or empty --> <!-- End here Check if the property is null or empty --> <!-- Start Image List Teaser--> <div class="teaser imageList flex justify-center items-center "> <div class="cmp-teaser flex flex-wrap items-center justify-center flex-col"> <div class="cmp-teaser__image flex items-center justify-center h-12 lg:h-24" > <img style="width:px; height:px;" class="max-w-full object-contain m-auto w-auto h-full aspect-[3/2]" src="/files/live/sites/algolia-assets/files/integrated-salesforce/zaelab.svg" alt=""/> </div> </div> </div> <!-- End Image List Teaser--><!-- Check if the property is null or empty --> <!-- End here Check if the property is null or empty --> <!-- Start Image List Teaser--> <div class="teaser imageList flex justify-center items-center "> <div class="cmp-teaser flex flex-wrap items-center justify-center flex-col"> <div class="cmp-teaser__image flex items-center justify-center h-12 lg:h-24" > <img style="width:px; height:px;" class="max-w-full object-contain m-auto w-auto h-full aspect-[3/2]" src="/files/live/sites/algolia-assets/files/ip-images/64-labs.webp" alt=""/> </div> </div> </div> <!-- End Image List Teaser--><!-- Check if the property is null or empty --> <!-- End here Check if the property is null or empty --> <!-- Start Image List Teaser--> <div class="teaser imageList flex justify-center items-center "> <div class="cmp-teaser flex flex-wrap items-center justify-center flex-col"> <div class="cmp-teaser__image flex items-center justify-center h-12 lg:h-24" > <img style="width:px; height:px;" class="max-w-full object-contain m-auto w-auto h-full aspect-[3/2]" src="/files/live/sites/algolia-assets/files/integrated-salesforce/epam.webp" alt=""/> </div> </div> </div> <!-- End Image List Teaser--></div> </div> <!-- End Image List Container --> <!-- if edit mode display button to add more images to the carousel --></div> </div> </div> </div><div class=""> <!-- Check if the property is null or empty --> <div data-tracking="" class="mx-auto "> <!-- Check if the property is null or empty --> <!-- End here Check if the property is null or empty --> <div class="cmp-teaser__image w-full h-full relative -mb-px"> <img src="/files/live/sites/algolia-assets/files/header_section_1%20(1)%20(2).svg" class="w-full h-full object-center object-cover absolute z-0 hidden lg:block" alt=""> <img src="/files/live/sites/www/files/Frame_29611123_1.svg" class="w-full h-full object-center object-cover absolute z-0 lg:hidden block" alt=""> <div class="items-center mx-auto max-w-[1440px] flex flex-col lg:flex-row justify-between px-4 lg:px-16 lg:py-[72px] py-[32px] gap-y-6 lg:gap-y-8 top-1/2 w-full"> <h2 class="lg:text-[42px] text-[34px] leading-snug font-sora font-light text-white lg:w-2/4 z-10 text-start">Try the AI search that understands</h2> <div class="cmp-teaser__action-container items-center gap-4 flex flex-row shrink-0 flex-wrap lg:justify-end justify-start lg:my-8 my-0 lg:w-2/4 z-10"> <!-- Check if the property is null or empty --> <!-- End here Check if the property is null or empty --> <div data-tracking="" class="flex font-sora justify-center lg:justify-start"> <div class=" font-sora button last:me-0 inline-flex w-fit group"> <a href="/demorequest" data-finalurl="/cms/render/live/en/sites/www/home/demorequest.html" data-locale="en" data-is-internal="true" target="_self" class=" ctaGradient cmp-button overflow-hidden flex flex-wrap items-center justify-center lg:justify-start cursor-pointer font-sora w-full white-cta white cta-bg-white px-4 lg:px-6 bg-white hover:text-grey-700 text-grey-900 shadow-md border-2 border-white rounded-lg min-h-12 lg:min-h-14 " style="--x: 0px; --y: 0px;"> <span class="cmp-button__text font-semibold mx-auto font-sora leading-1.5 text-sm lg:text-base tracking-[0.28px] lg:tracking-[0.32px]"> Get a demo</span> </a> </div> </div> <!-- Check if the property is null or empty --> <!-- End here Check if the property is null or empty --> <div data-tracking="" class="flex font-sora justify-center lg:justify-end"> <div class=" font-sora button last:me-0 inline-flex w-fit group"> <a href="https://www.algolia.com/users/sign_up" data-finalurl="https://www.algolia.com/users/sign_up" data-locale="en" data-is-internal="true" target="_self" class=" ctaGradient cmp-button overflow-hidden flex flex-wrap items-center justify-center lg:justify-end cursor-pointer font-sora w-full noBackGround-cta transparent dark:text-white text-grey-900 px-4 lg:px-6 bg-transparent shadow-[0_0_6px_2px_rgba(0,61,255,0.12)] border-2 dark:border-white border-grey-200 rounded-lg min-h-12 lg:min-h-14 text-white" style="--x: 0px; --y: 0px;"> <span class="cmp-button__text font-semibold mx-auto font-sora leading-1.5 text-sm lg:text-base tracking-[0.28px] lg:tracking-[0.32px]"> Start free</span> </a> </div> </div> </div> </div> </div></div></div> <!-- Over Ride Footer Logic is written in footer-logic--> <footer data-tracking="" class="bg-xenon-900"> <div class="footer_items m-auto grid max-w-[1440px] grid-cols-2 gap-x-2 lg:px-14 px-4 lg:gap-x-8 pb-6 lg:pb-14 pt-8 lg:pt-18 lg:grid-cols-10"> <div class="hidden lg:block lg:col-start-1 lg:col-end-3"> <div class=""> <h4 class="font-inter font-normal leading-normal text-base lg:text-lg text-grey-400 mt-0 mb-2 lg:mb-4"> Solutions</h4> <ul class="m-0 list-none p-0"> <a data-tracking="" data-is-internal="true" class=" block text-left font-inter font-normal leading-normal text-xs lg:text-sm text-white no-underline transition-colors duration-200 hover:text-xenon-400 py-2" href="/products" data-finalurl="/cms/render/live/en/sites/www/home/products.html" target="_self">Overview</a><a data-tracking="" data-is-internal="true" class=" block text-left font-inter font-normal leading-normal text-xs lg:text-sm text-white no-underline transition-colors duration-200 hover:text-xenon-400 py-2" href="/products/ai-search" data-finalurl="/cms/render/live/en/sites/www/home/products/ai-search.html" target="_self">AI Search</a><a data-tracking="" data-is-internal="true" class=" block text-left font-inter font-normal leading-normal text-xs lg:text-sm text-white no-underline transition-colors duration-200 hover:text-xenon-400 py-2" href="/products/ai-browse" data-finalurl="/cms/render/live/en/sites/www/home/products/ai-browse.html" target="_self">AI Browse</a><a data-tracking="" data-is-internal="true" class=" block text-left font-inter font-normal leading-normal text-xs lg:text-sm text-white no-underline transition-colors duration-200 hover:text-xenon-400 py-2" href="/products/ai-recommendations" data-finalurl="/cms/render/live/en/sites/www/home/products/ai-recommendations.html" target="_self">AI Recommendations</a><a data-tracking="" data-is-internal="true" class=" block text-left font-inter font-normal leading-normal text-xs lg:text-sm text-white no-underline transition-colors duration-200 hover:text-xenon-400 py-2" href="/pricing" data-finalurl="/cms/render/live/en/sites/www/home/pricing.html" target="_self">Pricing</a></ul></div> <div class="mt-10"> <h4 class="font-inter font-normal leading-normal text-base lg:text-lg text-grey-400 mt-0 mb-2 lg:mb-4"> Use cases</h4> <ul class="m-0 list-none p-0"> <a data-tracking="" data-is-internal="true" class=" block text-left font-inter font-normal leading-normal text-xs lg:text-sm text-white no-underline transition-colors duration-200 hover:text-xenon-400 py-2" href="/use-cases" data-finalurl="/cms/render/live/en/sites/www/home/use-cases.html" target="_self">Overview</a><a data-tracking="" data-is-internal="true" class=" block text-left font-inter font-normal leading-normal text-xs lg:text-sm text-white no-underline transition-colors duration-200 hover:text-xenon-400 py-2" href="/use-cases/enterprise" data-finalurl="/cms/render/live/en/sites/www/home/use-cases/enterprise.html" target="_self">Enterprise search</a><a data-tracking="" data-is-internal="true" class=" block text-left font-inter font-normal leading-normal text-xs lg:text-sm text-white no-underline transition-colors duration-200 hover:text-xenon-400 py-2" href="/use-cases/headless-commerce" data-finalurl="/cms/render/live/en/sites/www/home/use-cases/headless-commerce.html" target="_self">Headless commerce</a><a data-tracking="" data-is-internal="true" class=" block text-left font-inter font-normal leading-normal text-xs lg:text-sm text-white no-underline transition-colors duration-200 hover:text-xenon-400 py-2" href="/use-cases/mobile-search" data-finalurl="/cms/render/live/en/sites/www/home/use-cases/mobile-search.html" target="_self">Mobile & app search</a><a data-tracking="" data-is-internal="true" class=" block text-left font-inter font-normal leading-normal text-xs lg:text-sm text-white no-underline transition-colors duration-200 hover:text-xenon-400 py-2" href="/use-cases/voice-search" data-finalurl="/cms/render/live/en/sites/www/home/use-cases/voice-search.html" target="_self">Voice search</a><a data-tracking="" data-is-internal="true" class=" block text-left font-inter font-normal leading-normal text-xs lg:text-sm text-white no-underline transition-colors duration-200 hover:text-xenon-400 py-2" href="/use-cases/image-search" data-finalurl="/cms/render/live/en/sites/www/home/use-cases/image-search.html" target="_self">Image search</a></ul></div></div> <div class="hidden lg:block lg:col-start-3 lg:col-end-5"> <div class=""> <h4 class="font-inter font-normal leading-normal text-base lg:text-lg text-grey-400 mt-0 mb-2 lg:mb-4"> Developers</h4> <ul class="m-0 list-none p-0"> <a data-tracking="" data-is-internal="true" class=" block text-left font-inter font-normal leading-normal text-xs lg:text-sm text-white no-underline transition-colors duration-200 hover:text-xenon-400 py-2" href="/developers" data-finalurl="/cms/render/live/en/sites/www/home/developers.html" target="_self">Developer Hub</a><a data-tracking="" data-is-internal="true" class=" block text-left font-inter font-normal leading-normal text-xs lg:text-sm text-white no-underline transition-colors duration-200 hover:text-xenon-400 py-2" href="https://www.algolia.com/doc/" data-finalurl="https://www.algolia.com/doc/" target="_self">Documentation</a><a data-tracking="" data-is-internal="true" class=" block text-left font-inter font-normal leading-normal text-xs lg:text-sm text-white no-underline transition-colors duration-200 hover:text-xenon-400 py-2" href="/developers/integrations" data-finalurl="/cms/render/live/en/sites/www/home/developers/integrations.html" target="_self">Integrations</a><a data-tracking="" data-is-internal="true" class=" block text-left font-inter font-normal leading-normal text-xs lg:text-sm text-white no-underline transition-colors duration-200 hover:text-xenon-400 py-2" href="/blog/engineering" data-finalurl="/cms/render/live/en/sites/www/home/blog/engineering.html" target="_self">Engineering blog</a><a data-tracking="" data-is-internal="true" class=" block text-left font-inter font-normal leading-normal text-xs lg:text-sm text-white no-underline transition-colors duration-200 hover:text-xenon-400 py-2" href="https://alg.li/discord" data-finalurl="https://alg.li/discord" target="_self">Discord community</a><a data-tracking="" data-is-internal="true" class=" block text-left font-inter font-normal leading-normal text-xs lg:text-sm text-white no-underline transition-colors duration-200 hover:text-xenon-400 py-2" href="https://status.algolia.com/" data-finalurl="https://status.algolia.com/" target="_self">API status</a><a data-tracking="" data-is-internal="true" class=" block text-left font-inter font-normal leading-normal text-xs lg:text-sm text-white no-underline transition-colors duration-200 hover:text-xenon-400 py-2" href="https://docsearch.algolia.com/" data-finalurl="https://docsearch.algolia.com/" target="_self">DocSearch</a><a data-tracking="" data-is-internal="true" class=" block text-left font-inter font-normal leading-normal text-xs lg:text-sm text-white no-underline transition-colors duration-200 hover:text-xenon-400 py-2" href="/for-open-source" data-finalurl="/cms/render/live/en/sites/www/home/for-open-source.html" target="_self">For Open Source</a></ul></div> <div class="mt-10"> <h4 class="font-inter font-normal leading-normal text-base lg:text-lg text-grey-400 mt-0 mb-2 lg:mb-4"> Live demos</h4> <ul class="m-0 list-none p-0"> <a data-tracking="" data-is-internal="true" class=" block text-left font-inter font-normal leading-normal text-xs lg:text-sm text-white no-underline transition-colors duration-200 hover:text-xenon-400 py-2" href="https://gdpr.algolia.com/" data-finalurl="https://gdpr.algolia.com/" target="_self">GDPR</a><a data-tracking="" data-is-internal="true" class=" block text-left font-inter font-normal leading-normal text-xs lg:text-sm text-white no-underline transition-colors duration-200 hover:text-xenon-400 py-2" href="https://aiact.algolia.com/" data-finalurl="https://aiact.algolia.com/" target="_self">AI Act</a></ul></div></div> <div class="hidden lg:block lg:col-start-5 lg:col-end-7"> <div class=""> <h4 class="font-inter font-normal leading-normal text-base lg:text-lg text-grey-400 mt-0 mb-2 lg:mb-4"> Integrations</h4> <ul class="m-0 list-none p-0"> <a data-tracking="" data-is-internal="true" class=" block text-left font-inter font-normal leading-normal text-xs lg:text-sm text-white no-underline transition-colors duration-200 hover:text-xenon-400 py-2" href="/search-solutions/salesforce-commerce-cloud" data-finalurl="/cms/render/live/en/sites/www/home/search-solutions/salesforce-commerce-cloud.html" target="_self">Salesforce Commerce Cloud B2C</a><a data-tracking="" data-is-internal="true" class=" block text-left font-inter font-normal leading-normal text-xs lg:text-sm text-white no-underline transition-colors duration-200 hover:text-xenon-400 py-2" href="/search-solutions/shopify" data-finalurl="/cms/render/live/en/sites/www/home/search-solutions/shopify.html" target="_self">Shopify</a><a data-tracking="" data-is-internal="true" class=" block text-left font-inter font-normal leading-normal text-xs lg:text-sm text-white no-underline transition-colors duration-200 hover:text-xenon-400 py-2" href="/search-solutions/adobe-commerce-magento" data-finalurl="/cms/render/live/en/sites/www/home/search-solutions/adobe-commerce-magento.html" target="_self">Adobe Commerce</a><a data-tracking="" data-is-internal="true" class=" block text-left font-inter font-normal leading-normal text-xs lg:text-sm text-white no-underline transition-colors duration-200 hover:text-xenon-400 py-2" href="/search-solutions/netlify" data-finalurl="/cms/render/live/en/sites/www/home/search-solutions/netlify.html" target="_self">Netlify</a><a data-tracking="" data-is-internal="true" class=" block text-left font-inter font-normal leading-normal text-xs lg:text-sm text-white no-underline transition-colors duration-200 hover:text-xenon-400 py-2" href="/search-solutions/commercetools" data-finalurl="/cms/render/live/en/sites/www/home/search-solutions/commercetools.html" target="_self">Commercetools</a><a data-tracking="" data-is-internal="true" class=" block text-left font-inter font-normal leading-normal text-xs lg:text-sm text-white no-underline transition-colors duration-200 hover:text-xenon-400 py-2" href="/search-solutions/bigcommerce" data-finalurl="/cms/render/live/en/sites/www/home/search-solutions/bigcommerce.html" target="_self">BigCommerce</a></ul></div> <div class="mt-10"> <h4 class="font-inter font-normal leading-normal text-base lg:text-lg text-grey-400 mt-0 mb-2 lg:mb-4"> Distributed & secure</h4> <ul class="m-0 list-none p-0"> <a data-tracking="" data-is-internal="true" class=" block text-left font-inter font-normal leading-normal text-xs lg:text-sm text-white no-underline transition-colors duration-200 hover:text-xenon-400 py-2" href="/distributed-secure/global-infrastructure" data-finalurl="/cms/render/live/en/sites/www/home/distributed-secure/global-infrastructure.html" target="_self">Global infrastructure</a><a data-tracking="" data-is-internal="true" class=" block text-left font-inter font-normal leading-normal text-xs lg:text-sm text-white no-underline transition-colors duration-200 hover:text-xenon-400 py-2" href="/distributed-secure/security-compliance" data-finalurl="/cms/render/live/en/sites/www/home/distributed-secure/security-compliance.html" target="_self">Security & compliance</a><a data-tracking="" data-is-internal="true" class=" block text-left font-inter font-normal leading-normal text-xs lg:text-sm text-white no-underline transition-colors duration-200 hover:text-xenon-400 py-2" href="/search-solutions/algolia-on-azure" data-finalurl="/cms/render/live/en/sites/www/home/search-solutions/algolia-on-azure.html" target="_self">Azure</a><a data-tracking="" data-is-internal="true" class=" block text-left font-inter font-normal leading-normal text-xs lg:text-sm text-white no-underline transition-colors duration-200 hover:text-xenon-400 py-2" href="/search-solutions/algolia-on-aws" data-finalurl="/cms/render/live/en/sites/www/home/search-solutions/algolia-on-aws.html" target="_self">AWS</a></ul></div></div> <div class="hidden lg:block lg:col-start-7 lg:col-end-9"> <div class=""> <h4 class="font-inter font-normal leading-normal text-base lg:text-lg text-grey-400 mt-0 mb-2 lg:mb-4"> Industries</h4> <ul class="m-0 list-none p-0"> <a data-tracking="" data-is-internal="true" class=" block text-left font-inter font-normal leading-normal text-xs lg:text-sm text-white no-underline transition-colors duration-200 hover:text-xenon-400 py-2" href="/industries" data-finalurl="/cms/render/live/en/sites/www/home/industries.html" target="_self">Overview</a><a data-tracking="" data-is-internal="true" class=" block text-left font-inter font-normal leading-normal text-xs lg:text-sm text-white no-underline transition-colors duration-200 hover:text-xenon-400 py-2" href="/industries/ecommerce" data-finalurl="/cms/render/live/en/sites/www/home/industries/ecommerce.html" target="_self">B2C ecommerce</a><a data-tracking="" data-is-internal="true" class=" block text-left font-inter font-normal leading-normal text-xs lg:text-sm text-white no-underline transition-colors duration-200 hover:text-xenon-400 py-2" href="/industries/b2b-ecommerce" data-finalurl="/cms/render/live/en/sites/www/home/industries/b2b-ecommerce.html" target="_self">B2B ecommerce</a><a data-tracking="" data-is-internal="true" class=" block text-left font-inter font-normal leading-normal text-xs lg:text-sm text-white no-underline transition-colors duration-200 hover:text-xenon-400 py-2" href="/industries/marketplaces" data-finalurl="/cms/render/live/en/sites/www/home/industries/marketplaces.html" target="_self">Marketplaces</a><a data-tracking="" data-is-internal="true" class=" block text-left font-inter font-normal leading-normal text-xs lg:text-sm text-white no-underline transition-colors duration-200 hover:text-xenon-400 py-2" href="/industries/saas" data-finalurl="/cms/render/live/en/sites/www/home/industries/saas.html" target="_self">SaaS</a><a data-tracking="" data-is-internal="true" class=" block text-left font-inter font-normal leading-normal text-xs lg:text-sm text-white no-underline transition-colors duration-200 hover:text-xenon-400 py-2" href="/industries/media" data-finalurl="/cms/render/live/en/sites/www/home/industries/media.html" target="_self">Media</a><a data-tracking="" data-is-internal="true" class=" block text-left font-inter font-normal leading-normal text-xs lg:text-sm text-white no-underline transition-colors duration-200 hover:text-xenon-400 py-2" href="/industries/startups" data-finalurl="/cms/render/live/en/sites/www/home/industries/startups.html" target="_self">Startups</a></ul></div></div> <div class="hidden lg:block lg:col-start-9 lg:col-end-11"> <div class=""> <h4 class="font-inter font-normal leading-normal text-base lg:text-lg text-grey-400 mt-0 mb-2 lg:mb-4"> Company</h4> <ul class="m-0 list-none p-0"> <a data-tracking="" data-is-internal="true" class=" block text-left font-inter font-normal leading-normal text-xs lg:text-sm text-white no-underline transition-colors duration-200 hover:text-xenon-400 py-2" href="/about" data-finalurl="/cms/render/live/en/sites/www/home/about.html" target="_self">About Algolia</a><a data-tracking="" data-is-internal="true" class=" block text-left font-inter font-normal leading-normal text-xs lg:text-sm text-white no-underline transition-colors duration-200 hover:text-xenon-400 py-2" href="" data-finalurl="" target="_self">Careers</a><a data-tracking="" data-is-internal="true" class=" block text-left font-inter font-normal leading-normal text-xs lg:text-sm text-white no-underline transition-colors duration-200 hover:text-xenon-400 py-2" href="/about/news" data-finalurl="/cms/render/live/en/sites/www/home/about/news.html" target="_self">Newsroom</a><a data-tracking="" data-is-internal="true" class=" block text-left font-inter font-normal leading-normal text-xs lg:text-sm text-white no-underline transition-colors duration-200 hover:text-xenon-400 py-2" href="/events" data-finalurl="/cms/render/live/en/sites/www/home/events.html" target="_self">Events</a><a data-tracking="" data-is-internal="true" class=" block text-left font-inter font-normal leading-normal text-xs lg:text-sm text-white no-underline transition-colors duration-200 hover:text-xenon-400 py-2" href="/about/leadership" data-finalurl="/cms/render/live/en/sites/www/home/about/leadership.html" target="_self">Leadership</a><a data-tracking="" data-is-internal="true" class=" block text-left font-inter font-normal leading-normal text-xs lg:text-sm text-white no-underline transition-colors duration-200 hover:text-xenon-400 py-2" href="/about/social-impact" data-finalurl="/cms/render/live/en/sites/www/home/about/social-impact.html" target="_self">Social impact</a><a data-tracking="" data-is-internal="true" class=" block text-left font-inter font-normal leading-normal text-xs lg:text-sm text-white no-underline transition-colors duration-200 hover:text-xenon-400 py-2" href="/contact" data-finalurl="/cms/render/live/en/sites/www/home/contact.html" target="_self">Contact us</a></ul></div> <div class="mt-10"> <h4 class="font-inter font-normal leading-normal text-base lg:text-lg text-grey-400 mt-0 mb-2 lg:mb-4"> Social networks</h4> <!-- We need to configure site level Social Icon here --> <ul class="social-links font-inter font-normal leading-normal text-sm items-center text-grey-900 m-0 flex list-none p-0 gap-0 lg:gap-2"> <li class="first:ml-0 ms-3"><a href="https://twitter.com/algolia" title="Twitter"> <i class="twitter-icon"></i></a> </li> <li class="first:ml-0 ms-3"><a href="https://www.facebook.com/algolia/" title="FaceBook"> <i class="fa-icon"></i></a> </li> <li class="first:ml-0 ms-3"><a href="https://www.linkedin.com/company/algolia/" title="LinkedIn"> <i class="linkedin-icon"></i></a> </li> <li class="first:ml-0 ms-3"><a href="https://www.youtube.com/user/Algolia" title="YouTube"> <i class="youtube-icon"></i></a> </li> <li class="first:ml-0 ms-3"><a href="https://www.instagram.com/algolialife" title="Instagram"> <i class="instagram-icon"></i></a> </li> </ul></div></div> <div class="lg:hidden"> <div class="lg:mt-0 mt-8"> <h4 class="font-inter font-normal leading-normal text-base lg:text-lg text-grey-400 mt-0 mb-2 lg:mb-4"> Developers</h4> <ul class="m-0 list-none p-0"> <a data-tracking="" data-is-internal="true" class=" block text-left font-inter font-normal leading-normal text-xs lg:text-sm text-white no-underline transition-colors duration-200 hover:text-xenon-400 py-2" href="/developers" data-finalurl="/cms/render/live/en/sites/www/home/developers.html" target="_self">Developer Hub</a><a data-tracking="" data-is-internal="true" class=" block text-left font-inter font-normal leading-normal text-xs lg:text-sm text-white no-underline transition-colors duration-200 hover:text-xenon-400 py-2" href="https://www.algolia.com/doc/" data-finalurl="https://www.algolia.com/doc/" target="_self">Documentation</a><a data-tracking="" data-is-internal="true" class=" block text-left font-inter font-normal leading-normal text-xs lg:text-sm text-white no-underline transition-colors duration-200 hover:text-xenon-400 py-2" href="/developers/integrations" data-finalurl="/cms/render/live/en/sites/www/home/developers/integrations.html" target="_self">Integrations</a><a data-tracking="" data-is-internal="true" class=" block text-left font-inter font-normal leading-normal text-xs lg:text-sm text-white no-underline transition-colors duration-200 hover:text-xenon-400 py-2" href="/blog/engineering" data-finalurl="/cms/render/live/en/sites/www/home/blog/engineering.html" target="_self">Engineering blog</a><a data-tracking="" data-is-internal="true" class=" block text-left font-inter font-normal leading-normal text-xs lg:text-sm text-white no-underline transition-colors duration-200 hover:text-xenon-400 py-2" href="https://alg.li/discord" data-finalurl="https://alg.li/discord" target="_self">Discord community</a><a data-tracking="" data-is-internal="true" class=" block text-left font-inter font-normal leading-normal text-xs lg:text-sm text-white no-underline transition-colors duration-200 hover:text-xenon-400 py-2" href="https://status.algolia.com/" data-finalurl="https://status.algolia.com/" target="_self">API status</a><a data-tracking="" data-is-internal="true" class=" block text-left font-inter font-normal leading-normal text-xs lg:text-sm text-white no-underline transition-colors duration-200 hover:text-xenon-400 py-2" href="https://docsearch.algolia.com/" data-finalurl="https://docsearch.algolia.com/" target="_self">DocSearch</a><a data-tracking="" data-is-internal="true" class=" block text-left font-inter font-normal leading-normal text-xs lg:text-sm text-white no-underline transition-colors duration-200 hover:text-xenon-400 py-2" href="/for-open-source" data-finalurl="/cms/render/live/en/sites/www/home/for-open-source.html" target="_self">For Open Source</a></ul></div> <div class="mt-8"> <h4 class="font-inter font-normal leading-normal text-base lg:text-lg text-grey-400 mt-0 mb-2 lg:mb-4"> Live demos</h4> <ul class="m-0 list-none p-0"> <a data-tracking="" data-is-internal="true" class=" block text-left font-inter font-normal leading-normal text-xs lg:text-sm text-white no-underline transition-colors duration-200 hover:text-xenon-400 py-2" href="https://gdpr.algolia.com/" data-finalurl="https://gdpr.algolia.com/" target="_self">GDPR</a><a data-tracking="" data-is-internal="true" class=" block text-left font-inter font-normal leading-normal text-xs lg:text-sm text-white no-underline transition-colors duration-200 hover:text-xenon-400 py-2" href="https://aiact.algolia.com/" data-finalurl="https://aiact.algolia.com/" target="_self">AI Act</a></ul></div><div class="lg:mt-0 mt-8"> <h4 class="font-inter font-normal leading-normal text-base lg:text-lg text-grey-400 mt-0 mb-2 lg:mb-4"> Industries</h4> <ul class="m-0 list-none p-0"> <a data-tracking="" data-is-internal="true" class=" block text-left font-inter font-normal leading-normal text-xs lg:text-sm text-white no-underline transition-colors duration-200 hover:text-xenon-400 py-2" href="/industries" data-finalurl="/cms/render/live/en/sites/www/home/industries.html" target="_self">Overview</a><a data-tracking="" data-is-internal="true" class=" block text-left font-inter font-normal leading-normal text-xs lg:text-sm text-white no-underline transition-colors duration-200 hover:text-xenon-400 py-2" href="/industries/ecommerce" data-finalurl="/cms/render/live/en/sites/www/home/industries/ecommerce.html" target="_self">B2C ecommerce</a><a data-tracking="" data-is-internal="true" class=" block text-left font-inter font-normal leading-normal text-xs lg:text-sm text-white no-underline transition-colors duration-200 hover:text-xenon-400 py-2" href="/industries/b2b-ecommerce" data-finalurl="/cms/render/live/en/sites/www/home/industries/b2b-ecommerce.html" target="_self">B2B ecommerce</a><a data-tracking="" data-is-internal="true" class=" block text-left font-inter font-normal leading-normal text-xs lg:text-sm text-white no-underline transition-colors duration-200 hover:text-xenon-400 py-2" href="/industries/marketplaces" data-finalurl="/cms/render/live/en/sites/www/home/industries/marketplaces.html" target="_self">Marketplaces</a><a data-tracking="" data-is-internal="true" class=" block text-left font-inter font-normal leading-normal text-xs lg:text-sm text-white no-underline transition-colors duration-200 hover:text-xenon-400 py-2" href="/industries/saas" data-finalurl="/cms/render/live/en/sites/www/home/industries/saas.html" target="_self">SaaS</a><a data-tracking="" data-is-internal="true" class=" block text-left font-inter font-normal leading-normal text-xs lg:text-sm text-white no-underline transition-colors duration-200 hover:text-xenon-400 py-2" href="/industries/media" data-finalurl="/cms/render/live/en/sites/www/home/industries/media.html" target="_self">Media</a><a data-tracking="" data-is-internal="true" class=" block text-left font-inter font-normal leading-normal text-xs lg:text-sm text-white no-underline transition-colors duration-200 hover:text-xenon-400 py-2" href="/industries/startups" data-finalurl="/cms/render/live/en/sites/www/home/industries/startups.html" target="_self">Startups</a></ul></div></div> <div class="lg:hidden"> <div class="lg:mt-0 mt-8"> <h4 class="font-inter font-normal leading-normal text-base lg:text-lg text-grey-400 mt-0 mb-2 lg:mb-4"> Solutions</h4> <ul class="m-0 list-none p-0"> <a data-tracking="" data-is-internal="true" class=" block text-left font-inter font-normal leading-normal text-xs lg:text-sm text-white no-underline transition-colors duration-200 hover:text-xenon-400 py-2" href="/products" data-finalurl="/cms/render/live/en/sites/www/home/products.html" target="_self">Overview</a><a data-tracking="" data-is-internal="true" class=" block text-left font-inter font-normal leading-normal text-xs lg:text-sm text-white no-underline transition-colors duration-200 hover:text-xenon-400 py-2" href="/products/ai-search" data-finalurl="/cms/render/live/en/sites/www/home/products/ai-search.html" target="_self">AI Search</a><a data-tracking="" data-is-internal="true" class=" block text-left font-inter font-normal leading-normal text-xs lg:text-sm text-white no-underline transition-colors duration-200 hover:text-xenon-400 py-2" href="/products/ai-browse" data-finalurl="/cms/render/live/en/sites/www/home/products/ai-browse.html" target="_self">AI Browse</a><a data-tracking="" data-is-internal="true" class=" block text-left font-inter font-normal leading-normal text-xs lg:text-sm text-white no-underline transition-colors duration-200 hover:text-xenon-400 py-2" href="/products/ai-recommendations" data-finalurl="/cms/render/live/en/sites/www/home/products/ai-recommendations.html" target="_self">AI Recommendations</a><a data-tracking="" data-is-internal="true" class=" block text-left font-inter font-normal leading-normal text-xs lg:text-sm text-white no-underline transition-colors duration-200 hover:text-xenon-400 py-2" href="/pricing" data-finalurl="/cms/render/live/en/sites/www/home/pricing.html" target="_self">Pricing</a></ul></div> <div class="mt-8"> <h4 class="font-inter font-normal leading-normal text-base lg:text-lg text-grey-400 mt-0 mb-2 lg:mb-4"> Use cases</h4> <ul class="m-0 list-none p-0"> <a data-tracking="" data-is-internal="true" class=" block text-left font-inter font-normal leading-normal text-xs lg:text-sm text-white no-underline transition-colors duration-200 hover:text-xenon-400 py-2" href="/use-cases" data-finalurl="/cms/render/live/en/sites/www/home/use-cases.html" target="_self">Overview</a><a data-tracking="" data-is-internal="true" class=" block text-left font-inter font-normal leading-normal text-xs lg:text-sm text-white no-underline transition-colors duration-200 hover:text-xenon-400 py-2" href="/use-cases/enterprise" data-finalurl="/cms/render/live/en/sites/www/home/use-cases/enterprise.html" target="_self">Enterprise search</a><a data-tracking="" data-is-internal="true" class=" block text-left font-inter font-normal leading-normal text-xs lg:text-sm text-white no-underline transition-colors duration-200 hover:text-xenon-400 py-2" href="/use-cases/headless-commerce" data-finalurl="/cms/render/live/en/sites/www/home/use-cases/headless-commerce.html" target="_self">Headless commerce</a><a data-tracking="" data-is-internal="true" class=" block text-left font-inter font-normal leading-normal text-xs lg:text-sm text-white no-underline transition-colors duration-200 hover:text-xenon-400 py-2" href="/use-cases/mobile-search" data-finalurl="/cms/render/live/en/sites/www/home/use-cases/mobile-search.html" target="_self">Mobile & app search</a><a data-tracking="" data-is-internal="true" class=" block text-left font-inter font-normal leading-normal text-xs lg:text-sm text-white no-underline transition-colors duration-200 hover:text-xenon-400 py-2" href="/use-cases/voice-search" data-finalurl="/cms/render/live/en/sites/www/home/use-cases/voice-search.html" target="_self">Voice search</a><a data-tracking="" data-is-internal="true" class=" block text-left font-inter font-normal leading-normal text-xs lg:text-sm text-white no-underline transition-colors duration-200 hover:text-xenon-400 py-2" href="/use-cases/image-search" data-finalurl="/cms/render/live/en/sites/www/home/use-cases/image-search.html" target="_self">Image search</a></ul></div><div class="lg:mt-0 mt-8"> <h4 class="font-inter font-normal leading-normal text-base lg:text-lg text-grey-400 mt-0 mb-2 lg:mb-4"> Integrations</h4> <ul class="m-0 list-none p-0"> <a data-tracking="" data-is-internal="true" class=" block text-left font-inter font-normal leading-normal text-xs lg:text-sm text-white no-underline transition-colors duration-200 hover:text-xenon-400 py-2" href="/search-solutions/salesforce-commerce-cloud" data-finalurl="/cms/render/live/en/sites/www/home/search-solutions/salesforce-commerce-cloud.html" target="_self">Salesforce Commerce Cloud B2C</a><a data-tracking="" data-is-internal="true" class=" block text-left font-inter font-normal leading-normal text-xs lg:text-sm text-white no-underline transition-colors duration-200 hover:text-xenon-400 py-2" href="/search-solutions/shopify" data-finalurl="/cms/render/live/en/sites/www/home/search-solutions/shopify.html" target="_self">Shopify</a><a data-tracking="" data-is-internal="true" class=" block text-left font-inter font-normal leading-normal text-xs lg:text-sm text-white no-underline transition-colors duration-200 hover:text-xenon-400 py-2" href="/search-solutions/adobe-commerce-magento" data-finalurl="/cms/render/live/en/sites/www/home/search-solutions/adobe-commerce-magento.html" target="_self">Adobe Commerce</a><a data-tracking="" data-is-internal="true" class=" block text-left font-inter font-normal leading-normal text-xs lg:text-sm text-white no-underline transition-colors duration-200 hover:text-xenon-400 py-2" href="/search-solutions/netlify" data-finalurl="/cms/render/live/en/sites/www/home/search-solutions/netlify.html" target="_self">Netlify</a><a data-tracking="" data-is-internal="true" class=" block text-left font-inter font-normal leading-normal text-xs lg:text-sm text-white no-underline transition-colors duration-200 hover:text-xenon-400 py-2" href="/search-solutions/commercetools" data-finalurl="/cms/render/live/en/sites/www/home/search-solutions/commercetools.html" target="_self">Commercetools</a><a data-tracking="" data-is-internal="true" class=" block text-left font-inter font-normal leading-normal text-xs lg:text-sm text-white no-underline transition-colors duration-200 hover:text-xenon-400 py-2" href="/search-solutions/bigcommerce" data-finalurl="/cms/render/live/en/sites/www/home/search-solutions/bigcommerce.html" target="_self">BigCommerce</a></ul></div> <div class="mt-8"> <h4 class="font-inter font-normal leading-normal text-base lg:text-lg text-grey-400 mt-0 mb-2 lg:mb-4"> Distributed & secure</h4> <ul class="m-0 list-none p-0"> <a data-tracking="" data-is-internal="true" class=" block text-left font-inter font-normal leading-normal text-xs lg:text-sm text-white no-underline transition-colors duration-200 hover:text-xenon-400 py-2" href="/distributed-secure/global-infrastructure" data-finalurl="/cms/render/live/en/sites/www/home/distributed-secure/global-infrastructure.html" target="_self">Global infrastructure</a><a data-tracking="" data-is-internal="true" class=" block text-left font-inter font-normal leading-normal text-xs lg:text-sm text-white no-underline transition-colors duration-200 hover:text-xenon-400 py-2" href="/distributed-secure/security-compliance" data-finalurl="/cms/render/live/en/sites/www/home/distributed-secure/security-compliance.html" target="_self">Security & compliance</a><a data-tracking="" data-is-internal="true" class=" block text-left font-inter font-normal leading-normal text-xs lg:text-sm text-white no-underline transition-colors duration-200 hover:text-xenon-400 py-2" href="/search-solutions/algolia-on-azure" data-finalurl="/cms/render/live/en/sites/www/home/search-solutions/algolia-on-azure.html" target="_self">Azure</a><a data-tracking="" data-is-internal="true" class=" block text-left font-inter font-normal leading-normal text-xs lg:text-sm text-white no-underline transition-colors duration-200 hover:text-xenon-400 py-2" href="/search-solutions/algolia-on-aws" data-finalurl="/cms/render/live/en/sites/www/home/search-solutions/algolia-on-aws.html" target="_self">AWS</a></ul></div><div class="lg:mt-0 mt-8"> <h4 class="font-inter font-normal leading-normal text-base lg:text-lg text-grey-400 mt-0 mb-2 lg:mb-4"> Company</h4> <ul class="m-0 list-none p-0"> <a data-tracking="" data-is-internal="true" class=" block text-left font-inter font-normal leading-normal text-xs lg:text-sm text-white no-underline transition-colors duration-200 hover:text-xenon-400 py-2" href="/about" data-finalurl="/cms/render/live/en/sites/www/home/about.html" target="_self">About Algolia</a><a data-tracking="" data-is-internal="true" class=" block text-left font-inter font-normal leading-normal text-xs lg:text-sm text-white no-underline transition-colors duration-200 hover:text-xenon-400 py-2" href="" data-finalurl="" target="_self">Careers</a><a data-tracking="" data-is-internal="true" class=" block text-left font-inter font-normal leading-normal text-xs lg:text-sm text-white no-underline transition-colors duration-200 hover:text-xenon-400 py-2" href="/about/news" data-finalurl="/cms/render/live/en/sites/www/home/about/news.html" target="_self">Newsroom</a><a data-tracking="" data-is-internal="true" class=" block text-left font-inter font-normal leading-normal text-xs lg:text-sm text-white no-underline transition-colors duration-200 hover:text-xenon-400 py-2" href="/events" data-finalurl="/cms/render/live/en/sites/www/home/events.html" target="_self">Events</a><a data-tracking="" data-is-internal="true" class=" block text-left font-inter font-normal leading-normal text-xs lg:text-sm text-white no-underline transition-colors duration-200 hover:text-xenon-400 py-2" href="/about/leadership" data-finalurl="/cms/render/live/en/sites/www/home/about/leadership.html" target="_self">Leadership</a><a data-tracking="" data-is-internal="true" class=" block text-left font-inter font-normal leading-normal text-xs lg:text-sm text-white no-underline transition-colors duration-200 hover:text-xenon-400 py-2" href="/about/social-impact" data-finalurl="/cms/render/live/en/sites/www/home/about/social-impact.html" target="_self">Social impact</a><a data-tracking="" data-is-internal="true" class=" block text-left font-inter font-normal leading-normal text-xs lg:text-sm text-white no-underline transition-colors duration-200 hover:text-xenon-400 py-2" href="/contact" data-finalurl="/cms/render/live/en/sites/www/home/contact.html" target="_self">Contact us</a></ul></div> <div class="mt-8"> <h4 class="font-inter font-normal leading-normal text-base lg:text-lg text-grey-400 mt-0 mb-2 lg:mb-4"> Social networks</h4> <!-- We need to configure site level Social Icon here --> <ul class="social-links font-inter font-normal leading-normal text-sm items-center text-grey-900 m-0 flex list-none p-0 gap-0 lg:gap-2"> <li class="first:ml-0 ms-3"><a href="https://twitter.com/algolia" title="Twitter"> <i class="twitter-icon"></i></a> </li> <li class="first:ml-0 ms-3"><a href="https://www.facebook.com/algolia/" title="FaceBook"> <i class="fa-icon"></i></a> </li> <li class="first:ml-0 ms-3"><a href="https://www.linkedin.com/company/algolia/" title="LinkedIn"> <i class="linkedin-icon"></i></a> </li> <li class="first:ml-0 ms-3"><a href="https://www.youtube.com/user/Algolia" title="YouTube"> <i class="youtube-icon"></i></a> </li> <li class="first:ml-0 ms-3"><a href="https://www.instagram.com/algolialife" title="Instagram"> <i class="instagram-icon"></i></a> </li> </ul></div></div> </div> <div class="m-auto max-w-[1440px] lg:px-14 px-4 pb-8 lg:pb-10"> <hr class="m-0 h-px border-0 bg-grey-700 mb-6 lg:mb-8"> <div class="flex flex-col items-center sm:flex-row sm:justify-between"> <div class="flex items-center"> <svg class="w-5 h-auto mr-4" width="501" height="501" viewBox="0 0 501 501" fill="none" xmlns="http://www.w3.org/2000/svg" style="width: 20px; "> <title>Algolia mark white</title> <path d="M250.926 0C114.306 0 2.926 110.16.956 246.32c-2 138.29 110.19 252.87 248.49 253.67 42.71.25 83.85-10.2 120.38-30.05 3.56-1.93 4.11-6.83 1.08-9.52l-23.39-20.74c-4.75-4.22-11.52-5.41-17.37-2.92-25.5 10.85-53.21 16.39-81.76 16.04-111.75-1.37-202.04-94.35-200.26-206.1 1.76-110.33 92.06-199.55 202.8-199.55h202.83v360.53l-115.08-102.25c-3.72-3.31-9.43-2.66-12.43 1.31-18.47 24.46-48.56 39.67-81.98 37.36-46.36-3.2-83.92-40.52-87.4-86.86-4.15-55.28 39.65-101.58 94.07-101.58 49.21 0 89.74 37.88 93.97 86.01.38 4.28 2.31 8.28 5.53 11.13l29.97 26.57c3.4 3.01 8.8 1.17 9.63-3.3 2.16-11.55 2.92-23.6 2.07-35.95-4.83-70.39-61.84-127.01-132.26-131.35-80.73-4.98-148.23 58.18-150.37 137.35-2.09 77.15 61.12 143.66 138.28 145.36 32.21.71 62.07-9.42 86.2-26.97l150.36 133.29c6.45 5.71 16.62 1.14 16.62-7.48V9.49c0-5.24-4.25-9.49-9.49-9.49H250.926Z" fill="#fff"></path> </svg><span class="block text-left font-inter font-normal leading-normal text-xs lg:text-sm text-white"> 漏2024 Algolia - All rights reserved.</span> </div> <ul class="m-0 mt-4 flex list-none flex-wrap justify-center p-0 sm:mt-0 sm:justify-end"> <li> <button id="ot-sdk-btn" class="ot-sdk-show-settings block text-left font-inter font-normal leading-normal text-xs lg:text-sm text-white no-underline transition-colors duration-200 hover:text-xenon-400">Cookie settings</button> </li> <li data-tracking=""> <a data-is-internal="true" class="block text-left font-inter font-normal leading-normal text-xs lg:text-sm text-white no-underline transition-colors ml-4 duration-200 hover:text-xenon-400 relative ml-1 before:absolute before:-left-2 before:top-[50%] before:block before:h-1/2 before:w-px before:translate-y-[-50%] before:bg-white before:content-['']" href="/trust-center" data-finalurl="/cms/render/live/en/sites/www/home/trust-center.html" target="_self">Trust Center</a> </li><li data-tracking=""> <a data-is-internal="true" class="block text-left font-inter font-normal leading-normal text-xs lg:text-sm text-white no-underline transition-colors ml-4 duration-200 hover:text-xenon-400 relative ml-1 before:absolute before:-left-2 before:top-[50%] before:block before:h-1/2 before:w-px before:translate-y-[-50%] before:bg-white before:content-['']" href="/policies/privacy" data-finalurl="/policies/privacy" target="_self">Privacy Policy</a> </li><li data-tracking=""> <a data-is-internal="true" class="block text-left font-inter font-normal leading-normal text-xs lg:text-sm text-white no-underline transition-colors ml-4 duration-200 hover:text-xenon-400 relative ml-1 before:absolute before:-left-2 before:top-[50%] before:block before:h-1/2 before:w-px before:translate-y-[-50%] before:bg-white before:content-['']" href="/policies/terms" data-finalurl="/policies/terms" target="_self">Terms of service</a> </li><li data-tracking=""> <a data-is-internal="true" class="block text-left font-inter font-normal leading-normal text-xs lg:text-sm text-white no-underline transition-colors ml-4 duration-200 hover:text-xenon-400 relative ml-1 before:absolute before:-left-2 before:top-[50%] before:block before:h-1/2 before:w-px before:translate-y-[-50%] before:bg-white before:content-['']" href="/policies/acceptable-use" data-finalurl="/policies/acceptable-use" target="_self">Acceptable Use Policy</a> </li></ul> </div> </div> </footer> <script> var oneTrustCookieFooterBtn = setInterval(() => { document.querySelector("#ot-sdk-btn").innerText = "Cookie settings"; }, 1000); setTimeout(() => { clearInterval(oneTrustCookieFooterBtn); }, 4000); </script><script> //Start of Async Drift Code "use strict"; !function() { var t = window.driftt = window.drift = window.driftt || []; if (!t.init) { if (t.invoked) return void (window.console && console.error && console.error("Drift snippet included twice.")); t.invoked = !0, t.methods = [ "identify", "config", "track", "reset", "debug", "show", "ping", "page", "hide", "off", "on" ], t.factory = function(e) { return function() { var n = Array.prototype.slice.call(arguments); return n.unshift(e), t.push(n), t; }; }, t.methods.forEach(function(e) { t[e] = t.factory(e); }), t.load = function(t) { var e = 3e5, n = Math.ceil(new Date() / e) * e, o = document.createElement("script"); o.type = "text/javascript", o.async = !0, o.crossorigin = "anonymous", o.src = "https://js.driftt.com/include/" + n + "/" + t + ".js"; var i = document.getElementsByTagName("script")[0]; i.parentNode.insertBefore(o, i); }; } }(); drift.SNIPPET_VERSION = '0.3.1'; drift.load('akbbnskvekg7'); //End of Async Drift Code akbbnskvekg7 // Collect UTMs (Visi code) drift.on('ready', function(api) { var params = new URLSearchParams(window.location.search); var attributes = {}; for (var pair of params.entries()) { const [key, value] = pair; if (key.startsWith('utm')) { attributes[key] = value; } } api.setUserAttributes(attributes); let didConsent = false; const anonymousId = getAnonymousIdCookie(); if(OnetrustActiveGroups.includes('C0003')) { drift.identify(anonymousId); didConsent = true; } if(!didConsent) { window.OneTrust.OnConsentChanged((e) => { if(e.detail.includes('C0003')) { // User accepts cookies, Cookie ID is then used to identify with Drift const anonymousId = getAnonymousIdCookie(); if(anonymousId) drift.identify(anonymousId); } }) } }); </script> <script src="/modules/algolia-base-template/javascript/jquery.js"></script> <script src="/modules/algolia-base-template/javascript/slick.min.js"></script> <script src="/modules/algolia-base-template/javascript/accordion.js"></script> <script src="/modules/algolia-base-template/javascript/customslick.js"></script> <script src="/modules/algolia-base-template/javascript/prism.js"></script> <script src="/modules/algolia-base-template/javascript/theme.js"></script> <script src="/modules/algolia-base-template/javascript/codepen.js"></script> <script src="/modules/algolia-base-template/javascript/forrester.js"></script> <script src="/modules/algolia-base-template/javascript/blogNavigation.js"></script> <script src="/modules/algolia-base-template/javascript/anonymousUser.js"></script> <script src="/modules/algolia-base-template/javascript/currentUser.js"></script> <script src="/modules/algolia-base-template/javascript/hideBlankTag.js"></script> <script> Prism.highlightAll(); </script> <style> #ot-sdk-btn.ot-sdk-show-settings, #ot-sdk-btn.optanon-show-settings{ border: none; color: white; line-height: 1.2rem; padding: inherit; font-size: 0.875rem; } #ot-sdk-btn.ot-sdk-show-settings:hover, #ot-sdk-btn.optanon-show-settings:hover{ --tw-text-opacity: 1; color: rgb(69 122 255 / var(--tw-text-opacity)); background-color: unset; } </style> <script src="/modules/algolia-base-template/javascript/bannerAnimation.js"></script> </body> </html>

Pages: 1 2 3 4 5 6 7 8 9 10