{ Personalizar a legenda da imagem - Blogger | butlariz

Anuncio layout

Anuncio layout
Encomende já o seu layout!
- 2.12.16

Personalizar a legenda da imagem - Blogger



Oi gente! O tutorial de hoje, sobre como personalizar a legenda da imagem dos posts no blogger, foi sugestão de algumas migas lá do Daydream ♥ e é algo super fácil de fazer, então é só colocar o código no lugar certo, e alterar a cor, e pronto, ta perfeito! haha. 

Você precisa ir no painel do seu blogger, e clicar em Modelo, e depois Editar Html 

Então clique no meio dos códigos que apareceram, aperte ctrl+f no seu teclado e procure por:

]]></b:skin>

Acima disso, cole o seguinte código:

td.tr-caption {
    font-size: 90%;
    background-color: #a5efe4;
    display: inline;
    color: #000;
    padding: 5px 20px;
    font-style: italic;
    top: -50px;
    float: right;
    position: relative;
    margin-bottom: -30px;
}

Para trocar a cor do fundo da legenda, é só substituir o código em vermelho, pelo código da cor desejada. Para trocar a cor da letra, é só substituir o código em azul. Veja os códigos de todas as cores aqui.

Depois é só salvar! 

Caso você não saiba com colocar a legenda na imagem: 

Quando você está criando um post, e faz o upload da imagem, clique em cima dela, e vai aparecer algumas opções para você escolher o tamanho, a posição, propriedades e entre essas opções vai ter legenda. Então, é só escrever a legenda que quer e depois continuar seu post normalmente. 

E só! O tutorial foi bem rapidinho né? Mas espero que seja muito útil pra vocês! Caso tenha gostado do tutorial, deixe seu comentário e compartilhe com a suas amigas blogueiras! 

Ah, se tiver dúvidas ou sugestões de tutoriais, pode ficar a vontade para comentar e pedir! Beijinhos ♥

Comente com o Facebook:

15 comentários:

  1. Obrigada pelo tutorial, eu sempre quis aprender a fazer um desses, acho a legenda normal do blogger que fica em baixo do post meio feinho, vou tentar fazer aqui!!
    Beijão!
    Agridoce Leitura

    ResponderExcluir
  2. Aaaah sua maravilhosa! Tava precisando viu? Muuuito obrigafo por ensinar ❤

    ResponderExcluir
  3. Aqui não funcionou :( inheeeeeew ! que tristeza .

    ResponderExcluir
    Respostas
    1. Sério? Poxa ): Mas o que deu errado? Como ficou?

      Excluir
    2. Funcionou sim ♥ é porque eu tinha tentado e pensei que já ia ficar na página de edição, mas tu tem que clicar em VISUALIZAR no blog pra ver que deu certo, diz pras gurias que também não conseguiram :3
      O único problema é que ficou muito pra baixo e um pouco fora da imagem, tem como eu arrumar isso ? :\
      Amei o tutorial (♥) :3

      Excluir
  4. Oi Lariz,
    Eu não estou conseguindo fazer esse slide carrocel funcionar nessa sua base, você poderia fazer um tutorial explicando como fez pra que desse certo?

    ResponderExcluir
  5. Lariz, eu consegui colocar <3 mas a faixinha fica pra fora da imagem, como arruma isso? :(

    ResponderExcluir
  6. Amei o post <3 Prefiro colocar pelo editor haha mas anotei o codigo quem sabe <3

    ResponderExcluir
  7. Adorei o tutorial, já inseri no meu blog, mas queria que ficasse com esse efeito na página inicial também, e só fica quando eu abro o post por completo! :(

    ResponderExcluir
  8. Muito bom, usei no meu blog e ficou top! :D

    ResponderExcluir
  9. como faz pra colocar a legenda na imagem?

    ResponderExcluir
  10. Amei demais o tutorial, coloquei no meu! Super obrigada <3
    www.rumorandhorror.blogspot.com.br

    ResponderExcluir

• 2015 - 2017 Feito com ♥ por Lariz Santana