Modelo de notificações GLPI

Modelo responsivo para notificações por e-mail

Esse é o modelo mais completo que já vi para você utilizar em suas notificações por e-mail. Um modelo completo, responsivo, que se adapta tanto em telas grandes quanto pequenas, e obedece as cores padrão do GLPI. Vale a pena utilizá-lo. Basta segui os procedimentos abaixo.

Em Notificações/Modelo de notificação crie um novo modelo com o nome que desejar. No campo CSS cole o código abaixo:

<style type=”text/css”>
body{height:100% !important; margin:0; padding:0; width:100% !important;}
*, a{font-family: Arial, sans-serif; text-decoration:none;}

conteudo-header{
max-width: 100%;
min-width: 620px;
}
@media only screen and (max-device-width: 480px) {
table[class=conteudo] {
width:340px !important;
float:center!important;
}
td[class=header] img {
height:auto !important;
width:100% !important;
}
}

</style>

Em Traduções de modelo, clique em tradução padrão, clique em “código fonte <>” e cole todo os código abaixo.

<center style=”width: 100%; table-layout: fixed; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%;”>
<table class=”conteudo” border=”0″ width=”640″ cellspacing=”0″ cellpadding=”10″>
<tbody>
<tr>
<td class=”header”>
<table style=”background-color: #2d5016ff; border: 1px solid #f4f4f4; border-collapse: collapse; font-size: 12px; height: 69px; width: 100%;” width=”100%” cellpadding=”0″>
<tbody>
<tr style=”border: 1px solid #f4f4f4; border-collapse: collapse; font-size: 12px; height: 38px;”>
<td style=”height: 69px;” rowspan=”2″ width=”448″><img src=”https://suporte.servicedeskti.com.br/pics/logo_gestao.png” alt=”logomarca” width=”120″ height=”34″ /></td>
<td style=”height: 38px;” width=”53″><span style=”color: #ffffff;”><strong>N°: </strong></span></td>
<td style=”font-size: 14px; height: 38px;” width=”110″><span style=”color: #ffffff;”><strong>##ticket.id##</strong></span></td>
</tr>
<tr style=”border: 1px solid #f4f4f4; border-collapse: collapse; font-size: 12px; height: 31px;”>
<td style=”height: 31px;” width=”53″><span style=”color: #ffffff;”><strong>Status</strong>:</span></td>
<td style=”height: 31px;” width=”117″><span style=”color: #ffffff;”>##ticket.status##</span></td>
</tr>
</tbody>
</table>
<br />
<table style=”border: 1px solid #f4f4f4; border-collapse: collapse; font-size: 12px;” width=”100%” cellpadding=”0″>
<tbody>
<tr>
<td style=”background-color: #f5f5f5;” width=”620″>
<p style=”padding: 5px 5px 5px;”><strong>Solicitação</strong>: ##ticket.title## <br />##ticket.content##</p>
</td>
</tr>
</tbody>
</table>
<br />##IFticket.storestatus=5##
<table style=”border: 1px solid #f4f4f4; border-collapse: collapse; font-size: 12px;” width=”100%” cellpadding=”0″>
<tbody>
<tr>
<td style=”background-color: #f5f5f5; background-image: url(‘https://suporte.servicedeskti.com.br/pics/timeline/solution.png’); background-repeat: no-repeat; background-position: right; border: 1px solid #f4f4f4; border-collapse: collapse;” colspan=”2″ width=”620″>
<p style=”padding: 5px 5px 5px;”><strong>Solução</strong>: <br />##ticket.solution.description##</p>
</td>
</tr>
<tr style=”border: 1px solid #f4f4f4; border-collapse: collapse;”>
<td><strong>##lang.ticket.solvedate## :</strong> ##ticket.solvedate##</td>
<td align=”right”><a style=”text-decoration: none; color: #ffffff; padding: 10px 10px; font-weight: bold; text-align: center; cursor: pointer; display: inline-block; background-color: #2d5016ff!important;” href=”##ticket.urlapprove##”> Aprovar solução &gt;&gt;</a></td>
</tr>
</tbody>
</table>
<br />##lang.ticket.autoclosewarning## ##ENDIFticket.storestatus## ##FOREACHfollowups##
<table style=”background-color: #f5f5f5; background-image: url(‘https://suporte.servicedeskti.com.br/pics/timeline/followup.png’); background-repeat: no-repeat; background-position: right; border: 1px solid #f4f4f4; border-collapse: collapse; font-size: 12px;” width=”100%” cellpadding=”0″>
<tbody>
<tr>
<td colspan=”2″>
<p style=”padding: 5px 5px 5px;”><strong>Acompanhamento</strong>: [##followup.date##] – ##followup.description##</p>
</td>
</tr>
<tr style=”border: 1px solid #f4f4f4; border-collapse: collapse;”>
<td width=”168″><strong>##lang.followup.isprivate## :</strong></td>
<td align=”left” width=”452″>##followup.isprivate##</td>
</tr>
<tr style=”border: 1px solid #f4f4f4; border-collapse: collapse;”>
<td width=”168″><strong>##lang.followup.author## :</strong></td>
<td align=”left” width=”452″>##followup.author##</td>
</tr>
</tbody>
</table>
<br />##ENDFOREACHfollowups## ##FOREACHtasks##
<table style=”background-color: #f5f5f5; background-image: url(‘https://suporte.servicedeskti.com.br/pics/timeline/task.png’); background-repeat: no-repeat; background-position: right; border: 1px solid #f4f4f4; border-collapse: collapse; font-size: 12px;” width=”100%” cellpadding=”0″>
<tbody>
<tr>
<td colspan=”4″ bgcolor=””>
<p style=”padding: 5px 5px 5px;”><strong>Tarefa</strong>: [##task.date##] – ##task.description##</p>
</td>
</tr>
<tr style=”border: 1px solid #f4f4f4; border-collapse: collapse;”>
<td width=”145″><strong>##lang.task.isprivate## :</strong></td>
<td align=”left” width=”115″>##task.isprivate##</td>
<td align=”left” width=”141″><strong>##lang.task.time## :</strong></td>
<td align=”left” width=”217″>##task.time##</td>
</tr>
<tr style=”border: 1px solid #f4f4f4; border-collapse: collapse;”>
<td width=”145″><strong>##lang.task.author## :</strong></td>
<td align=”left” width=”115″>##task.author##</td>
<td align=”left” width=”141″><strong> ##lang.task.category## :</strong></td>
<td align=”left” width=”217″>##task.category##</td>
</tr>
<tr style=”border: 1px solid #f4f4f4; border-collapse: collapse;”>
<td width=”145″> </td>
<td align=”center” width=”115″> </td>
<td align=”center” width=”141″> </td>
<td align=”center” width=”217″> </td>
</tr>
</tbody>
</table>
<br />##ENDFOREACHtasks##</td>
</tr>
</tbody>
</table>
<!–tabela principal, com a largura do documento–>
<table class=”conteudo” border=”0″ width=”640″ cellspacing=”0″ cellpadding=”0″>
<tbody>
<tr>
<td> </td>
</tr>
<tr>
<td>
<table style=”font-size: 12px;” border=”0″ width=”320″ cellspacing=”0″ cellpadding=”10″ align=”left”>
<tbody>
<tr>
<td><span style=”padding: 5px 5px; margin: 5px 0px 5px 0px; display: block; background-color: #f5f5f5;”> Solicitado por:</span> ##ticket.authors## <span style=”padding: 5px 5px; margin: 5px 0px 5px 0px; display: block; background-color: #f5f5f5;”> Data de Abertura:</span> ##ticket.creationdate## <span style=”padding: 5px 5px; margin: 5px 0px 5px 0px; display: block; background-color: #f5f5f5;”> Data de Fechamento:</span> ##IFticket.closedate## ##ticket.closedate## ##ENDIFticket.closedate## ##ELSEticket.closedate## —— ##ENDELSEticket.closedate## ##IFticket.numberoffollowups## <span style=”padding: 5px 5px; margin: 5px 0px 5px 0px; display: block; background-color: #f5f5f5;”> N° de acompanhamentos: ##ticket.numberoffollowups##</span> ##ENDIFticket.numberoffollowups## ##ELSEticket.numberoffollowups## <span style=”padding: 5px 5px; margin: 5px 0px 5px 0px; display: block; background-color: #f5f5f5;”> N° de acompanhamentos: 0 </span>##ENDELSEticket.numberoffollowups## ##IFticket.numberoftasks## <span style=”padding: 5px 5px; margin: 5px 0px 5px 0px; display: block; background-color: #f5f5f5;”> N° de tarefas: ##ticket.numberoftasks##</span> ##ENDIFticket.numberoftasks## ##ELSEticket.numberoftasks## <span style=”padding: 5px 5px; margin: 5px 0px 5px 0px; display: block; background-color: #f5f5f5;”> N° de tarefas: 0</span> ##ENDELSEticket.numberoftasks##</td>
</tr>
</tbody>
</table>
<table style=”font-size: 12px;” border=”0″ width=”320″ cellspacing=”0″ cellpadding=”10″>
<tbody>
<tr>
<td><span style=”padding: 5px 5px; margin: 5px 0px 5px 0px; display: block; background-color: #f5f5f5;”> Origem: </span>##ticket.requesttype## <span style=”padding: 5px 5px; margin: 5px 0px 5px 0px; display: block; background-color: #f5f5f5;”> Categoria: </span>##IFticket.category## ##ticket.category## ##ENDIFticket.category## ##ELSEticket.category## ##lang.ticket.nocategoryassigned## ##ENDELSEticket.category## <span style=”padding: 5px 5px; margin: 5px 0px 5px 0px; display: block; background-color: #f5f5f5;”> Urgência: ##ticket.urgency##</span> <span style=”padding: 5px 5px; margin: 5px 0px 5px 0px; display: block; background-color: #f5f5f5;”> Impacto: ##ticket.impact##</span> <span style=”padding: 5px 5px; margin: 5px 0px 5px 0px; display: block; background-color: #f5f5f5;”> Prioridade: ##ticket.priority##</span><center><a style=”text-decoration: none; color: #fff; background-color: #2d5016ff; padding: 10px 16px; font-weight: bold; margin-right: 10px; text-align: center; cursor: pointer; display: inline-block; font-size: 12px;” href=”##ticket.url##”> Visualizar chamado online »</a></center></td>
</tr>
</tbody>
</table>
</td>
</tr>
</tbody>
</table>
<table class=”conteudo” border=”0″ width=”640″ cellspacing=”0″ cellpadding=”5″>
<tbody>
<tr>
<td><center><a style=”border: 0;” href=”https://suporte.servicedeskti.com.br” target=”_blank” rel=”noopener noreferrer”><img src=”https://suporte.servicedeskti.com.br/pics/Logo_TI.png” alt=”Logotipo da empresa” width=”50″ height=”50″ /></a></center></td>
</tr>
<tr>
<td style=”font-size: 10px !important; color: #4a585e;” align=”center”>© Service Desk TI – Todos os direitos reservados.</td>
</tr>
</tbody>
</table>
</center>

Feito isso, altere as cores para os de  sua preferência, o nos campos URL altere o endereço para o seu link do glpi. Aplique como novo template das notificações do tipo Chamado.

Sugestão: Add Followup, Add Task, Close Ticket, Delete Task, Delete Ticket, New Ticket, Resolve ticket, Update Followup e Update Ticket.

_{Créditos Tec Resolve.}