Você gostaria de criar um formulário de questionário usando o WPForms? Usando os campos de pagamento, você pode criar facilmente um formulário de questionário que rastreia a pontuação total do questionário. Neste tutorial, mostraremos como você pode fazer isso facilmente usando campos de pagamento.
Criação do formulário de questionário
Vamos começar criando um novo formulário. Em nosso formulário, adicionaremos os campos de formulário Nome e E-mail no início do formulário. Em seguida, usando Page Breaks, dividiremos o questionário em 6 categorias. Em cada quebra de página, teremos o título da página exibindo a categoria em que os participantes do questionário estão no momento.
Para obter ajuda na criação de seu formulário, consulte este guia.
Fazer perguntas de questionário
Para esta documentação, usaremos os campos Multiple Items (Vários itens ) na seção Payment Fields (Campos de pagamento ) no construtor de formulários para fazer a pergunta do questionário e alterar os rótulos, fornecendo 3 respostas para cada pergunta. Para a resposta correta, coloque 1,00 para a resposta correta e 0,00 para as respostas incorretas.
Continue fazendo isso em suas perguntas e categorias. Cada pergunta deve ter uma resposta com 1,00 para a resposta correta e 0,00 para as respostas incorretas. Usaremos o valor para obter um total acumulado para cada resposta correta.
Hora de totalizar as respostas
Agora, queremos rastrear o número total de pontos para cada resposta correta. Para isso, na parte inferior do formulário, adicionaremos um campo Total. No entanto, daremos a esse campo uma classe CSS na guia Advanced para que possamos mantê-lo oculto até que o formulário seja enviado.
Depois de salvar o formulário, você deverá adicionar o CSS necessário para ocultar esse campo. Copie esse CSS para seu site. Se precisar de ajuda para descobrir como e onde adicionar CSS personalizado, consulte este tutorial.
.hide-field {display: none;}
Criação da lógica do questionário
Agora, é hora de adicionar o snippet que reunirá tudo isso. Queremos exibir uma mensagem de confirmação personalizada que exibirá uma mensagem de agradecimento com o nome dos participantes do quiz e fornecerá a eles uma pontuação total. Como não queremos nenhum símbolo de moeda ou valor em dólar nesse total, usaremos um snippet personalizado que criará nossa mensagem de confirmação personalizada.
Copie e cole esse snippet em seu site. Se precisar de ajuda para saber como e onde adicionar snippets, consulte este útil tutorial.
/**
* Display a custom confirmation message for our pub quiz.
*
* @link https://wpforms.com/developers/how-to-create-a-quiz-form/
*/
function wpf_dev_quiz_custom_confirmation_message( $message, $form_data, $fields, $entry_id ) {
// Only run on my form with ID = 3221
if ( absint( $form_data[ 'id' ] ) !== 3221 ) {
return $message;
}
// Get the name of the person who completed this form
$contact_name = $fields[ '1' ][ 'value' ];
// Get the points from the total field (field ID '7') to remove any decimals and currency symbols
$points_scored = $fields[ '7' ][ 'value' ];
// Remove white space and currency symbol
list($points_scored) = explode('.', $points_scored);
$points_scored = substr($points_scored, 5);
// Add the name and points scored to the message
$message = __('Thanks ' . $contact_name . ' you scored ' . $points_scored . ' out of a possible 35 points', 'plugin-domain');
return $message;
}
add_filter( 'wpforms_frontend_confirmation_message', 'wpf_dev_quiz_custom_confirmation_message', 10, 4 );
Esse snippet será executado somente no formulário ID 3221. Ele pegará o nome do usuário do nosso campo Nome no campo ID 1 para que possa ser exibido em nossa mensagem de confirmação personalizada. Em seguida, esse snippet pegará o valor do campo Total do formulário, que é o campo ID 7, removerá o símbolo de moeda e o espaço em branco e converterá o que restar em um número inteiro para que não haja um ponto decimal ou zeros.
Você precisará atualizar cada um desses IDs para que correspondam aos seus próprios IDs de formulário e campo. Para encontrar seus próprios números de ID, consulte esta documentação.
Não há necessidade de adicionar nada à guia Confirmações, pois a mensagem em nosso snippet é a mensagem que os usuários verão quando concluírem o teste. Certifique-se de atualizar essa mensagem para que corresponda ao que você precisa para seu questionário.
Agora, quando os usuários chegarem ao final do questionário, eles clicarão em Enviar e poderão ver imediatamente quantas respostas acertaram.
E é isso! Você gostaria que o formulário fosse enviado automaticamente com base no valor de um dos campos do formulário? Confira nosso tutorial sobre Como enviar automaticamente um formulário com uma opção de campo.