Customize your SalesIQ live chat with Custom CSS and blend it with your website design

Customize your SalesIQ live chat with Custom CSS and blend it with your website design

Hi everyone. Hope you all are having a great day!

SalesIQ offers various inbuilt customization choices for your chat widget and window like changes in colour, theme, font etc. Although these choices are many, sometimes they may not match with the design of your website. For such cases, we offer the Custom CSS feature which will allow you to customize, modify and change the appearance and feel of every aspect of your SalesIQ live chat widget and window on your website.
In this post, we will be talking about some necessary pointers on how you can write and implement Custom CSS for your requirements. We have also included a few tips and sample CSS for frequently asked queries.

Building your CSS

For ease of understanding, we have broken down all of the structural modules of the chat window and given the field names and their basic CSS in our detailed user guide here. Using this, you will be able to build your CSS code for individual parts of the module and then apply it, according to your specific requirements.

Where do I place the CSS code? 

There are 2 methods to carry out Custom CSS on SalesIQ. Both methods are used for varying circumstances. 

  1. Brand Personalization - The first method is by uploading the Custom CSS file in the Personalization area of the chat widget. This method is to be used when changes/modifications are to be made on the elements within the chat window. For example, changes in the messaging area, font used within the chat window, colour changes for the header or minimize button etc.

For this,

  • Navigate to Settings > Brands > Personalization > Appearance tab.
  • Scroll down to Upload custom CSS and click on Upload.


  • Choose the required CSS file from the list.
  • The preview window on the right will immediately display the result of adding your Custom CSS code to SalesIQ.
In this case, CSS for changing the header colour was added.
  1. Website Style sheet

In this method, the CSS needs to be uploaded directly to a website's style sheet. This method is used when changes are required outside of the chat window. For example, sizing changes of the chat window, position and colour changes of the chat widget etc.


In this case, a Custom CSS for changing the height and width of the chat window has been added to the style sheet.

Tips for writing Custom CSS

  1. The !important rule in CSS can be used to add more weightage to a property and override other previously added styling rules.

  2. Extra CSS weightage can be added with a body tag, which will be another way to override all previous styling rules for the element.


Frequently asked CSS formats 

We have taken note of some of the frequently asked queries and provided the custom CSS code here for your reference.

  • To change the header colour of the chat window.

  1. body header {
  2.     background: #e2bb3c !important;
  3. }
  • To change the chat window dimensions on website.

  1. body .zsiq-newtheme.siqembed.zls-sptwndw {
  2. height: 500px !important;
  3. width: 400px !important;
  4. }
  • To change the chat widget colour.

  1. body .zsiq_flt_rel {
  2. background-color: #e2bb3c !important;
  3. }

  • To change the chat window dimensions on mobile alone.

  1. @media only screen and (min-width: 100px) and (max-width: 555px)
  2. {
  3. body .zsiq-newtheme.zsiq-mobhgt.siqembed {
  4. height: 80% !important;
  5. width: 80% !important;
  6. }
  7. }

  • To move the position of the chat widget.

  1. body .zsiq_floatmain {
  2. right: 40px !important;
  3. bottom: 40px !important;
  4. }
