Como desativar o efeito de deslocação nos erros de validação de campo

Você gostaria de impedir que o WPForms rolasse automaticamente para os erros de validação? Por padrão, quando um formulário tem erros - seja um formulário de página única ou um com quebras de página - o WPForms irá rolar até o primeiro campo de erro.

Este guia irá mostrar-lhe como desativar este efeito de deslocamento suave, fazendo com que a página salte diretamente para o erro.

Configurar o seu formulário

Primeiro, tem de criar o seu formulário e adicionar os seus campos. Se precisar de ajuda para criar um formulário, consulte o nosso guia sobre como criar o seu primeiro formulário.

Desativar efeitos de deslocação

Tem duas opções para desativar o efeito de deslocamento: para um formulário específico ou para todos os formulários do seu sítio. Vejamos os dois métodos.

Para um formulário específico

Se pretender desativar o efeito de deslocamento apenas para um formulário, utilize este fragmento de código. Se não tiver a certeza de como adicionar código personalizado ao seu site, consulte o nosso guia sobre como adicionar fragmentos 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 que substitui 1000 no código pela sua própria ID de formulário. Se precisar de ajuda para encontrar a ID do formulário, consulte o nosso guia sobre como encontrar IDs de formulários e campos.

Para todos os formulários

Se pretender que este código seja executado em todos os formulários, utilize este excerto 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 qualquer um dos snippets, quando ocorrer um erro de validação durante a submissão do formulário, a página saltará imediatamente para o primeiro erro em vez de se deslocar suavemente para lá. Isto cria uma experiência de feedback mais instantânea para os utilizadores que preferem a navegação direta à deslocação suave.

E é tudo o que precisa! Gostaria de alterar a velocidade de deslocação ao criar formulários de várias páginas? Consulte o nosso guia sobre como alterar a velocidade de deslocação em formulários de várias páginas para obter mais informações.

Ação de referência

wpforms_wp_footer_end