17 abril 2018

Como colocar assinatura personalizada no blog

assinatura personalizada

Aprenda de uma forma fácil como colocar
assinatura personalizada no Blog. Ela é automática!

Em março de 2016, foi publicado aqui no manual um tutorial simples de como colocar assinatura personalizada no final da postagem, mas como era o meu primeiro ano como blogueira e eu não tinha nenhuma experiência de como construir um post bacana com informações uteis, eu resolvi refazer alguns posts antigos.

Pra começar, eu escolhi um tutorial muito rápido e fácil de fazer, que é a assinatura da blogueira no final da postagem. Antes de mais nada, você precisa criar sua imagem no canva, no PhotoScape ou em em qualquer outro editor.

Como colocar a assinatura personalizada no final do post

Antes de fazer qualquer alteração em seu template lembre-se sempre de fazer um backup, pois caso algo dê errado você poderá recupera-lo depois. Vá em Modelo ➝ Fazer backup ➝ Fazer download do modelo completo.

1. No painel administrativo do blogger, clique em tema, depois em editar HTML. Com a caixa de código aberta, procure por <data:post.body/>. Provavelmente esse trecho vai aparecer mais de uma vez, e você precisará testar em cada um separadamente.

2. Quando encontrar, cole abaixo dele o seguinte código: 

<div align='right'><img src='URL DA IMAGEM' style='border:0px;'/></div>

3. Em seguida visualize, e estiver tudo ok, salve.

Compreendendo o código: A parte destacada de rosa, refere-se a posição da imagem (center: centro, left: esquerda ou right: direita). Na cor laranja, deve ser adicionada a imagem da sua assinatura já com o seu nome, ou seja, tudo junto, sua foto e o seu nome.

É importante saber: Pra que sua assinatura fique bonita será preciso cria-la em um fundo transparente e depois salva-la em png para que esse fundo continue transparente. No Google você encontra fundos transparentes com facilidade.

O tamanho ideal para assinaturas é de 200 de largura por 130 de altura, e você consegue copiar a url publicando a imagem no próprio blogger, (pode ser um blog de testes) e clicando em seguida com o botão direito do mouse sobre a imagem, copiar o endereço da foto.

Lembrando que essa assinatura é automática. Caso não encontre o trecho <data:post.body/> pesquise por <div class='post-footer'>. Vai aparecer dois trechos iguais, adicione no segundo.

E se você gostou desse tutorial, não deixe de compartilhar com os amigos, pois ajuda no crescimento do blog. Acompanhe nossas dicas e inspirações no facebook e pinterest.

1 comentários:

  1. Não encontrei nenhum no html
    Me ajuda

    Blog www.elaaedemais.blogstop

    ResponderExcluir