04 - Certificados

Instrutor Fornecedor

🔑 Quem pode acessar: Equipe interna com permissão de criação de conteúdo 📍 Onde encontrar: Área do Fornecedor → Certificados

Objetivo

Este artigo explica como um certificado é montado, sua principal limitação prática, os dados dinâmicos disponíveis (short codes) e as regras institucionais para o uso do certificado.

Pré-requisitos

Ter perfil de credenciada ou de equipe interna com acesso à Área do Fornecedor.
Recomendado: ter lido Configurações Gerais do Curso.

Onde cada coisa é configurada

Existem dois lugares diferentes envolvidos, e vale não confundi-los:

O que	Onde
Criar/editar o certificado (o arquivo/template em si)	Área do Fornecedor → Certificados (tela própria, com o mesmo padrão de listagem de Cursos/Testes: abas Todos/Meu/Publicados, filtros, busca)
Vincular um certificado ao curso	Dentro do curso → Configurações (ver Configurações Gerais do Curso)
Vincular um certificado a um teste específico	Dentro do teste → Configurações → campo "Certificado Teste" (ver Testes e Quizzes)

A listagem de Certificados tem uma coluna "Usado em" que mostra, separadamente, quantos Cursos e quantos Testes usam aquele certificado — confirmação visual direta de que um mesmo certificado pode estar vinculado a um Teste sem estar vinculado ao Curso como um todo.

Como um certificado é criado

A tela de edição de um certificado segue o mesmo padrão de posts do WordPress: Título, Link permanente/Slug (editável separadamente), painel Publicar (Status, Visibilidade, Revisões, data de publicação — mesmo sistema de revisões já visto em Configurações Iniciais), Autor, e Imagem destacada — é essa imagem destacada que serve de fundo/arte do certificado.

Diferença importante em relação ao conteúdo de curso/lição: o editor de certificado abre por padrão na aba Código (HTML puro, com barra de tags rápidas: /b, i, link, b-quote etc.), não no editor de blocos visual. Isso é esperado — a montagem do certificado é feita com HTML/CSS e shortcodes por cima da imagem de fundo, não com blocos.

Opções de Certificado do Educational Module

Campo	Opções
Tamanho da Página PDF	Carta/US Letter (padrão) ou A4
Orientação da Página PDF	Paisagem (padrão) ou Retrato

⚠️ Principal limitação: a visualização do certificado no editor não corresponde fielmente ao resultado final em PDF. É necessário testar gerando o PDF de fato (concluindo um curso de teste) e ajustar o HTML/CSS até o resultado ficar correto. Esse processo de tentativa e erro é a etapa mais trabalhosa da configuração de um certificado — e vale também para outras plataformas concorrentes, não é uma limitação exclusiva desta.

Como testar sem afetar alunos reais: crie um curso específico de teste, associe o certificado a ele, conclua o curso com seu próprio usuário e revise o PDF gerado.

Regras de ouro para escrever o código do certificado

O renderizador do certificado é o TCPDF (identificável pelo rodapé "Powered by TCPDF" que aparece no PDF gerado) — um motor de HTML→PDF com suporte a CSS bem mais limitado do que um navegador. As regras abaixo vieram de testes reais, não de suposição:

Regra	O que acontece se não seguir
Nunca use `position:absolute`	O TCPDF ignora — os elementos aparecem empilhados na ordem do código-fonte, não nas coordenadas definidas
Para colunas lado a lado, evite `<table>` aninhada dentro de célula	O conteúdo das colunas colide/sobrepõe, mesmo com largura definida em % ou em pt
Evite a tag `<hr>`	Em teste, causou uma página extra em branco — comportamento inesperado, possivelmente ligado a quebra de página
Mantenha o conteúdo compacto — mas não em excesso	A área real de texto utilizável é menor do que a moldura visual do fundo sugere. Ao mesmo tempo, espaçadores grandes (testamos até `padding-top:24pt`) não eram necessários — `<p style="line-height:1pt;"> </p>` como espaçador mínimo já é suficiente na prática
Não use comentários HTML (`<!-- -->`) no código final, ou mantenha bem curtos se usar	Comentários longos parecem contar para o cálculo de altura da página — um certificado já no limite pode transbordar só por causa de um comentário grande
Sempre teste gerando o PDF de verdade	O preview do editor não reflete o resultado final (ver limitação principal, acima)

Essas regras foram descobertas isolando uma variável por vez, ao longo de várias rodadas de teste em um certificado real. Guarde o código de referência já validado (sem comentários) separado de qualquer versão comentada/explicada — misturar os dois foi o que causou o problema do comentário.

