Como inserir cabeçalho e rodapé em textos padrões?

Neste artigo, você aprenderá a inserir cabeçalho e rodapé em textos padrões, diretamente pelo Imobzi.

No vídeo abaixo você terá acesso ao passo a passo que mostra como inserir um cabeçalho (logo) e rodapé nos textos padrões da Imobzi:

Como inserir o cabeçalho

Primeiramente vá em Administrador, Textos padrões e vamos até o opção de imóvel e criar um novo texto padrão no símbolo de +, clicaremos nos 3 pontinhos no símbolo de </>



Não se esqueça de adicionar também o titulo do texto padrão;



Copie este script;

<table>
    <thead>
        <tr>
            <td>
                <div class="header-space">&nbsp;<br></div>
                <br></td>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td>
                <div class="content">
                    Texto do documento aqui
                </div>
            </td>
        </tr>
    </tbody>
    <tfoot>
        <tr>
            <td>
                <div class="footer-space">&nbsp;<br></div>
                <br></td>
        </tr>
    </tfoot>
</table>
<div class="header">
    <img style="width: 150px;" src="">
</div>
<div class="footer">
    <table style="width:100%; ">
        <tbody style="text-align: left; font-family:'Roboto', sans-serif; font-size:11px">
            <tr>
                <th>
                    <ul style="list-style-type:none;">
                        <li>{{real_estate.company_name}}</li>
                        <li>{{real_estate.address}} {{real_estate.address_complement}}</li>
                        <li>{{real_estate.neighborhood}}</li>
                        <li>{{real_estate.zip_code}} - {{real_estate.city}} -&nbsp;{{real_estate.state}}</li>
                    </ul>
                </th>
                <th>
                    <ul style="list-style-type:none;">
                        <li>CONTATO</li>
                        <li>Telefone : {{real_estate.phone}}</li>
                        <li>E-mail : {{real_estate.email}}</li>
                        <li>Site: {{real_estate.site}}</li>
                    </ul>
                </th>
            </tr>
        </tbody>
    </table>
</div>
<style>
    .header,
    .footer {
      height: 100px;
    }
    @media print {
        .header {
          position: fixed;
          top: 12px;
        }
        .footer {
          position: fixed;
          bottom: 0;
        }*
    }
    .header-space {
        height: 30px;
    }
    .footer-space {
        height: 80px;
    }
</style>

Cole o código na tela do texto padrão:



Em seguida, localize a linha numero 27 você poderá ver ''''



Após isso, você deve acessar o seu site, clicar na sua logo no canto superior esquerdo, clique com o botão direito do mouse em cima e selecione a opção abrir imagem em uma nova guia e copie o link que abriu:



Retornando a página de textos padrões você deverá colar o link copiado no meio das '''';



Agora na linha 13 devemos colar o texto padrão desejado, porém antes vamos clicar no check para salvar;



Vamos abrir outro texto padrão e copia-lo, certificando-se que o texto no código também foi copiado;



Após isso, vamos até o texto padrão anterior, clicar nos 3 pontinhos, </> e colar o texto na parte Texto do documento aqui;



Feito isso você deve clicar no ícone de impressora para ver a logo não está sobrepondo o documento, caso esteja tudo okay você já pode clicar no check para salvar!



Caso não esteja como você desejar, você pode ajustar a logo distanciando ela um pouco mais do texto, basta retornar ao </> e descer até o final da tela onde você tem a opção header space nela basta você alterar o numero abaixo, como no GIF;



Caso prefira, baixe o arquivo com o código acima clicando aqui.

Por fim é só clicar no Check para salvar as alterações!

Se ainda tiver dúvidas, não hesite em contatar o nosso time de Suporte, para que possamos ajudá-los da melhor forma possível Como falar com o Suporte?

Atualizado em: 14/06/2023