Time to get creative! Check out the Design section of your Olark dashboard to customize the design of your chat widget.

Colors

The Color Options design tab will allow you to change both the primary and secondary colors of your chat widget. You can choose one of our pre-selected colors, enter in your own color hex code, or even use our drop down color picker to select a color!

On the right side of the screen, you'll see an example showcase of what your selections will appear as for your visitors. You'll see what the widget looks like for desktop or mobile users, minimized, expanded, offline, and online. You can even adjust the chat window between a light or dark theme!

Buttons

On the Button Style tab, you can adjust the chat widget to contain or not contain text.

Size & Position

By default, we offer two positions for your chat widget: at the bottom-right corner of your site or the bottom-left corner. If you're feeling experimental and want your chat to appear on a different area of your website/website pages, we also offer inline options!

You can also select various sizes for your chat window in this section.

Advanced Appearance

The Advanced Appearance section includes options to hide the chatbox for mobile visitors checking out your site on their phones or tablet, switch message positioning, and disabling the rounded corners on the chat widget.

This section also references our "Non-Branded" PowerUp to hide the Powered by Olark branding at the bottom of your chat window.

Even more customization

Need to change the font type? Looking to set up different colored widgets on various pages? Check out our Javascript API for additional customization beyond what we offer in our dashboard!

Disclaimer: We’ll do our best to help with any questions you have! Keep in mind that the API is intended to be self-serve for web developers, so we’re not able to write or debug your code. If you’re experiencing issues, please be sure to have your developer, designer, or webmaster review code you’ve written.