Tags & Hacks Tutoriais

Legenda em Imagens

1 de March de 2013

Muita gente já me pediu para explicar como coloco a legenda de cada foto sobre a própria imagem. Demorei, mas finalmente vim aqui explicar 😀

01. Adicione ao arquivo style.css:

.wp-caption {position: relative; }
.wp-caption-text {margin: 0 3% 0 0; padding: 3px 10px; position: absolute; left: 10px; bottom: 10px; background: rgba(70, 70, 70, 0.5); color:#fff; text-align: left; font: 11px Arial, serif; font-style: italic;}

O posicionamento de margin, padding, cor do texto, fonte e tudo mais, cada um configura como desejar e como for melhor para adaptar ao tema usado.

02. Quando você quiser que a descrição apareça na sua imagem, depois de fazer o upload no painel do WordPress, preencha o campo "Caption" como mostra a imagem abaixo:

Preencher o campo "caption"

Preencher o campo "caption"

Finalize clicando no botão "insert into post".

heart


Leia Também

Deixe seu comentário

01/03/2013 ・ 09:05

Oi Tamara!
Eu já tinha descoberto a propriedade Caption há um tempinho, mas confesso a vc que colocava à “unha” mesmo, rs, não sabia que o painel fazia praticamente sozinho entrando no “attachment” 🙂
Adorei! Obrigada por compartilhar!
Beijos, bom final de semana!

@morenalilica

01/03/2013 ・ 09:17

Ahhhh tamara, obrigadaa *-* estava tentando fazer algo assim, mas não consegui, obrigada mesmo 😀

01/03/2013 ・ 10:47

Nossa, eu ia até te perguntar, mas sempre acabava deixando pra lá, pra não incomodar, adorei, e até que não é complicado.

01/03/2013 ・ 12:27

Adorei, vou tentar fazer!
Beijos!

07/03/2013 ・ 21:36

Tamara, como faz para isso funcionar na sidebar? :$

    08/03/2013 ・ 08:37

    Nunca tentei fazer na sidebar, mas acho que você pode usar esse CSS e fazer manualmente.

29/03/2013 ・ 16:14

To me sentindo muito inteligente por ter conseguido fazer funcionar no meu blog! <3
Obrigada Tamara!

29/05/2013 ・ 13:02

Consequi!!! Muito obrigada pelos tutoriais. =)))

15/06/2015 ・ 14:01

Oi Tâmara,

Todas as minhas imagens vão para a pasta upload, como salva na pasta images do meu tema?

Obrigada,
Amanda Pimentel

    15/06/2015 ・ 17:16

    Você envia por FTP ou pelo Chanel 😉

10/08/2016 ・ 16:58

Wmqual lugar do style.css eu colo? Qualquer um?