Bastidores

O meta blog do Manual do Usuário

Correção da sensibilidade do botão/link “Responder” nos comentários do WordPress

11/7/2022

Em fevereiro de 2019, o WordPress 5.1 introduziu um novo comportamento na área de comentários. A partir dali, o botão/link “Responder” ficou mais… sensível.

Diferentemente de outros links, que só são ativados pelo toque depois que o usuário tira o dedo da tela, o “Responder” passou a ser ativado com o mero toque, o que não só não é algo esperado, como causa transtornos a quem acompanha a área de comentários pelo celular.

No último post livre, revelei estar trabalhando em um novo leiaute para o site e pedi opiniões do que está ruim e/ou pode ser melhorado no atual. A sensibilidade excessiva do link “Responder” foi o item mais citado. (O que me deixou orgulhoso, visto que o resto do leiaute parece ok à maioria!)

A falha do link “Responder” foi registrada no sistema de falhas do WordPress em 29 de março de 2019. E… ainda está lá. A última atualização é de meados de junho, uma automática, de outra falha, e só porque o Google agora orienta uma configuração distinta da que o WordPress vem entregando há três anos.

No debate da falha, o leitor André Gil propôs uma solução: um código JavaScript que altera o comportamento padrão do link “Responder” no WordPress.

Rodei o teste na nossa instalação de testes (como deve ser!) e… deu certo! Logo em seguida levei o código ao ambiente de produção e é isso, com menos de dez linhas de códigos, resolvemos (o André resolveu) a maior dor de cabeça dos nossos leitores que curtem comentar pelo celular.

Por que isso ainda não foi corrigido no WordPress? Não sei. Talvez alguém ali ache ok esse comportamento maluco. De qualquer forma, se você tem uma instalação WordPress também e quiser corrigir, basta colar este código no seu functions.php:

function fix_reply_link_comments() {  
	if ( have_comments() ) { ?>
		<script type="text/javascript">
			window.addEventListener('load', function() {
				document.getElementById('comments').addEventListener('touchstart', function(e) {
					if( e.target.className === 'comment-reply-link' ) {
						e.stopPropagation();
					}
				}, true);
			});
		</script>
	<?php } 
}
add_action('wp_footer', 'fix_reply_link_comments');