CINXE.COM
Olark: Joomla integration guide (pre v3)
<!DOCTYPE html><!-- Last Published: Mon Nov 04 2024 21:51:04 GMT+0000 (Coordinated Universal Time) --><html data-wf-domain="webflow.olark.com" data-wf-page="65c2c69fb033277667d77197" data-wf-site="646d3c484b3d75dd99420842" lang="en" data-wf-collection="65c2c69fb033277667d771ad" data-wf-item-slug="joomla-legacy"><head><meta charset="utf-8"/><title>Olark: Joomla integration guide (pre v3)</title><meta content="" name="description"/><meta content="Olark: Joomla integration guide (pre v3)" property="og:title"/><meta content="" property="og:description"/><meta content="Olark: Joomla integration guide (pre v3)" property="twitter:title"/><meta content="" property="twitter:description"/><meta property="og:type" content="website"/><meta content="summary_large_image" name="twitter:card"/><meta content="width=device-width, initial-scale=1" name="viewport"/><link href="https://cdn.prod.website-files.com/646d3c484b3d75dd99420842/css/rhis-sublime-site.d5b31603b.min.css" rel="stylesheet" type="text/css"/><script type="text/javascript">!function(o,c){var n=c.documentElement,t=" w-mod-";n.className+=t+"js",("ontouchstart"in o||o.DocumentTouch&&c instanceof DocumentTouch)&&(n.className+=t+"touch")}(window,document);</script><link href="https://cdn.prod.website-files.com/646d3c484b3d75dd99420842/6480dc65df516eb6106007b0_favicon-32.png" rel="shortcut icon" type="image/x-icon"/><link href="https://cdn.prod.website-files.com/646d3c484b3d75dd99420842/64879caf1b12ddf35a9268d6_Olark-round-square.png" rel="apple-touch-icon"/><link href="https://www.olark.com/help/joomla-legacy" rel="canonical"/><!-- Please keep this css code to improve the font quality--> <style> * { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } </style> <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="z7c2qeb2j7";analytics.SNIPPET_VERSION="4.15.2"; window.callbacksWhenVisitorHasConsented = []; window.callbacksWhenVisitorHasConsented.push(function () { analytics.load("z7c2qeb2j7"); }); analytics.page(); }}(); </script><link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.8.0/styles/a11y-light.min.css"/> <!-- [Attributes by Finsweet] Table of Contents --> <script defer src="https://cdn.jsdelivr.net/npm/@finsweet/attributes-toc@1/toc.js"></script></head><body><div class="page-wrapper"><div class="global-styles w-embed"><style> /* Make text look crisper and more legible in all browsers */ body { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; font-smoothing: antialiased; text-rendering: optimizeLegibility; } /* Focus state style for keyboard navigation for the focusable elements */ *[tabindex]:focus-visible, input[type="file"]:focus-visible { outline: 0.188rem solid #00d17e; outline-offset: 0rem; } /* Get rid of top margin on first element in any rich text element */ .w-richtext > :not(div):first-child, .w-richtext > div:first-child > :first-child { margin-top: 0 !important; } /* Get rid of bottom margin on last element in any rich text element */ .w-richtext>:last-child, .w-richtext ol li:last-child, .w-richtext ul li:last-child { margin-bottom: 0 !important; } /* A little polish & readability improvements for rich text elements */ .text-rich-text li { margin-bottom: 0.25rem; } .text-rich-text h3 { margin-top: 3rem; } .w-richtext figure { max-width: 100%; } /* Style code blocks in rich text */ pre { border-radius: 0.25rem; background: #f7f2fd; padding: 0.75rem; margin-bottom: 1.5rem; white-space: pre-wrap; overflow: auto; width: 100%; font-size: .85em; } code { font-size: .85em; } /* Prevent all click and hover interaction with an element */ .pointer-events-off { pointer-events: none; } /* Enables all click and hover interaction with an element */ .pointer-events-on { pointer-events: auto; } /* Create a class of .div-square which maintains a 1:1 dimension of a div */ .div-square::after { content: ""; display: block; padding-bottom: 100%; } /* Make sure containers never lose their center alignment */ .container-medium,.container-small, .container-large { margin-right: auto !important; margin-left: auto !important; } /*Styling Swifttype search results*/ .st-ui-type-heading { font-size: 1.5rem; } .st-ui-type-detail { font-size: 1rem; color: #000; } a.st-ui-result:before { border-color: #3e3582; } a.st-ui-result .st-ui-type-detail { max-height: 3rem; } .st-ui-type-detail-bold { font-size: 1rem; color: #272d3f; } .st-ui-footer { padding-bottom: 1rem; border-bottom: solid 1px #474750; } .st-ui-type-heading { font-size: 1.25rem; } .st-ui-type-detail { font-size: 1rem; } /* Make the following elements inherit typography styles from the parent and not have hardcoded values. Important: You will not be able to style for example "All Links" in Designer with this CSS applied. Uncomment this CSS to use it in the project. Leave this message for future hand-off. */ /* a, .w-input, .w-select, .w-tab-link, .w-nav-link, .w-dropdown-btn, .w-dropdown-toggle, .w-dropdown-link { color: inherit; text-decoration: inherit; font-size: inherit; } */ /* Apply "..." after 3 lines of text */ .text-style-3lines { display: -webkit-box; overflow: hidden; -webkit-line-clamp: 3; -webkit-box-orient: vertical; } /* Apply "..." after 2 lines of text */ .text-style-2lines { display: -webkit-box; overflow: hidden; -webkit-line-clamp: 2; -webkit-box-orient: vertical; } /* Adds inline flex display */ .display-inlineflex { display: inline-flex; } /* These classes are never overwritten */ .hide { display: none !important; } @media screen and (max-width: 991px) { .hide, .hide-tablet { display: none !important; } } @media screen and (max-width: 767px) { .hide-mobile-landscape{ display: none !important; } } @media screen and (max-width: 479px) { .hide-mobile{ display: none !important; } } .margin-0 { margin: 0rem !important; } .padding-0 { padding: 0rem !important; } .spacing-clean { padding: 0rem !important; margin: 0rem !important; } .margin-top { margin-right: 0rem !important; margin-bottom: 0rem !important; margin-left: 0rem !important; } .padding-top { padding-right: 0rem !important; padding-bottom: 0rem !important; padding-left: 0rem !important; } .margin-right { margin-top: 0rem !important; margin-bottom: 0rem !important; margin-left: 0rem !important; } .padding-right { padding-top: 0rem !important; padding-bottom: 0rem !important; padding-left: 0rem !important; } .margin-bottom { margin-top: 0rem !important; margin-right: 0rem !important; margin-left: 0rem !important; } .padding-bottom { padding-top: 0rem !important; padding-right: 0rem !important; padding-left: 0rem !important; } .margin-left { margin-top: 0rem !important; margin-right: 0rem !important; margin-bottom: 0rem !important; } .padding-left { padding-top: 0rem !important; padding-right: 0rem !important; padding-bottom: 0rem !important; } .margin-horizontal { margin-top: 0rem !important; margin-bottom: 0rem !important; } .padding-horizontal { padding-top: 0rem !important; padding-bottom: 0rem !important; } .margin-vertical { margin-right: 0rem !important; margin-left: 0rem !important; } .padding-vertical { padding-right: 0rem !important; padding-left: 0rem !important; } </style></div><section class="hello_bar-container"><div class="container-large"><div class="hello_bar-text-container"><div class="hello_bar-text">Provide 24/7 affordable customer service with AI-powered chat.</div><a href="https://www.olark.com/aiden-chatbot?utm_source=marketingoutreach&utm_medium=hellobar&utm_campaign=EID082hellobar-AIcustomerservice" class="text-weight-semibold text-color-purple">Connect to learn more</a></div></div></section><div id="nav" data-animation="default" data-collapse="medium" data-duration="400" data-easing="ease" data-easing2="ease" role="banner" class="nav w-nav"><div class="container-large w-container"><a href="/" class="nav_brand_link w-nav-brand"><img src="https://cdn.prod.website-files.com/646d3c484b3d75dd99420842/6633e36dd87b8cf67a0b0e22_Olark_poppins_white.svg" loading="lazy" width="125" height="Auto" alt="" class="brand_logo"/></a><nav role="navigation" class="nav_menu_links w-nav-menu"><div data-hover="false" data-delay="0" class="dropdown w-dropdown"><div class="nav_link w-dropdown-toggle"><div class="icon w-icon-dropdown-toggle"></div><div class="button_text">Features</div></div><nav class="nav_dropdown_list w-dropdown-list"><a href="/features" class="nav_link-dropdown w-dropdown-link">Overview</a><a href="/chatbot-copilot" class="nav_link-dropdown w-dropdown-link">Chatbots</a><a href="/features/customization" class="nav_link-dropdown w-dropdown-link">Customization</a><a href="/features/automated" class="nav_link-dropdown w-dropdown-link">Automation</a><a href="/features/reporting" class="nav_link-dropdown w-dropdown-link">Reporting</a><a href="/features/searchable-transcripts" class="nav_link-dropdown w-dropdown-link">Searchable Transcripts</a><a href="/features/custom-forms" class="nav_link-dropdown w-dropdown-link">Custom Forms</a><a href="/features/realtime" class="nav_link-dropdown w-dropdown-link">Real-Time Engagement</a><a href="/all-powerups" class="nav_link-dropdown w-dropdown-link">Power-Ups</a><a href="/features/team-management" class="nav_link-dropdown w-dropdown-link">Team Management</a><a href="/ada-accessible-live-chat" class="nav_link-dropdown w-dropdown-link">Accessible Live Chat</a></nav></div><div data-hover="false" data-delay="0" class="dropdown w-dropdown"><div class="nav_link w-dropdown-toggle"><div class="icon w-icon-dropdown-toggle"></div><div class="button_text">How To</div></div><nav class="nav_dropdown_list w-dropdown-list"><a href="/ecommerce" class="nav_link-dropdown w-dropdown-link">Increase Sales</a><a href="/live-chat-lead-generation" class="nav_link-dropdown w-dropdown-link">Generate Leads</a><a href="/customer-service" class="nav_link-dropdown w-dropdown-link">Provide Great Service</a><a href="/live-chat-for-higher-education" class="nav_link-dropdown w-dropdown-link">Engage Students</a><a href="/tips-for-remote-managers-and-going-remote-guide" class="nav_link-dropdown w-dropdown-link">Manage a Remote Team</a></nav></div><a href="/chatbot-copilot" class="nav_link w-nav-link">Chatbots</a><a href="/pricing" class="nav_link w-nav-link">Pricing</a><a href="/case-studies" class="nav_link w-nav-link">Case Studies</a><a href="/integrations" class="nav_link w-nav-link">Integrations</a><a href="/login" class="nav_link w-nav-link">Log in</a><a href="/signup/create_new_account/trial" class="nav_link nav_button w-nav-link">Free Trial</a></nav><div class="menu-button w-nav-button"><div class="icon-2 w-icon-nav-menu"></div></div></div></div><main class="main-wrapper"><div class="padding-global"><div class="container-large"><div class="help_page-layout"><div class="help_content-wrapper"><main class="section_post-content"><div class="help-container"><nav aria-label="breadcrumb" class="help_breadcrumbs"><a href="/help" class="help_breadcrumbs-link w-inline-block"><div class="help_breadcrumbs-link-text">HELP</div></a><img src="https://cdn.prod.website-files.com/646d3c484b3d75dd99420842/648c8589705dbf74221e0532_rightcarat.svg" loading="lazy" alt="" class="help_breadcrumbs-carat"/><a href="/categories/installation" class="help_breadcrumbs-link w-inline-block"><div aria-current="page" class="help_breadcrumbs-link-text">Installation</div></a></nav><div class="help_article-title"><h1 class="heading-style-h2 text-color-purple">Joomla integration guide (pre v3)</h1></div><div fs-toc-offsettop="8rem" fs-richtext-element="rich-text" fs-toc-element="contents" class="text-rich-text w-richtext"><p>Joomla! is the mobile-ready and user-friendly way to build your own website. Choose from thousands of features and designs. Joomla! is free and open source.</p><h3>Versions</h3><p>This tutorial contains guides for the following Joomla versions: </p><ul role="list"><li>Version 2.5</li><li>Version 1.6</li><li>Version 1.5</li></ul><p>We also have a separate <a href="http://joomla">tutorial for Joomla 3</a>.</p><p></p><h3>Joomla 2.5</h3><ol role="list"><li>Log into your Joomla administration area.</li><li>If you are using a text editor, such as TinyMCE, set it to "none".</li><li>Install the <a href="http://extensions.joomla.org/extensions/core-enhancements/coding-a-scripts-integration/custom-code-in-modules/16359">custom HTML advanced module</a> on your Joomla account.</li><li>Continue following the below instructions for Joomla 1.6.</li></ol><h3>Joomla 1.6</h3><ol role="list"><li>Log in to your Joomla administration area. Click on the <strong>Template Manager</strong> under the <strong>Extensions</strong> tab.</li></ol><figure class="w-richtext-align-center w-richtext-figure-type-image"><div><img alt="Template Manager menu item " src="https://cdn.prod.website-files.com/646d3c494b3d75dd99420891/64cac9cf19bd5a8acdc25ad3_joomla2.jpeg" loading="lazy"/></div></figure><p>2. On the <strong>Templates Manager</strong> page, click on the <strong>Templates</strong> link.</p><figure class="w-richtext-align-center w-richtext-figure-type-image"><div><img alt="Templates link" src="https://cdn.prod.website-files.com/646d3c494b3d75dd99420891/64cac9cf19bd5a8acdc25ad0_joomla3.jpeg" loading="lazy"/></div></figure><p>3. Click on your current theme. If you are not sure which that is, choose the one whose thumbnail looks like your website.</p><figure class="w-richtext-align-center w-richtext-figure-type-image"><div><img alt="Click current theme" src="https://cdn.prod.website-files.com/646d3c494b3d75dd99420891/64cac9cf19bd5a8acdc25ade_joomla4.jpeg" loading="lazy"/></div></figure><p>4. Click <strong>Edit main page template</strong>.</p><figure class="w-richtext-align-center w-richtext-figure-type-image"><div><img alt="Edit main template button" src="https://cdn.prod.website-files.com/646d3c494b3d75dd99420891/64cac9cf19bd5a8acdc25ad8_joomla5.jpeg" loading="lazy"/></div></figure><p>5. The next page is where you will need your Olark code.</p><p>6. Log in and copy <a href="https://www.olark.com/settings/code">your Olark embed code</a>.</p><p>7. Scroll to the bottom of the <strong>Source Code</strong> text area and paste your Olark embed code before the </body> tag.</p><figure class="w-richtext-align-center w-richtext-figure-type-image"><div><img alt="Olark snippet in text area" src="https://cdn.prod.website-files.com/646d3c494b3d75dd99420891/64cac9cf19bd5a8acdc25ac9_joomla6.jpeg" loading="lazy"/></div></figure><p>8. Then click <strong>Save</strong>.</p><p>9. Click <strong>Edit error page template</strong>. This step helps make sure that Olark appears on all the pages of your website.</p><figure class="w-richtext-align-center w-richtext-figure-type-image"><div><img alt="Click edit error page template" src="https://cdn.prod.website-files.com/646d3c494b3d75dd99420891/64cac9cf19bd5a8acdc25adb_joomla7.jpeg" loading="lazy"/></div></figure><p>10. Paste your Olark code into the bottom of the <strong>Source Code</strong> text area, just like you did in the main page template</p><figure class="w-richtext-align-center w-richtext-figure-type-image"><div><img alt="Olark code in text area" src="https://cdn.prod.website-files.com/646d3c494b3d75dd99420891/64cac9cf19bd5a8acdc25acc_joomla9.jpeg" loading="lazy"/></div></figure><p>11. Finally, click <strong>Save</strong>. That's it! Load up your Joomla website to try it out.</p><h3>Joomla 1.5</h3><ol role="list"><li>Log into your Joomla administration area.</li><li>Click on the "Template Manager" in Extensions » Template Manager</li></ol><figure class="w-richtext-align-center w-richtext-figure-type-image"><div><img alt="Template manager menu item" src="https://cdn.prod.website-files.com/646d3c494b3d75dd99420891/64cac9cf19bd5a8acdc25abc_templatemanager.png" loading="lazy"/></div></figure><p>3. Click your current theme:</p><figure class="w-richtext-align-center w-richtext-figure-type-image"><div><img alt="Click on your current theme" src="https://cdn.prod.website-files.com/646d3c494b3d75dd99420891/64cac9cf19bd5a8acdc25ab9_theme.png" loading="lazy"/></div></figure><p>4. Click on "Edit HTML"</p><figure class="w-richtext-align-center w-richtext-figure-type-image"><div><img alt="Edit HTML button" src="https://cdn.prod.website-files.com/646d3c494b3d75dd99420891/64cac9cf19bd5a8acdc25ae1_edit.png" loading="lazy"/></div></figure><p>5. Scroll to the bottom of the editor panel and paste Olark Javascript above the </body> tag.</p><p>6. Log in and copy <a href="https://www.olark.com/settings/code">your Olark embed code</a>.</p><figure class="w-richtext-align-center w-richtext-figure-type-image"><div><img alt="Olark code in text area" src="https://cdn.prod.website-files.com/646d3c494b3d75dd99420891/64cac9cf19bd5a8acdc25ae4_code.png" loading="lazy"/></div></figure><p>7. Click save.</p><figure class="w-richtext-align-center w-richtext-figure-type-image"><div><img alt="Save button" src="https://cdn.prod.website-files.com/646d3c494b3d75dd99420891/64cac9cf19bd5a8acdc25ac2_save.png" loading="lazy"/></div></figure></div><div class="support_ticket_form-block w-condition-invisible w-form"><form id="wf-form-Support-Ticket-Form" name="wf-form-Support-Ticket-Form" data-name="Support Ticket Form" method="get" class="support_ticket_form" data-wf-page-id="65c2c69fb033277667d77197" data-wf-element-id="efc8e68f-79b9-406a-e9ad-070f9a9c28f4"><label for="What-can-we-help-with" class="support_form_field_label">What topic can we help with?</label><select id="What-can-we-help-with" name="What-can-we-help-with" data-name="What can we help with?" required="" class="support_form_select_field w-select"><option value="Billing">Billing</option><option value="Chat Console">Chat Console</option><option value="Dashboard">Dashboard</option><option value="PowerUps">PowerUps</option><option value="CRM/Integration">CRM/Integration</option><option value="Transcripts/Chat">Transcripts/Chat</option></select><label for="name" class="support_form_field_label">Name</label><input class="support_form_text_field w-input" maxlength="256" name="name" data-name="Name" placeholder="" type="text" id="name" required=""/><label for="Email-Address" class="support_form_field_label">Email Address*</label><input class="support_form_text_field w-input" maxlength="256" name="Email-Address" data-name="Email Address" placeholder="" type="email" id="Email-Address" required=""/><label for="email-3" class="support_form_field_label">Website URL</label><div class="support_form_field_help_text">Please provide the domain name where your Olark live chat is installed.</div><input class="support_form_text_field w-input" maxlength="256" name="Website-URL" data-name="Website URL" placeholder="" type="text" id="Website-URL"/><label for="email-2" class="support_form_field_label">Transcript URL (if applicable)</label><div class="support_form_field_help_text">Include the relevant transcript URL, if possible. You can send us the specific URL from <a href="https://www.olark.com/transcripts" target="_blank">your Transcripts page</a>.</div><input class="support_form_text_field w-input" maxlength="256" name="Transcript-URL" data-name="Transcript URL" placeholder="" type="text" id="Transcript-URL"/><label for="email" class="support_form_field_label">Provide as much information about the issue as possible.*</label><div class="support_form_field_help_text">If you see specific error messages, banners, warnings, notices, etc., please let us know here.</div><textarea id="Issue-Information" name="Issue-Information" maxlength="5000" data-name="Issue Information" placeholder="" required="" class="support_form_text_field w-input"></textarea><label for="email" class="support_form_field_label">Screenshot (recommended)</label><div class="support_form_file_upload w-file-upload"><div class="w-file-upload-default"><input class="w-file-upload-input" accept="" name="Screenshot" data-name="Screenshot" aria-hidden="true" type="file" id="Screenshot" tabindex="-1"/><label for="Screenshot" role="button" tabindex="0" class="w-file-upload-label"><div class="w-icon-file-upload-icon"></div><div class="w-inline-block">Upload File</div></label><div class="w-file-upload-info">Max file size 10MB.</div></div><div tabindex="-1" class="w-file-upload-uploading w-hidden"><div class="w-file-upload-uploading-btn"><svg class="w-icon-file-upload-uploading" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 30 30" aria-hidden="true"><path fill="currentColor" opacity=".2" d="M15 30a15 15 0 1 1 0-30 15 15 0 0 1 0 30zm0-3a12 12 0 1 0 0-24 12 12 0 0 0 0 24z"></path><path fill="currentColor" opacity=".75" d="M0 15A15 15 0 0 1 15 0v3A12 12 0 0 0 3 15H0z"><animateTransform attributeName="transform" attributeType="XML" dur="0.6s" from="0 15 15" repeatCount="indefinite" to="360 15 15" type="rotate"></animateTransform></path></svg><div class="w-inline-block">Uploading...</div></div></div><div tabindex="-1" class="w-file-upload-success w-hidden"><div class="w-file-upload-file"><div class="w-file-upload-file-name">fileuploaded.jpg</div><div aria-label="Remove file" role="button" tabindex="0" class="w-file-remove-link"><div class="w-icon-file-upload-remove"></div></div></div></div><div tabindex="-1" class="w-file-upload-error w-hidden"><div class="w-file-upload-error-msg" data-w-size-error="Upload failed. Max size for files is 10 MB." data-w-type-error="Upload failed. Invalid file type." data-w-generic-error="Upload failed. Something went wrong. Please retry.">Upload failed. Max size for files is 10 MB.</div></div></div><input type="submit" data-wait="Submitting..." class="button w-button" value="Submit"/></form><div class="w-form-done"><div class="support_ticket_form-success-message">Thank you! Your submission has been received and you'll hear from us shortly!</div></div><div class="w-form-fail"><div>Oops! Something went wrong while submitting the form.</div></div></div></div></main><div class="section_post-widget"><div class="container-large"><aside class="help_article-sidebar-list"><h2 class="help_sidebar-heading heading-style-h3 text-color-purple">Need More Help?</h2><div class="help_sidebar_links-container"><a id="chat_click" href="#" class="help_sidebar-link w-inline-block"><div class="help_sidebar-link-text">Chat with an Olarker</div><div class="help_sidebar-text">Monday - Friday, 7am - 4pm Pacific</div></a><a href="/help/ticket" class="help_sidebar-link w-inline-block"><div class="help_sidebar-link-text">Open a support ticket</div><div class="help_sidebar-text">Or email support@olark.com</div></a><a href="https://twitter.com/intent/tweet?screen_name=OlarkSupport&share_with_retweet=never" class="help_sidebar-link w-inline-block"><div class="help_sidebar-link-text">Tweet @olarksupport</div><div class="help_sidebar-text">Quick answers to short questions</div></a><a href="https://status.olark.com" class="help_sidebar-link w-inline-block"><div class="help_sidebar-link-text">Olark system status </div><div class="help_sidebar-text">Subscribe to status notifications</div></a></div></aside></div></div></div><div class="help_page-toc"><div class="section_post-widget is-sidebar"><div class="container-medium"><aside class="toc_widget"><h2 class="toc-heading heading-style-h5 text-color-grey">On this page:</h2><div fs-toc-element="table" class="fs-toc_links"><div class="fs-toc_link-wrapper is-h2"><a fs-toc-element="link" href="#" class="fs-toc_link w-inline-block"><div class="fs_toc_link-text">Example H2</div></a><div class="fs-toc_link-wrapper is-h3"><a fs-toc-element="link" href="#" class="fs-toc_link w-inline-block"><div class="fs_toc_link-text">Example H3</div></a></div></div></div></aside></div></div></div></div></div></div></main><footer class="footer_component"><div class="padding-global"><div class="container-large"><div class="footer_top-wrapper"><div class="footer_top-left-wrapper"><img src="https://cdn.prod.website-files.com/646d3c484b3d75dd99420842/6633d97bc26b66fa20f8ae32_Olark_Poppins_underline-02%20(1).png" loading="lazy" width="150" height="Auto" alt="" srcset="https://cdn.prod.website-files.com/646d3c484b3d75dd99420842/6633d97bc26b66fa20f8ae32_Olark_Poppins_underline-02%20(1)-p-500.png 500w, https://cdn.prod.website-files.com/646d3c484b3d75dd99420842/6633d97bc26b66fa20f8ae32_Olark_Poppins_underline-02%20(1)-p-800.png 800w, https://cdn.prod.website-files.com/646d3c484b3d75dd99420842/6633d97bc26b66fa20f8ae32_Olark_Poppins_underline-02%20(1)-p-1080.png 1080w, https://cdn.prod.website-files.com/646d3c484b3d75dd99420842/6633d97bc26b66fa20f8ae32_Olark_Poppins_underline-02%20(1)-p-1600.png 1600w, https://cdn.prod.website-files.com/646d3c484b3d75dd99420842/6633d97bc26b66fa20f8ae32_Olark_Poppins_underline-02%20(1)-p-2000.png 2000w, https://cdn.prod.website-files.com/646d3c484b3d75dd99420842/6633d97bc26b66fa20f8ae32_Olark_Poppins_underline-02%20(1)-p-2600.png 2600w, https://cdn.prod.website-files.com/646d3c484b3d75dd99420842/6633d97bc26b66fa20f8ae32_Olark_Poppins_underline-02%20(1)-p-3200.png 3200w, https://cdn.prod.website-files.com/646d3c484b3d75dd99420842/6633d97bc26b66fa20f8ae32_Olark_Poppins_underline-02%20(1).png 4367w" sizes="150px"/><div class="padding-bottom padding-medium"></div><a href="/handbook/why-did-we-become-a-b-corp" class="footer_b-corp_link w-inline-block"><img src="https://cdn.prod.website-files.com/646d3c484b3d75dd99420842/6633d755970dafc3e4f795ae_B-Corp-Logo-Black-RGB.svg" loading="lazy" width="Auto" height="Auto" alt="Certified B Corporation logo" id="w-node-afae296e-047a-0fe0-97aa-dd796df6c60c-0a146e1f" class="img_b-corp"/></a><div id="w-node-e1e85c5f-1d20-ea55-3149-541fec6217cf-0a146e1f" class="padding-bottom padding-small"></div></div><div class="footer_top-right-wrapper"><div id="w-node-_7c4dd3ca-1b11-b71f-2f9d-badf0a146e35-0a146e1f" class="footer_menu-wrapper"><div class="footer_link-col"><div class="text-size-medium text-weight-medium text-color-purple">Product</div><div class="footer_link-list"><a href="/pricing" class="footer_link text-size-regular">Pricing</a><a href="/chatbot-copilot" class="footer_link text-size-regular">Chatbots</a><a href="/features" class="footer_link text-size-regular">Features</a><a href="/integrations" class="footer_link text-size-regular">Integrations</a><a href="/product-tour" class="footer_link text-size-regular">Product Tour</a><a href="/case-studies" class="footer_link text-size-regular">Case Studies</a></div></div><div class="footer_link-col"><div class="text-size-medium text-weight-medium text-color-purple">Support</div><div class="footer_link-list"><a href="/faq" class="footer_link text-size-regular">FAQ</a><a href="/help" class="footer_link text-size-regular">Help Center</a><a href="/help/getting-started" class="footer_link text-size-regular">Getting Started</a><a href="/categories/tool-tip" class="footer_link text-size-regular">Troubleshooting</a><a href="/api" class="footer_link text-size-regular">JavaScript API</a></div></div><div class="footer_link-col"><div class="text-size-medium text-weight-medium text-color-purple">About</div><div class="footer_link-list"><a href="https://www.olark.com/about" class="footer_link text-size-regular">Our Team</a><a href="https://www.olark.com/values" class="footer_link text-size-regular">Our Values</a><a href="https://www.olark.com/jobs" class="footer_link text-size-regular">Become an Olarker</a><a href="/handbook" class="footer_link text-size-regular">Employee Handbook</a><a href="/ndeam" class="footer_link text-size-regular">National Disability Employment Month</a></div></div><div class="footer_link-col"><div class="text-size-medium text-weight-medium text-color-purple">Connect with us</div><div class="footer_link-list"><a href="https://olark.com/speak" class="footer_link text-size-regular">Speak: The Olark Blog</a><a href="https://www.olark.com/tips-for-remote-managers-and-going-remote-guide" class="footer_link text-size-regular">Our Guide to Remote Work</a><a href="https://www.olark.com/partners" class="footer_link text-size-regular">Become a Partner</a><a href="https://www.olark.com/contact" class="footer_link text-size-regular">Contact Us</a></div></div></div></div></div></div></div><div class="footer_bottom-wrapper"><div class="padding-global"><div class="container-large"><div class="footer_bottom-row"><div class="footer_bottom-left-content"><div class="w-layout-grid grid-4"><a id="w-node-_9aaedbbc-afdb-fcc7-ae4d-f4a38cfb414f-0a146e1f" href="https://www.olark.com/tos" class="footer_link w-inline-block">Terms of Service</a><a id="w-node-a2487b5b-882a-4ba4-ea16-b763cee8839a-0a146e1f" href="https://www.olark.com/privacy-policy" class="footer_link w-inline-block">Privacy Policy</a><a id="w-node-f9109ed8-ea5b-c451-bf9b-60422ddc5345-0a146e1f" href="https://www.olark.com/help/gdpr" class="footer_link w-inline-block">GDPR</a><a id="w-node-_21be5599-5942-d1e3-7b3a-5e010b2a6f0d-0a146e1f" href="https://www.olark.com/ada-accessible-live-chat" class="footer_link w-inline-block">Accessibility</a><a id="w-node-_4f04dad2-d35d-f187-106a-a2242dc01649-0a146e1f" href="https://blog.olark.com/statement-of-solidarity-and-action-for-black-lives-matter" class="footer_link w-inline-block">Statement of Action</a></div></div></div></div></div></div></footer></div><div id="cookie-consent" class="cookie_consent-container hidden"><div fs-cc="banner" class="fs-cc-banner_component-2"><div class="fs-cc-banner_container"><div class="fs-cc-banner_text">Olark uses cookies to give you the best possible experience on our website. By clicking "I like cookies", you agree to our use of them. View our <a href="/privacy-policy" class="fs-cc-banner_text-link">Privacy Policy</a> for more information.</div><div class="fs-cc-banner_buttons-wrapper"><a id="cookie-consent-accept" fs-cc="allow" data-w-id="eee4b971-6c89-3219-ab66-2ecff1bafac1" href="#" class="fs-cc-banner_button w-button">Accept</a></div></div></div></div><script src="https://d3e54v103j8qbb.cloudfront.net/js/jquery-3.5.1.min.dc5e7f18c8.js?site=646d3c484b3d75dd99420842" type="text/javascript" integrity="sha256-9/aliU8dGd2tb6OSsuzixeV4y/faTqgFtohetphbbj0=" crossorigin="anonymous"></script><script src="https://cdn.prod.website-files.com/646d3c484b3d75dd99420842/js/rhis-sublime-site.2ab3870a1.js" type="text/javascript"></script><!-- begin olark code --> <script type="text/javascript" async> ;(function(o,l,a,r,k,y){if(o.olark)return; r="script";y=l.createElement(r);r=l.getElementsByTagName(r)[0]; y.async=1;y.src="//"+a;r.parentNode.insertBefore(y,r); y=o.olark=function(){k.s.push(arguments);k.t.push(+new Date)}; y.extend=function(i,j){y("extend",i,j)}; y.identify=function(i){y("identify",k.i=i)}; y.configure=function(i,j){y("configure",i,j);k.c[i]=j}; k=y._={s:[],t:[+new Date],c:{},l:a}; })(window,document,"static.olark.com/jsclient/loader.js"); /* Add configuration calls below this comment */ olark.identify('9353-431-10-4341');</script> <!-- end olark code --> <script async type="text/javascript" src="//static.olark.com/a/cookie-consent/cookie-consent.js"></script> <!-- linkedin tracker --> <script type="text/javascript"> _linkedin_partner_id = "47470"; window._linkedin_data_partner_ids = window._linkedin_data_partner_ids || []; window._linkedin_data_partner_ids.push(_linkedin_partner_id); </script><script type="text/javascript"> (function(l) { if (!l){window.lintrk = function(a,b){window.lintrk.q.push([a,b])}; window.lintrk.q=[]} var s = document.getElementsByTagName("script")[0]; var b = document.createElement("script"); b.type = "text/javascript";b.async = true; b.src = "https://snap.licdn.com/li.lms-analytics/insight.min.js"; s.parentNode.insertBefore(b, s);})(window.lintrk); </script> <noscript> <img height="1" width="1" style="display:none;" alt="" src="https://px.ads.linkedin.com/collect/?pid=47470&fmt=gif" /> </noscript><script src="//cdnjs.cloudflare.com/ajax/libs/highlight.js/11.7.0/highlight.min.js"></script> <script>hljs.highlightAll();</script><script src="https://hubspotonwebflow.com/assets/js/form-124.js" type="text/javascript" integrity="sha384-bjyNIOqAKScdeQ3THsDZLGagNN56B4X2Auu9YZIGu+tA/PlggMk4jbWruG/P6zYj" crossorigin="anonymous"></script></body></html>