Remove Tawk.to Branding (2022)

removing_script.js

var removeBranding = function() {
    try {
        var element = document.querySelector("iframe[title*=chat]:nth-child(2)").contentDocument.querySelector(`a[class*=tawk-branding]`)

        if (element) {
            element.remove()
        }
    } catch (e) {}
}

var tick = 100

setInterval(removeBranding, tick)

worked fine for me, thenks

sometime works perfectly, some time throw error... any ideas? thanks.

working in 2023 latest version

Worked For Me!

Create a JavaScript file:
Create a new JavaScript file, for example, custom-script.js, and paste the above code into this file.

Upload the JavaScript file:
Upload the JavaScript file to your theme directory or another appropriate location in your WordPress installation.

Enqueue the script in your theme's functions.php:
Open your theme's functions.php file and add the following code to enqueue your script:

functions.php - code

function enqueue_custom_script() {
    wp_enqueue_script('custom-script', get_template_directory_uri() . '/path/to/custom-script.js', array(), '1.0', true);
}
add_action('wp_enqueue_scripts', 'enqueue_custom_script');

Make sure to replace /path/to/custom-script.js with the actual path to your JavaScript file.

Save and update:
Save the changes to your functions.php file and update your WordPress theme.

Now, your JavaScript code will be included and executed on the client side when the website is loaded.

not working properly in 0.8.2 plugin (2024 verison), sometimes the layout of the chat interface is offset, and can not show chat window properly.

Instead of removing a node, you can inject some CSS to change the widget appearance, such as:

const style = document.createElement('style');
style.textContent = 'a.tawk-branding {display:none;}';
document.querySelector('iframe[title*="chat"]:nth-child(2)').contentDocument.head.appendChild(style);

Please provide new tawk brand removing code because previous code not working..

Below mentioned script not working currently.

var removeBranding = function() {
try {
var element = document.querySelector("iframe[title*=chat]:nth-child(2)").contentDocument.querySelector(a[class*=tawk-branding])

    if (element) {
        element.remove()
    }
} catch (e) {}

}

var tick = 100

setInterval(removeBranding, tick)

var removeBranding = function() {
try {
const style = document.createElement('style');
style.textContent = '.tawk-padding-small {display:none !important;}';
document.querySelector('iframe[title*="chat"]:nth-child(2)').contentDocument.head.appendChild(style)
} catch (e) {}
}

var tick = 100

setInterval(removeBranding, tick)

2025 new tawk remove logo

How we can achieve this is next js website bro please help me.

Perfect @enkiark
Worked for me.

hello all of you guys, here is how you remove all the brandings whether outside chat or inside chat widget for tawk.io

For React/Next.js

"use client";

import { useEffect } from "react";

export default function HideTawkBranding() {
    useEffect(() => {
        const hideBranding = (iframe: HTMLIFrameElement) => {
            try {
                const doc = iframe.contentDocument;
                const link = doc?.querySelector(
                    "a[href*='tawk.to']"
                ) as HTMLElement | null;

                if (link) {
                    link.style.setProperty("display", "none", "important");
                }
            } catch {
                // cross-origin iframe → expected
            }
        };

        const scanIframes = () => {
            document
                .querySelectorAll("iframe[title*='chat']")
                .forEach((iframe) => {
                    console.log("I am here ",)
                    hideBranding(iframe as HTMLIFrameElement)
                });
        };

        // initial scan
        scanIframes();

        // watch for new iframes
        const observer = new MutationObserver(scanIframes);
        observer.observe(document.body, {
            childList: true,
            subtree: true,
        });

        return () => observer.disconnect();
    }, []);

    return null;
}

Import this above component in root of your react/Next js.

And for plain JS:

// hide-tawk-branding.js
(function() {
  const processedIframes = new WeakSet();
  const retryTimeouts = new Map();

  const injectHideStyles = (iframe) => {
    try {
      const doc = iframe.contentDocument;
      if (!doc) {
        // Retry once after 2s if iframe not ready
        if (!retryTimeouts.has(iframe)) {
          const timeout = setTimeout(() => {
            retryTimeouts.delete(iframe);
            injectHideStyles(iframe);
          }, 2000);
          retryTimeouts.set(iframe, timeout);
        }
        return;
      }

      // Skip if already injected
      if (doc.getElementById("hide-tawk-branding")) return;

      const style = doc.createElement("style");
      style.id = "hide-tawk-branding";
      style.textContent = "a[href*='tawk.to']{display:none!important}";
      doc.head.appendChild(style);
    } catch {
      // Silently fail on cross-origin errors
    }
  };

  const handleIframe = (iframe) => {
    // Skip if already processed
    if (processedIframes.has(iframe)) return;

    const title = iframe.title;
    if (title && title.toLowerCase().includes("chat")) {
      processedIframes.add(iframe);
      injectHideStyles(iframe);
    }
  };

  // Process existing iframes
  document.querySelectorAll("iframe[title*='chat' i]").forEach(handleIframe);

  // Watch for new iframes
  const observer = new MutationObserver((mutations) => {
    for (const mutation of mutations) {
      for (const node of mutation.addedNodes) {
        if (node.nodeName === "IFRAME") {
          handleIframe(node);
          continue;
        }
        
        if (node.nodeType === 1) {
          const iframes = node.querySelectorAll("iframe[title*='chat' i]");
          if (iframes.length) {
            iframes.forEach(handleIframe);
          }
        }
      }
    }
  });

  observer.observe(document.body, {
    childList: true,
    subtree: true,
  });

  // Cleanup on page unload
  window.addEventListener("beforeunload", () => {
    observer.disconnect();
    retryTimeouts.forEach(clearTimeout);
    retryTimeouts.clear();
  });
})();