Change SMS tab to Whatsapp QR

4 min

Introduction

This customization updates the GoHighLevel Conversations UI by replacing the label “SMS” with “WhatsApp QR” in two places:

The main channel tab label in the composer.

The provider/channel selection popover.

This improves internal clarity by ensuring users immediately understand that messages are being sent via WhatsApp (QR channel) rather than traditional SMS.

Installation

In GoHighLevel, go to:

Settings → Company → Custom JavaScript

Paste the script below into the Custom JavaScript field and click Save.

Script

<script>
(function() {
  function trocarTexto() {
    // Selector 1 - Tab principal
    const smsTab = document.querySelector('#composer-textarea > div > div.flex.flex-col.flex-1.min-w-0.h-full.rounded-md.border-none > div.flex.flex-row.py-1.items-center.justify-end.rounded-t-lg.\\!h-\\[32px\\].bg-gray-50 > div.flex.gap-6.items-center.w-full > div > span');
    if (smsTab && smsTab.innerText.trim() === 'SMS') {
      smsTab.innerText = 'WhatsApp QR';
    }

    // Selector 2 - Popover
    const smsPopover = document.querySelector('#provider-select-popover > div.hr-popover__content > div > div > div.flex.items-center.justify-between.py-2.px-2.cursor-pointer.transition-colors.duration-150.hover\\:bg-gray-50.bg-blue-50 > div > div');
    if (smsPopover && smsPopover.innerText.trim() === 'SMS') {
      smsPopover.innerText = 'WhatsApp QR';
    }
  }

  // Primero intenta de inmediato
  trocarTexto();

  // Observa cambios en el DOM
  const observer = new MutationObserver(() => {
    trocarTexto();
  });

  observer.observe(document.body, {
    childList: true,
    subtree: true
  });
})();
</script>

Validation / Testing

After saving the script:

Open Conversations in GoHighLevel.

Select any contact with an active messaging thread.

Confirm:

The SMS label now appears as WhatsApp QR in the composer tab.

The provider/channel popover also shows WhatsApp QR instead of SMS.

Navigate between contacts and reload the page to confirm persistence.

Notes / Operational Considerations

This is a UI-only change. It does not change routing, providers, deliverability, or message type.

The script uses specific CSS selectors; if GoHighLevel updates their UI structure, the selectors may break and require updates.

The MutationObserver is necessary because GHL re-renders components dynamically.