Add Custom CSS Code for Click to Chat plugin

/ docs / By

Introduction

The ‘Click to Chat’ plugin have various settings to customize the widget’s appearance and behavior. Many of these customizations can be done directly from the plugin settings panel, such as changing the button’s style, position, and text.

However, there may be times when the built-in settings do not cover the specific needs. In such cases, custom CSS provides a flexible solution. By adding your own CSS code, “The look and feel of the widget can be further modified to adjust its visual appearance on the website.”

You can add custom CSS directly from the plugin by navigating to Click to Chat → Other Settings → ‘Custom CSS’ section.

Example of Code

To Customize the Size of Greetings Close Button  

.ctc_greetings_close_btn svg {
    width: 25px !important;
    height: 25px !important;
    color: lightgray !important;
}

We are actively working on expanding our collection of custom CSS code examples. For any questions or support, feel free to contact us.