### [Mostrar todos os campos na sua mensagem de confirmação](https://wpforms.com/developers/how-to-show-all-fields-in-your-confirmation-message/)
**Publicado em:** 4 de agosto de 2020
**Autor:** David Ozokoye
**Resumo:** Gostaria de mostrar todos os campos do formulário preenchidos na sua mensagem de confirmação? Neste tutorial, mostraremos uma forma de conseguir isso.
**Conteúdo:**
Gostaria de mostrar todos os campos do formulário preenchidos na sua mensagem de confirmação? O WPForms inclui um campo de Pré-visualização de Entrada que permite aos utilizadores ver a sua entrada antes de ser submetida. No entanto, a Pré-visualização de Entrada não exibe atualmente quaisquer imagens carregadas na submissão.
Neste tutorial, mostraremos como exibir todos os campos na sua mensagem de confirmação usando um trecho de código PHP personalizado.
---
**Nota:** A versão 1.6.9 e superior do WPForms inclui o campo Pré-visualização de Entrada. Se desejar usar este campo em vez disso, certifique-se de consultar o nosso tutorial sobre [como usar o campo Pré-visualização de Entrada](https://wpforms.com/docs/how-to-show-entry-previews-in-wpforms/) para saber como.
## Criação do seu formulário
Primeiro, crie um novo formulário ou edite um existente para aceder ao construtor de formulários. No nosso formulário, adicionámos o campo **Upload de Ficheiro**, que pode aceitar até três imagens.
## Adicionar o Código PHP ao seu Site
Agora, é hora de adicionar o nosso trecho de código. Para obter ajuda sobre como e onde adicionar os seus trechos de código ao seu site, [por favor, reveja este tutorial](https://wpforms.com/developers/how-to-add-custom-php-or-javascript-for-wpforms/ "Como adicionar PHP ou JavaScript personalizado para WPForms").
```
/**
* Mostrar todos os campos na mensagem de confirmação
*
* @link https://wpforms.com/developers/how-to-show-all-fields-in-your-confirmation-message/
*/
function wpf_dev_frontend_confirmation_message( $message, $form_data, $fields, $entry_id ) {
// Executar apenas no meu formulário com ID = 1107
if ( absint( $form_data[ 'id' ] ) !== 1107 ) {
return $message;
}
// Campo de nome do formulário - ID #1
$name = $fields[ '1' ][ 'value' ];
// Campo de endereço do formulário - ID #2
$address = $fields[ '2' ][ 'value' ];
// Campo de telefone do formulário - ID #3
$phone = $fields[ '3' ][ 'value' ];
// Campo de email do formulário - ID #4
$email = $fields[ '4' ][ 'value' ];
// Campo de URL do site do formulário - ID #5
$website = $fields[ '5' ][ 'value' ];
// Campo de Opções de Cor do formulário - ID #6
$color_options = $fields[ '6' ][ 'value' ];
// Campo de Método de Entrega do formulário - ID #7
$delivery_method = $fields[ '7' ][ 'value' ];
// Campo de Instruções Especiais do formulário - ID #9
$special_instructions = $fields[ '9' ][ 'value' ];
// Campo de Upload Moderno do formulário - ID #8
$field_id = 8;
$images = '';
if ( is_array( $fields[ $field_id ][ 'value_raw' ] ) ) {
foreach ( $fields[ $field_id ][ 'value_raw' ] as $value_raw ) {
$images .= '';
}
}
$message = "Esta é a informação que capturamos da sua submissão. Por favor, visite esta página para informações da conta.
Nome: $name
Endereço: $address
Número de Telefone: $phone
Endereço de Email: $email
Website: $website
Opções de Cor: $color_options
Método de Entrega: $delivery_method
Alguma Instrução Especial: $special_instructions
As imagens que carregou são:";
return $message . '' . $images . '';
}
add_filter( 'wpforms_frontend_confirmation_message', 'wpf_dev_frontend_confirmation_message', 10, 4 );
```
No código acima, estamos a direcionar o ID do formulário **1107**, e depois vamos mapear cada número de ID de campo para uma variável que criamos. Por exemplo, o campo Nome no nosso formulário é o ID de campo 1. Então, criámos uma variável chamada `$name` e usamos o sinal de igual (=) para definir esse valor para essa variável em particular.
Precisa apenas de se certificar de que criou nomes de variáveis que façam sentido para si e mapeá-los para os seus IDs de campo.
Se precisar de ajuda para encontrar o ID do seu formulário ou campo, [por favor, reveja este tutorial](https://wpforms.com/developers/how-to-locate-form-id-and-field-id/ "Como localizar o ID do formulário e o ID do campo").
Outro exemplo é que estamos a usar o campo de Upload de Ficheiro Moderno. Como sabemos que os utilizadores podem carregar mais de uma imagem dependendo das nossas configurações, queremos ter a certeza de que percorremos todas as imagens carregadas para as exibir na mensagem de confirmação.
Então, criámos uma instrução `if` PHP para percorrer cada imagem que foi carregada para exibir cada imagem dentro da mensagem de confirmação.
**Nota:** Para saber mais sobre instruções `if` PHP, consulte o [manual oficial do PHP.net sobre a estrutura de instruções if](https://www.php.net/manual/en/control-structures.if.php).
## Estilização da Pré-visualização de Entrada com CSS Personalizado (opcional)
Este passo é completamente opcional, mas como adicionámos algum HTML às nossas imagens dentro da instrução if. Adicionaremos algum estilo para garantir que as imagens não pareçam muito grandes na nossa mensagem de confirmação, mas ainda assim sejam exibidas de forma organizada.
Para adicionar CSS personalizado ao seu site, [por favor, reveja este tutorial](https://wpforms.com/developers/how-to-add-custom-css-styles-for-wpforms/ "Como adicionar estilos CSS personalizados para WPForms").
```
.image_container {
height: 250px;
max-width: 25%;
display: inline-block;
}
.image_container img {
float: left;
display: inline-block;
}
.small {
max-width:150px;
padding: 10px;
}
```
## Mostrar todos os campos na mensagem de confirmação
É hora de juntar tudo. Após criar o seu formulário e adicionar o seu trecho de código personalizado, é hora de ver o que o seu trecho de código adicionou para si. Teste o seu formulário submetendo algumas entradas para ver como todos os campos são exibidos na sua confirmação.
É isso! Criou com sucesso uma forma de mostrar todos os campos na mensagem de confirmação!
Em seguida, gostaria de remover o estilo da mensagem de confirmação, como remover a cor de fundo? Dê uma vista de olhos ao nosso artigo sobre [personalização do estilo da caixa de mensagem de confirmação](https://wpforms.com/developers/how-to-remove-confirmation-message-box-styling/ "Como remover o estilo da caixa de mensagem de confirmação").
## Relacionado
Referência de Filtro: [wpforms\_frontend\_confirmation\_message](https://wpforms.com/developers/wpforms_frontend_confirmation_message/ "Usando o filtro wpforms_frontend_confirmation_message")
**Categorias:** Tutoriais
**Tags:** PHP
---