Como Alterar o Ícone de Pré-carga ao Submeter

Introdução

Gostaria de alterar o ícone de pré-carregamento nos seus WPForms? Existe um ícone de pré-carregamento padrão usado em todos os WPForms quando a configuração Ativar envio de formulário AJAX está ativada no seu formulário. Se desejar personalizar este ícone com o seu, precisará adicionar um pequeno trecho de PHP para o fazer. Neste tutorial, mostraremos como conseguir isto.

Criação do formulário

Primeiro, começaremos por criar o nosso formulário e adicionar os nossos campos.

Ativar AJAX nas configurações do formulário

Em seguida, precisará de se certificar de que ativa o AJAX. Para fazer isto, clique em Configurações e, em Geral, clique em Avançadas para abrir as opções avançadas e ative Ativar envio de formulário AJAX para ativar o AJAX.

Adição do trecho de código

Em seguida, precisará de copiar e colar este trecho no seu site. Se precisar de ajuda sobre como adicionar trechos ao seu site, consulte este tutorial

/**
 * Change the pre-loader icon
 *
 * @link https://wpforms.com/developers/how-to-change-the-pre-loader-icon-on-submit/
 */
 
function custom_wpforms_display_submit_spinner_src( $src, $form_data ) {
 
    // Enter the URL to the loading image in between the single quotes
    return 'http://yoursite.com/your-image.svg';

}

add_filter( 'wpforms_display_submit_spinner_src', 'custom_wpforms_display_submit_spinner_src', 10, 2 );

Adicionar este trecho alterará o URL de onde encontrar o ícone de carregamento.

E é tudo! Alterou com sucesso o ícone. Gostaria de aprender como posicionar a Descrição do campo acima do campo do formulário? Dê uma vista de olhos ao artigo em Como Posicionar a Descrição do Campo Acima do Campo do Formulário.

Relacionado

Referência do Filtro: wpforms_display_submit_spinner_src