Thank you for reading through. We hope you found this post helpful. If you have any questions, please drop a comment and our team will be happy to help you.

      • Recent Topics

      • Custom Fields connected to Invoices, Customers, Quotes, CRM

        I created the exact same custom fields in Books: Invoices, Customer, Quotes, and in CRM but they don't seem to have a relationship to one another. How do I connect these fields so that the data is mapped across transactions?
      • Accelerate Github code reviews with Zoho Cliq Platform's link handlers

        Code reviews are critical, and they can get buried in conversations or lost when using multiple tools. With the Cliq Platform's link handlers, let's transform shared Github pull request links into interactive, real-time code reviews on channels. Share
      • Heads up: We're going to update the VAT Summary table's visibility (UK and Germany Editions)

        Hello users, Note: This change only applies to organisations using the UK and Germany editions of Zoho Books. Currently, if you've enabled the VAT Summary table in a template, it will be displayed only in PDFs sent to your customers whose default currency
      • Partial payment invoicing

        Greetings I have questions related to payments and retainer invoices: 1. When I want to issue a partial payment invoice, I can't specify the portion to be paid or already paid, then balance to be shown as Due. 2. Retainer invoice is only available as
      • Inputting VAT Pre-Registration expenses for first VAT Return

        Hi Zoho, I've just registered for VAT and am setting up Zoho to handle calculations and VAT return submissions. I'm struggling to figure out how to input the last 4 years worth of expenses into Zoho so that they're calculated in the VAT module. When I
      • Anyone else experiencing very slow loading of pages in Zoho Projects?

        I reported this yesterday only to be told there are no issues but is anyone else experiencing stupidly slow loading of pages. On our loading screen, it is taking often as long as 60 seconds to load a page and just stays on this screen for ages! Other
      • Zoho Desk Lookup Field Reporting

        Thank you for adding the ability to add additional lookup fields for desk tickets. My question is how do you report against these fields? For example: Associating related accounts to the primary desk ticket account, I am not able to add the lookup fields
      • Integrating asana will cause notification messages to pop up continuously

        When I create or edit a task in Asana, the Asana bot keeps updating messages to group chat, which causes the cliq to keep popping up notifications.
      • Entire notebook that had notes has disappeared

        I don't know how tf this happened. All I did was uninstall and reinstall the mobile app after fixing a bug I had. After I reinstalled the app, everything was synced back except for one folder which had a bunch of notes in it. None of those notes are in
      • My site has disappeared from web builder

        www.mproperties.uk My site above is still working. However it has completely disappeared from my Zoho sites' web builder. I am therefore unable to edit my site whatsoever. Please help.
      • Trying to trigger email notification based on rollup summary field

        Hi there, I'm trying to trigger an email notification via Workflow Rules wherever the rollup summary field "Total Shipments" goes from empty to not empty. However this field is not available from the picklist of options in the Workflow rule. Can anyone
      • zia data enrichment - switch to webamigo Extension

        Hello, I have so far used data enrichment via Zia. Now I have installed the Webamigo extension to expand personal data. Unfortunately, nothing has changed after the installation; are there any additional steps needed to switch from the previous method
      • Export Timeline

        With the new Timeline features, it would be really helpful to have the option to export a timeline. When handling customer complaints, having the full breakdown of everything that happens on a module is great but we usually have to send this to another
      • Interactions Tab in Zoho CRM: A 360° Omnichannel View of Every Customer Touchpoint

        Hello Everyone, Hope you are well! We are here today with yet another announcement in our series for the revamped Zoho CRM. Today, we introduce Interactions Tab a new way to view all customer interactions from one place inside your CRM account. Customers
      • How to resubscribe a contact marked as "Unsubscribed (Marked by Recipient)" without using a form?

        Hello, I have a question regarding Zoho Marketing Automation functionality. Is there a way for an administrator to change the subscription status of a contact marked as "Unsubscribed (Marked by Recipient)" back to "Subscribed" without using a form? Ideally,
      • Linkedin: when Zoho Social is going serious with it?

        Hi, it's been said in the past that Linkedin related features in Zoho Social were well behind those of other social networks because of limitations imposed by the platform. Now that we see around my tools (take taplio.com) frankly outpacing ZSocial on
      • 5名限定 課題解決型ワークショップイベント Zoho ワークアウト開催のお知らせ(7/24)

        ユーザーの皆さま、こんにちは。Zoho ユーザーコミュニティチームの藤澤です。 7月開催のZoho ワークアウトについてお知らせします。 2ヶ月ぶりに、渋谷にて「リアル開催」します! ▷▷詳細はこちら:https://www.zohomeetups.com/20250724Zoho ━━━━━━━━━━━━━━━━━━━━━━━━ Zoho ワークアウトとは? Zoho ユーザー同士で交流しながら、サービスに関する疑問や不明点の解消を目的とした「Zoho ワークアウト」を開催します。 Zoho サービスで完了させたい設定やカスタマイズ、環境の整備など……各自で決めた目標達成に向け、
      • How to get fields centered in a form?

        Is it possible to center fields in a form? Some of my forms do some don't and it is really not aestheticly pleasing?  Any help would be greatly appricated. Thanks, Michael McNeill 
      • Make Packages from multiple sales order of a single customer

        Our customers sends orders to us very frequently, some times what customer wants is to ship items from 5 to 6 sales orders in a single shipment. it will be very nice if, zoho can implement this function, in which we can select items from other sales orders of the customer.
      • Webhooks and Integration

        Hey, I was looking to create automation using webhooks or something equivalent of a trigger based mechanism, to connect it as an integration. But I don't find any relevant APIs to setup these webhooks/notifcations for the "Zoho Books". Can anyone please
      • Zoho Books X Zoho Expense

        Hello there, Please can you tell me if it is possible to sync from Books to Expense? I much prefer the Expense reports to that of Books and the Credit Card feeds work via expense and not Books for me. However I find books is much better to deal with the
      • ABILITY TO LOG INTO CUSTOMER PORTAL

        I think it would be very helpful to have a button in Zoho Books to be able to see the customer portal so we can see what they see to help them navigate through the portal. Many times, the customer will call about the portal, but without visibility into
      • Sort, filter & save views for BOOKS PROJECTS

        Thanks for all the updates. Our firm uses the module for simple internal project accountancy. This means we do everything from the Projects Section but this isn't user friendly at all. You can't do anything with customized your own fields which basically
      • edit input format in custom field - sales order

        hi, I want to integrate a custom field (multi line text box) in our sales order. It needs to show upper case and lower case letters, numbers, spaces, hyphens and "/". What do I need to put in the custom format to configure these signs? Thanks, Tina
      • This transaction type cannot be matched with a line on the statement.

        When using the books API https://www.zohoapis.com/books/v3/banktransactions/uncategorized/${transaction.transaction_id}/match I get this error "This transaction type cannot be matched with a line on the statement." What I'm doing is for the uncategorized
      • Timesheets

        I wanted to create the timesheets remainder for our team mates who miss out the weekly timesheet entries. While creating the email templates, I couldn't see anything related to timesheets. Since it shows projects Can you help me find and build a one
      • Can we embed a Kanban Type of report using iframe too?

        I tried embedding a report as iFrame but it only appear as List View. It would be helpful if can also embed a Kanban Type of report.
      • Weekly Tips : Save Time with Saved Search

        Let's assume your work requires you to regularly check emails from important clients that have attachments and were sent within a specific time period. Instead of entering the same conditions every time—like sender, date range, and attachments included—you
      • Hidden Fields with Data Pre-Population and Notification Integration in Zoho Bookings Forms

        Dear Zoho Bookings Support Team, We'd like to propose a feature enhancement for Zoho Bookings forms that would improve data management and workflow efficiency: the ability to create hidden fields with pre-populated data. Current Functionality: Zoho Bookings
      • Tip #37 – How to ensure compliance and accountability using Advanced Session Audit – ‘Insider Insights’

        Hello Zoho Assist Community! This week we will be discussing how to strengthen your remote support operations with better visibility and control. Let’s say your support team handles a growing number of remote sessions each day. At the end of the week,
      • Replace an existing zoho show file with an uploaded one.

        For Zoho WorkDrive Upload API method, I have override-name-exist option, which I can use like this: curl https://www.zohoapis.eu/workdrive/api/v1/upload \ -F "filename=mypres.pptx" \ -F "parent_id=j3tzq1ae09c0cd91540df8d01670af05b657e" \ -F "override-name-exist=true"
      • Tip of the Week #66– Use internal comments to collaborate and resolve issues faster!

        Ever found yourself stuck on a customer query because you needed inputs from your teammate? Or sent a reply too soon and realized later that someone else on your team had a better context? When you rely on back-and-forth messages in external chats or
      • Using Zoho One to manage two (or more) businesses

        We are one company that operates two business, a scenario that Zoho One doesn't really seem to handle very well, and one which I can't imagine is at all unique to us! (It is basically designed to facilitate branding and use for one business only per subscription).
      • Skip order confirmation step in commerce?

        We have a store to sell products that are not shipped to a customer. Right now, when the order is placed, we have to manually 'confirm' the order so the sales order can convert to an invoice and charge the customer.  Is there a way to skip the manual
      • Free Shipping Coupon - Zoho Commerce

        I love the Zoho platform. Zoho Commerce is no exception; however, I'm struggling with a few common features I cannot find or are missing that I hope someone can help me with. Is there a way to create a coupon code for free shipping?
      • Is there a way to link an item to a liability account?

        I collect customer deposits for certain services and hold them in a liability account. However, Zoho Books doesn't let you create an item and assign it to a liability account so how do I create an invoice with an item that records it as a deposit into
      • Select a balance sheet account when creating an invoice

        Hi, it would be very helpfull to be able to select a balance sheet account when invoicing clients. We bill 30% of the job at signing and we would like to add to deferred revenues.  I have to create a transit revenue account and then tranfer to the right
      • How to work out commission in zoho commerce based on coupons

        HI There Is there any way to produce report based on coupon name in zoho commerce We need to pay commission to various channels who are helping us to increase the online sales so we have number dedicated coupons assigned to the above mentioned channels
      • Request for Subform Styling Feature in Zoho CRM Canvas

        Dear Zoho CRM Team, We have observed that in the Zoho CRM Canvas view, it is currently not possible to set presets or manage the styles of subform fields. Additionally, the ability to edit subform data directly within the Canvas view appears to be limited
      • How to Delete Old Tasks/Streams Assigned by Deactivated Users? 'Operation Not Permitted' Error

        Hello, I’m using Zoho Mail and have several old tasks assigned to me in Tasks and Streams. These tasks were created by former employees whose accounts are now deactivated. When I try to delete these tasks, I get an "Operation Not Permitted" error. These
      • Next Page