Ao se criar um Webform é possível gerar um PDF daquilo que foi preenchido, tanto pelo administrador da página quanto por aquela pessoa que o respondeu.

Para se gerar o PDF, primeiro é preciso saber como se criar um Webform. Para isso é preciso acessar o tutorial básico de Webform.

Após criar sua página.

Vá na aba ESTRUTURA e clique na opção WEBFORM:
Selecione o Webform já feito previamente. Neste caso, o nome usado aqui como exemplo é CRIANDO UM PDF DE UM WEBFORM:
Aperte na opção BUILD:
Aperte na opção ADD ELEMENT:
Digite no campo de texto PDF e selecione a opção ATTACHMENT PDF:
Salve esse processo em ADD ELEMENT:
Em seguida, irá abrir uma página no lado direito que deve ser preenchida. Em primeiro lugar, defina um Título (no exemplo, foi escolhido como título: FICHA) e na opção MODO DE VISUALIZAÇÃO assinale a opção TWIG TEMPLATE:
Conclua a operação clicando em SALVAR.
Depois, aperte em SAVE ELEMENTS.
Em seguida, clique na opção VER:
Preencha os campos e aperte em ENVIAR:
Clique na opção RESULTS:
Clique na opção PERSONALIZAR. Esta opção é uma forma de filtrar aquilo que você quer que apareça na sua tela, isso pode te ajudar a encontrar a página que deseja gerar o PDF com mais facilidade.
Selecione o TÍTULO que você escolheu para o elemento ATTACHMENT PDF. Nesse exemplo, deve-se selecionar a opção FICHA e clicar em SALVAR:
Surgirá uma coluna de links, onde irá te encaminhar para visualizar os Webform em formato de PDF.
Escolha aquele que desejar e clique no link que termina em .PDF:
Pronto, o PDF foi gerado.

COMO FORMATAR E EDITAR O PDF?

É possível editar seu PDF e transformá-lo da forma que você quiser. É possível, por exemplo, fazer uma ficha de inscrição, um certificado de algum curso, fazer uma lista de candidatos de um curso e etc. Além de poder inserir cores, negrito, itálico e quaisquer tipos de formação que desejar.

Modo para quem ENTENDE e SABE mexer em código-fonte/linguagem de programação:

Neste exemplo, será ensinado como colocar uma tabela e letras com cores diferentes no PDF.

Caso você entenda linguagem de programação, é só clicar no seu ATTACHMENT PDF (nesse exemplo é FICHA):
Irá abrir uma janela no lado direito e embaixo de MODO DE VISUALIZAÇÃO tem um espaço em branco que pode ser escrito. Deve-se usar a linguagem de código-fonte:

Para fins de exemplos, abaixo se encontra a versão completa da tabela e das edições (negrito e letras coloridas) em formato de código-fonte para ser usada como modelo:

<p class="text-align-center"><strong>Ficha de inscrição</strong></p>

<table border="1" cellpadding="1" cellspacing="1" style="width: 772px;">
   <tbody>
       <tr>
           <td style="width: 376px;">Nome</td>
           <td style="width: 383px;"> {{ data.nome}}</td>
       </tr>
       <tr>
           <td style="width: 376px;">
           <table class="table" style="width: 487px;">
               <tbody>
                   <tr>
                       <td style="width: 162px;">E-mail</td>
                   </tr>
               </tbody>
           </table>
           </td>
           <td style="width: 383px;"> {{ data.e_mail}}</td>
       </tr>
       <tr>
           <td style="width: 376px;">
           <table class="table" style="width: 487px;">
               <tbody>
                   <tr>
                       <td style="width: 162px;">Cidade de Nascimento</td>
                   </tr>
               </tbody>
           </table>
           </td>
           <td style="width: 383px;"> {{ data.cidade_de_nascimento}}</td>
       </tr>
   </tbody>
</table>

<p></p>

<p><strong>Deve-se trazer os seguintes documentos:</strong></p>

Pronto, com esse código foi possível gerar uma tabela no PDF:

Modo para quem NÃO entende e NÃO sabe mexer em código-fonte/linguagem de programação:

Neste exemplo, também será ensinado como colocar uma tabela e letras com cores diferentes no PDF.