✅ Atualização confirmada: a técnica oficial de <p> + <p style="line-height:Npt;"> </p> como espaçador (ver seção seguinte) foi testada com sucesso e é a técnica usada no modelo de referência atual — substituiu a estrutura de <table> que tínhamos usado nas versões anteriores.

Boas práticas de estilo (confirmadas na prática)

A documentação oficial do LearnDash recomenda uma técnica de espaçamento diferente da que usávamos nas primeiras versões — e ela foi testada e confirmada, virando a base do modelo atual:

Técnica	Como funciona
`<p>` em vez de `<table>`	Cada linha de conteúdo é um parágrafo centralizado (`align="center"` + `text-align:center` juntos, por segurança), em vez de uma linha de tabela
Espaçamento vertical via parágrafo vazio	`<p style="line-height:1pt;"> </p>` entre blocos de conteúdo — um espaçador bem menor do que os `padding-top` que tínhamos usado antes, e que já é suficiente
Indentação horizontal	`text-indent:200px;` empurra o conteúdo a partir da margem esquerda — útil para posicionar algo num canto específico, caso necessário no futuro

⚠️ Sobre fonte: a documentação recomenda usar apenas as famílias genéricas serif ou sans-serif como uma segurança geral. O modelo atual usa 'CAIXAStd', sans-serif — o sans-serif já está incluído como reserva caso a fonte da marca não esteja instalada no servidor. Testado e confirmado no PDF real.

A própria documentação reconhece que o valor de espaçamento em pixel/ponto "requer tentativa e erro" porque o certificado final é medido em polegadas, não pixels — ou seja, o processo de ajuste fino que passamos ao longo de várias rodadas de teste não foi um problema nosso, é uma característica conhecida de como certificados LearnDash funcionam. O achado principal: os espaçadores podem ser bem menores do que parece necessário à primeira vista.

Modelo de referência (testado e confirmado)

Este é o modelo atual, testado em PDF real e confirmado — uma única página, sem colisão de conteúdo, com os shortcodes de curso e instrutor validados.

Imagem de fundo

Arquivo: modelo_certificado_fundo.jpg (2200 × 1700 px, Carta paisagem). Moldura dupla (azul + dourado), detalhe geométrico nos quatro cantos, logo completo da Universidade CAIXA no topo e a marca "UC" como marca d'água central, em tom único e baixa opacidade — os dois logos foram recortados (fundo removido) para se integrarem ao fundo sem gerar caixa/retângulo visível. Nenhum texto está embutido na imagem além do logo — todo o conteúdo textual vem do código HTML, exatamente para evitar qualquer risco de desalinhamento entre imagem e texto (o mesmo tipo de problema que resolvemos na Capa e na Imagem Destacada, só que aqui a solução foi não depender de posição de imagem alguma). Deve ser definida como Imagem Destacada do certificado.

⚠️ Restrição oficial do LearnDash: a imagem destacada do certificado precisa ser .jpg, no máximo 1 MB.

O tamanho da imagem deve corresponder exatamente ao tamanho/orientação de página escolhidos (Carta ou A4), e para qualidade de impressão a documentação recomenda 300 DPI — a nossa está em 200 DPI; se o certificado for impresso (não só visualizado em tela), vale gerar uma versão em resolução mais alta.

Mapa de campos

Campo no certificado	Tipo	Origem
"CERTIFICADO DE CONCLUSÃO"	Fixo	Texto
"Certificamos que"	Fixo	Texto
Nome do participante	Dinâmico	`[usermeta field="first_name"] [usermeta field="last_name"]`
"Concluiu com aproveitamento o curso:"	Fixo	Texto
Nome do curso	Dinâmico	`[courseinfo show="course_title"]`
Carga horária	Dinâmico (confirmado)	`[carga_horaria]`
Data de conclusão	Dinâmico	`[courseinfo show="completed_on" format="d/m/Y"]`

✅ Testado e confirmado em PDF real — todos os campos acima renderizaram corretamente, em uma única página, sem colisão.

Código de referência (testado e confirmado)

<p align="center" style="text-align:center; font-family:'CAIXAStd', sans-serif; font-weight:bold; font-size:22pt; color:#005CA9;">CERTIFICADO DE CONCLUSÃO</p>
<p align="center" style="text-align:center; font-size:12pt; color:#3C3C3C;">Certificamos que</p>
<p align="center" style="text-align:center; font-family:'CAIXAStd', sans-serif; font-weight:bold; font-size:16pt; color:#005CA9;">[usermeta field="first_name"] [usermeta field="last_name"]</p>
<p style="line-height:1pt;">&nbsp;</p>
<p align="center" style="text-align:center; font-size:12pt; color:#3C3C3C;">Concluiu com aproveitamento o curso:</p>
<p align="center" style="text-align:center; font-size:16pt; font-weight:bold; color:#005CA9;">[courseinfo show="course_title"]</p>
<p align="center" style="text-align:center; font-size:12pt; color:#3C3C3C;">Com carga horária de [carga_horaria], concluído em [courseinfo show="completed_on" format="d/m/Y"]</p>
<p style="line-height:1pt;">&nbsp;</p>

