Construtor de Links de Campanha UTM grátis

Como funciona

O construtor UTM monta URLs de rastreio inteiramente no navegador usando as APIs padrão URL e URLSearchParams — sem servidor, sem envio. Enquanto escreve, um hook useMemo ao vivo analisa o seu URL base, valida o nome de host, e anexa apenas os parâmetros UTM que preencheu.

1. 1
   Análise e validação de URL

   O seu URL base é alimentado ao construtor URL integrado do navegador. A ferramenta antepõe automaticamente https:// se nenhum esquema estiver presente, depois verifica que o nome de host contém pelo menos um ponto (ou é localhost) — rejeitando prosa livre antes de poder corromper a saída.
2. 2
   Parâmetros UTM anexados via URLSearchParams

   Cada campo preenchido (source, medium, campaign, term, content) é escrito no objeto de parâmetros de pesquisa do URL com URLSearchParams.set(). Se o alternador de minúsculas estiver ativado, os valores são colocados em minúsculas neste ponto, o que evita atribuição incompatível causada por inconsistências de capitalização.
3. 3
   Código QR renderizado pela biblioteca qrcode

   Sempre que o URL final muda, a biblioteca qrcode renderiza um URL de dados de 256px para a pré-visualização inline e simultaneamente desenha uma versão de 1024px em um canvas fora da tela. O canvas é depois serializado para um Blob PNG via canvas.toBlob() para que o botão de download possa salvá-lo sincronamente — necessário no iOS, onde a criação assíncrona de Blob dentro de um manipulador de clique é bloqueada.
4. 4
   Modelo compartilhável via o hash da página

   O estado do formulário (URL base mais quaisquer valores UTM) é continuamente codificado no fragmento de URL da página usando window.history.replaceState. Qualquer pessoa que abra esse URL com hash obtém o formulário pré-preenchido, para poder salvar ou compartilhar um modelo de campanha sem qualquer armazenamento do lado do servidor.

Ferramentas relacionadas