Gostaria de impedir que o WPForms role automaticamente para os erros de validação? Por padrão, quando um formulário apresenta erros - seja um formulário de página única ou um formulário com quebras de página - o WPForms rola a tela até o primeiro campo de erro.
Este guia mostrará como desativar esse efeito de rolagem suave, fazendo com que a página salte diretamente para o erro.
Configuração de seu formulário
Primeiro, você precisará criar seu formulário e adicionar seus campos. Se precisar de ajuda para criar um formulário, consulte nosso guia sobre como criar seu primeiro formulário.
Desativação de efeitos de rolagem
Você tem duas opções para desativar o efeito de rolagem: para um formulário específico ou para todos os formulários do seu site. Vamos dar uma olhada nos dois métodos.
Para um formulário específico
Se você quiser desativar o efeito de rolagem para apenas um formulário, use este trecho de código. Se não tiver certeza de como adicionar código personalizado ao seu site, consulte nosso guia sobre como adicionar trechos de código.
/** Disable the scroll on field validation errors
*
* @link https://wpforms.com/developers/how-to-disable-the-scrolling-effect-on-field-validation/
*/
function wpf_dev_disable_scroll_to_error_by_form_id( $forms ) {
// If scrollToError is disabled for at least one form on the page, it will be disabled for all the forms on the page.
foreach ( $forms as $form ) {
// Only run snippet on the form ID 1000
if ( isset( $form[ 'id' ] ) && (int) $form[ 'id' ] === 1000 ) {
?>
<script type="text/javascript">wpforms.scrollToError = function(){};</script>
<?php
}
}
}
add_action( 'wpforms_wp_footer_end', 'wpf_dev_disable_scroll_to_error_by_form_id', 10, 1 );
Certifique-se de substituir 1000 no código por seu próprio ID de formulário. Se precisar de ajuda para encontrar o ID do formulário, consulte nosso guia sobre como encontrar IDs de formulários e campos.
Para todos os formulários
Se você quiser que esse código seja executado em todos os formulários, use este snippet mais simples.
/** Disable the scrolling effect on field validation errors
*
* @link https://wpforms.com/developers/how-to-disable-the-scrolling-effect-on-field-validation/
*/
function wpf_dev_disable_scroll_to_error() {
// If scrollToError is disabled for at least one form on the page, it will be disabled for all the forms on the page.
?>
<script type="text/javascript">wpforms.scrollToError = function(){};</script>
<?php
}
add_action( 'wpforms_wp_footer_end', 'wpf_dev_disable_scroll_to_error', 10 );
Depois de adicionar um desses snippets, quando ocorrer um erro de validação durante o envio do formulário, a página saltará imediatamente para o primeiro erro em vez de rolar suavemente até ele. Isso cria uma experiência de feedback mais instantânea para os usuários que preferem a navegação direta à rolagem suave.
E isso é tudo o que você precisa! Gostaria de alterar a velocidade da rolagem ao criar formulários de várias páginas? Confira nosso guia sobre como alterar a velocidade de rolagem em formulários de várias páginas para obter detalhes.