⚠️ Sobre a fonte: 'CAIXAStd', sans-serif só vai aparecer de fato no PDF se essa fonte estiver instalada/embutida no servidor que roda o TCPDF. O sans-serif funciona como reserva automática caso não esteja. Testado e confirmado no PDF real desta versão.

⚠️ Este código não tem comentários de propósito — cole exatamente assim no campo de código do certificado. Se quiser entender o que cada linha faz, consulte a tabela "Mapa de campos" acima (não adicione comentários  de volta no código real; ver Regras de ouro).

Alternativa ao HTML

Existe a opção de utilização de CSS:

CSS customizado global — em Certificados → aba Configurações → seção "Custom Styles (CSS)", é possível cadastrar um CSS que se aplica a todos os certificados de uma vez, permitindo usar classes (.nome-aluno { font-size:15pt; }) em vez de repetir style="" em cada linha. Importante: essa opção só funciona no método "clássico" que estamos usando (código HTML).

Arquivos de apoio

Arquivo	Para que serve
`modelo_certificado_fundo.jpg`	Imagem Destacada do certificado (com logos reais)
`certificado-final.html`	O código de referência acima, em arquivo — cole exatamente como está
`certificado-modelo-guia.html`	Estrutura anterior (baseada em tabela), comentada campo a campo — só para leitura/estudo, nunca para colar

Shortcodes (tags dinâmicas)

O certificado usa shortcodes para exibir dados dinâmicos do aluno, do curso ou do teste. Existem quatro famílias principais:

Shortcode	Para que serve
`[usermeta]`	Dados do aluno — nome, sobrenome, nome de exibição, e-mail, ID de usuário etc.
`[courseinfo]`	Dados do curso — título, pontuação, data de matrícula/conclusão, tempo gasto etc. (só funciona em certificado vinculado a um curso)
`[quizinfo]`	Dados do teste — pontuação, número de perguntas, nota mínima, data de conclusão etc. (só funciona em certificado vinculado a um teste)
`[groupinfo]`	Dados de grupo/turma — título, contagem de participantes, progresso etc. (só funciona em certificado vinculado a um grupo, recurso ainda não habilitado na Caixa)

Todos os shortcodes disponíveis também ficam listados dentro da própria plataforma: aba Shortcodes, ao lado de "Certificados" e "Configurações" no topo da tela. Para a lista completa de parâmetros de cada família, consulte a documentação oficial de shortcodes de certificado.

É possível customizar os rótulos exibidos — por exemplo, "carga horária" em português não é nativo da ferramenta; foi personalizado para atender ao requisito local.

Sobre o uso institucional do certificado

⚠️ Importante: a Caixa não tem autoridade para certificar conhecimento técnico de alguém, como faria uma instituição certificadora. No contexto interno, o certificado serve principalmente para comprovar presença/participação em uma ação de capacitação (com carga horária) — por exemplo, para fins trabalhistas (acordo coletivo de horas de capacitação) ou exigências regulatórias específicas (ex.: CIPA, cursos do Conselho de Contabilidade).

Recomendação: evite termos como "aprovado" no certificado, exceto nos poucos casos em que a legislação realmente exige atestar aprovação em avaliação de conhecimento. Em caso de dúvida sobre qual redação usar em um certificado específico, confirme com a equipe responsável antes de publicar.

Resultado esperado

Ao final da leitura deste artigo, o instrutor/fornecedor deverá ser capaz de:

diferenciar onde o certificado é criado (tela Certificados) de onde ele é vinculado (curso ou teste);
configurar tamanho e orientação da página PDF;
entender por que é preciso testar o PDF gerado, não só o preview do editor;
aplicar as regras de ouro de código HTML compatível com o TCPDF (sem position:absolute, sem tabela aninhada para colunas, sem hr, sem comentários longos);
usar a técnica de <p> + espaçador line-height como padrão de construção, em vez de <table>;
usar o modelo de referência testado e confirmado como ponto de partida;
usar os shortcodes de usermeta/courseinfo/quizinfo/groupinfo para personalizar dados dinâmicos;
aplicar a linguagem institucionalmente correta, evitando termos como "aprovado" fora dos casos exigidos por lei.

Veja também

Este artigo foi útil? 👍 👎

Última atualização: [03/09/2026]