Primeiro, crie uma página básica. Clique em CONTEÚDO:
Em seguida, clique ADICIONAR CONTEÚDO:
Clique em PÁGINA BÁSICA:
No campo de criação de texto, crie a forma que você quer que seu PDF seja.
Neste caso, será uma tabela e letras com cores diferentes:
Na região onde você quer que seja preenchido com as respostas dos Webform é importante que esteja em formato de código-fonte.
Para saber qual usar e como escrever, retorne em seu Webform e clique no título dado para seu ATTACHMENT PDF (nesse exemplo é FICHA) e na parte HELP USING TWIG há exemplos desses códigos que podem lhe auxiliar:
Em seguida, clique na opção CÓDIGO-FONTE na sua PÁGINA BÁSICA e copie todo o código que aparecer na caixa de edição:
Retorne ao seu Webform, clique no seu ATTACHMENT PDF (nesse exemplo é FICHA). Irá abrir uma janela no lado direito e embaixo de MODO DE VISUALIZAÇÃO tem um espaço em branco onde você deve colar o CÓDIGO-FONTE:
Pronto, agora é só gerar o PDF.

Como mandar um e-mail para pessoa que preencheu o seu Webform

O acesso ao PDF do Webform e editá-lo é só para o administrador da página, pois é o único que tem acesso a esses comandos. Porém, é possível que aquela pessoa que o preencheu receba por e-mail uma versão em PDF do que foi respondido.

Dentro do seu Webform, clique em CONFIGURAÇÕES:
Em seguida, clique em EMAILS/HANDLERS:
Clique em ADD EMAIL:
Irá surgir uma janela no lado direito da tela. Em TITLE escolha um título da sua preferência:
Na parte SEND TO, vá na opção TO EMAIL e assinale o item E-MAIL (E-MAIL):
Na parte MENSAGEM, vá na opção CORPO e assinale o item TWIG TEMPLATE:
Irá surgir dois campos que podem ser escritos. Na segunda caixa de escrever, escreva a mensagem que você quer que a pessoa que preencheu receba no e-mail:
Por fim, na parte de ATTACHMENTS, assinale a opção INCLUDE FILES AS ATTACHMENTS. Depois é só clicar em SALVAR.
Pronto, a pessoa receberá em PDF aquilo que respondeu.

Como colocar Cabeçalho no seu PDF?

É possível colocar no cabeçalho qualquer imagem que você queira. Tendo em vista que, é preciso somente ter um pouco de noção de linguagem de programação.

Suba para a plataforma a imagem que deseja colocar. Acesse o site https://drupal.fflch.usp.br/imce:
Dentro desse site é possível fazer o upload da imagem e deixar essa imagem guardada dentro do acervo do site. Basta escolher uma das pastas ou criar sua própria pasta e selecione a opção UPLOAD e clicar em ADD FILE:
Selecione a imagem nos arquivos do seu próprio computador e pronto, o upload já foi feito.
Atenção no URL que vai gerar, principalmente aquele que aparece depois da primeira parte após o URL padrão do site:
Em seguida, dentro da página do seu Webform, clique em CONFIGURAÇÕES:
Dentro da página de configurações, acesse a opção CONFIGURAÇÕES DE TERCEIROS:
Na parte embaixo de CABEÇALHO terá uma parte em branco que pode ser preenchida. É fundamental o uso da linguagem de código-fonte nesta etapa.

Escrava na linguagem de código-fonte a seu cabeçalho. Para fins de exemplos, abaixo se encontra a versão em código-fonte para ser usada como modelo. Perceba que foi usado a segunda parte daquele URL gerado quando se fez upload da imagem, para inserir a imagem no CABEÇALHO. Lembrando que, é possível editar esse modelo para qualquer imagem ou informação que você deseje.

<header>
<table style='width:100%'>
<tr>
<td style='width:20%'>
<img src='/sites/drupal.fflch.usp.br/files/images/logo.png' width='230px'/>
</td>
<td style='width:80%'>
<p align='center'><b>FACULDADE DE FILOSOFIA, LETRAS E CIÊNCIAS HUMANAS</b>
<br />Universidade de São Paulo<br />
Seção Técnica de Informática</p>
</td>
</tr>
</table>
<hr />
</header>

Clique em SALVAR:
Pronto, o cabeçalho foi criado.

Para maior compreensão, é possível assistir o tutorial em vídeo:

Links de passagem do livro para Gerando PDF com webform Drupal 8

‹ Drupal Webform: opção de rascunhos para usuários anônimos
Para cima
Manipulando Textos ›