18 de jul. de 2012

Personalize o link "continue lendo"

Tumblr_m75utsvnws1qmevz7o1_500_large

Vocês que usam o "continue lendo" como eu, sabia que dá pra personalizar? Pra quem não sabe, é usado para diminuir um pouco a postagem na página inicial do blog. Eu acho muito mais prático. Vejam o meu como ficou aqui em baixo. Bom, esse é o primeiro tutorial do blog, vamos ver no que vai dar, haha. 


Se você usa o antigo editor como eu, vá em "Design" e depois em "Editar HTML". Se você usa o novo, é só ir em "Modelo" e "Editar HTML". Pronto? Agora aperte Ctrl+F ou F3 e procure por: ]]></b:skin> ACIMA desse código, você vai colar isso:
.jump-link{
float: right;
background: #F3EEE9;
margin-right: 5px;
margin-top: 10px;
padding: 1px;
text-align: center;
width: 120px;
border-bottom: 1px dashed #C8AF97;
}
Vamos entender o código?
- O float vai decidir o posicionamento do link. Coloque left para esquerda e right para direita.
- O background vocês devem saber, né? É a cor de fundo. Coloque o código em HTML da sua cor. É sempre com esse # na frente, acompanhado de mais 6 caracteres (números ou letras).
- O margin-right e o margin-top eu usei para dar espaço pro lado direito e pra cima do link, respectivamente. Altere os valores como quiser.
- O padding é o espaço entre o texto e a margem. Eu acho que 1px está ótimo.
- O text-align decide o posicionamento do texto. Center para centro, left para esquerda e right para direita.
- O width é a largura do link. Coloquei 120px porque achei que ficou bom, mas você pode alterar.
- E o border-bottom é a linha tracejada de baixo, você usa se quiser. Eu coloquei só pra enfeitar. O 1px é a grossura da borda, o dashed é o tipo (pode ser dotted *pontilhado*, solid *sem nenhum efeito* e double *linha dupla* também. E o #C8AF97 é a cor da borda.

Entenderam? Desculpem se tiver algum erro, mas é só falar que eu arrumo. Usem e abusem. E muito obrigada a todos que seguiram o blog ultimamente e comentaram. I heart you, guys <3

55 comentários:

Ingrid Sakamoto dos Santos disse...

Que tutorial legal, muito útil Colega!
Muito bom!

www.ingridsakamotodossantos.tk Obrigada pela sua visita, ela é muito importante pra mim viu? Volte sempre amore♥

Monique Santos disse...

amei o tutu!Então fofa,eu te coloco nos afiliados em breve!

http://cupcakegoodies.blogspot.com.br/

Luly disse...

Nossa, que blog lindo! Adorei o seu cantinho flor. É tão novinho, acho que tem tudo para dar super certo por aqui. Esse tutorial é muito útil, acho que fica lindo tudo bem personalizadinho assim. Anna, eu gostei muito mesmo do seu blog, design nota 10 e conteúdo melhor ainda! Queria saber se você aceita afiliação com o meu blog, acho que será bom para ambos. Um beijo! E parabéns pelo blog.
the-zombie-attack.blogspot.com

~ Raafa disse...

Ah, que legal, vou colocar ele agora no lay que estou montando (:

farryteen.blogspot.com

Unknown disse...

*O* muito fácil, adorei o tutorial, deixa o blog mais personalizado :) Querida, seu blog é mt divo \o/ Tem um lay lindo, e um super conteúdo! vc está de parabéns viu? estou seguindo aqui! quando tiver um tempinho passa no meu blog? e se gostar seguir? vai ser uma honra te receber lá :3

http://morangosdespedacados.blogspot.com.br/

Alex Monteiro disse...

Eu não personalizo o meu não sabe? Não acho necessário!
Que blog mais lindo *----* Super original, Parabééns de verdade viu?
Nem preciso dizer que estou seguindo não é? ~~risos~~
Bjão pra ti!
http://blog-part-of-me.blogspot.com/

Priscila disse...

Olá, estou te seguindo viu ? Eu simplismente adorei seu lay, foi um dos maiores motivos de clicar em participar deste blog :p

Beijokas


http://etilapriscila.blogspot.com.br

Carlos Péricles disse...

Gostei muito do seu tutorial e do seu blog completo, Parabéns :)
Se aceita afiliados entre em contato comigo.
httm://semuser.blogspot.com.br

Luly disse...

Que bom que aceitou Anna! Vai ser ótimo participar do seu blog. O Garota Queen já está lá na minha elite e eu estou pensando em divulgar ele no post de hoje do TZA. O que você acha? Topa? Um beijo!
the-zombie-attack.blogspot.com

Camila disse...

Adorei o tutorial!
Está muito bem explicado!

Beijos,
Mundorosaachock.blogspot.com

Luly disse...

Ah, que bom que você aceita! O post sai hoje de tarde ou mais de noite. Então, você pode fazer qualquer coisa por mim que eu já fico muito feliz. Se não for pedir de mais, você poderia fazer um layout para mim? Se der certo, eu uso como sendo o próximo do TZA. A postagem vai ser totalmente direcionada ao seu blog, somente ele. E se você fizer um banner do seu blog, eu coloco na minha barra lateral por um tempo, o seu blog merece tudo isso. Um beijo!
the-zombie-attack.blogspot.com

Carlos Péricles disse...

Já coloquei nos afiliados gata :3
beijo
http://semuser.blogspot.com.br

Stephanie Vieira disse...

Eu só sabia por imagens, adorei demais esse, fica menos 'OI TO COM O LEIA MAIS AQUI" auheuaheuae u.e
→ Garota do Olhar Sincero

Unknown disse...

Ótimo isso . nossa flor blogueiras inguais a você que
fazem a diferensa na blogsfera *uu*
Amei :3 Seguindo :33
AH! Poderia Colaborar com a minha meta me seguindo ?
Obrigada :3
Camom Baby --->http://smileretro.blogspot.com.br/

Karla Martins disse...

Retribuindo a visitinha bjjkss s2

Thais Stellaღ disse...

Segue?
thaisstellawinx.blogspot.com
ts-anjosrebeldes.blogspot.com
Se não quiser seguir os 2 segue só o 1 okey??
Amei o blog e me ajuda na meta do meu blog?
Sigo de volta
Amei o Blog!! :)

Luan disse...

Gostei muito daqui e queria perguntar uma coisa a você! Isso no titulo do seu gadget é um riboon! Eu poderia postar elees no meu blog mais só que com créditos?http://luan-crazyinhtml.blogspot.com.br/

Luan disse...

E por 2 meses de divulgação no meu blog, você faria um lay para min?http://luan-crazyinhtml.blogspot.com.br/

Isa Carol disse...

Awn, ótimo tutorial!!
Amei <3
Super bem explicado, tá de parabéns! O blog é realmente lindo.
http://alanfelipej.blogspot.com.br/

Fabio Correa Imoveis disse...

Oii flor

Adorei o tutorial! E seu blog é mt lindo viu? Obrigada pela visita e seguindo de volta ♥

Muito sucesso! Beijos

http://www.meianoitebr.com/

Alex Monteiro disse...

Anna, seria impossível não aceitar afiliação com o GQ não é? *---*
Já estou te linkando viu?
Bjão!
http://blog-part-of-me.blogspot.com/

Laura disse...

Adorei o tutorial! Vou colocar em meu novo layout! *-*

Ameeeeei seu blog, super original, lindo, perfeeeeeeeeiito! *-*
Segui, com gosto!

OMG, gamei aqui! Aceita afiliação?
the-rain-will-pass.blogspot.com

Unknown disse...

Amei o tutorial, sério. Nunca tinha visto um tutorial explicando tão certinho assim item por item do HTML :)

Beijos
http://semquerermeintrometer.blogspot.com.br

Biaah* disse...

Nossa otimo tuto, vou tentar ampliar alguns codigos nele e ver se consigo deixar de um jeitinho mais profissional. ow, achei seu blog no
Teen Zombie Attack, e adorei tanto nossa nem acredito que é tão novo e tão fofo, seguindo floree ! Aceita afiliações ?
Beijokaas =*

Penelope Charmosa
| Twitter

Anônimo disse...

Vou usar o tutorial porque vou voltar a usar o modelo viagem, e eu queria te parabenizar pelo Layout lindo que você fez, saiu muito linda vei! Super bem elaborado s2 Abre um blog de encomendas sério mesmo!

http://saladadefrutasbr.blogspot.com.br/

Júlia disse...

Super explicado mesmo. Pena que já personalizaram o meu, vou guardar o tuto pro próximo lay ^-^
http://plushrepublic.blogspot.com.br/

narsie disse...

Que! Maneiro! Se eu não tivesse com preguiça, faria agora mesmo!
Vou fazer quando mudar o layout, hihi.

narsie disse...

Que! Maneiro! Se eu não tivesse com preguiça, faria agora mesmo!
Vou fazer quando mudar o layout, hihi.

Anônimo disse...

Amei o tutorial, é lindo o resultado.
E esse layout? Maravilhoso!
Bj. http://momamoraes.blogspot.com

Anônimo disse...

Ah, respondendo sua pergunta: Faço sim no inkscape! É muito fácil, é só treinar, rs.
Bj. http://momamoraes.blogspot.com

Luly disse...

Awn, você não precisa agradecer por nada! Fico muito feliz que você tenha gostado da postagem, eu preparei com muito carinho para você. Bem, eu espero que ajude na divulgação, vou comentar em alguns blogs para conseguir retribuição de comentários no post do GQ. Assim eles conhecem o seu blog e ainda podem me dizer nos comentários o que acham do seu cantinho. Eu gosto de ver as pessoas felizes com o que eu faço, fico feliz junto com elas... Então, obrigada de novo pelo carinho e compreensão, ta sendo ótimo esse contato com você. Um grande beijo!
the-zombie-attack.blogspot.com

Eduardo Felipe disse...

Ótimo tutorial, ele é muito legal.
Tem post novo.
Espero sua visita.
http://construtordepensamentos.blogspot.com.br

Magali disse...

Ótimo tutorial, mas não uso muito o "Continue Lendo".
Beijos,
Blog Hey Teen!
Facebook do Blog

Anna Carollyne Oliveira disse...

Eu não personalizado o meu hack, mas é sempre bom haha. Aqui também é lindo Anna, e não acredito que somos duas "Annas"? *O*

Um beijo,
http://www.world-cutest.blogspot.com.br/

Laura disse...

Coloquei você! Me coloca também *-*
the-rain-will-pass.blogspot.com

Absolute Dream disse...

primeiro, esse tuto é mto bacana mesmo (: eu utilizo.
segundo, seu blog tá de parabéns, é lindo, parece ter conteudo e conseguiu 45 seguidores em 5 dias . você é uma gênia menina. sou sua fã s2
e CLARO, estou seguindo !!

http://mini-fofoquinhas.blogspot.com.br/

Absolute Dream disse...

AHHHHHHH', quero ser afiliada viu ?
se aceitar me avisa que coloco o link na hora (;'

http://mini-fofoquinhas.blogspot.com.br/

Sabrina Machado disse...

Que bacana o tuto :D não uso muuuuuito essa opção, mas fica bem legal :)

Beijos,
Sabrina Machado! ♥
http://www.blogmundodamoda.com/

Unknown disse...

Gostei do tutorial e amei o layout do seu blog *-*, vou tentar personalizar o meu, estou seguindo blog, visita o meu se gostar segue também?

http://yourswonderland.blogspot.com.br

Paula Silva disse...

Amor afilia com meu blog ? ele tem 6 diais de vida um mais que o seu , mais eles ainda são bbs kk , bricadeiras a parte , ( mais serio criei dia 13/07 ) mais afilia amor ? amei teu blog ta muito lindo e já estou seguindo ok ? beijos.
Legal o tutorial bem útil eu não uso mas estava pensando em usar , não fica aquele post enorme e tal né ? acho até que legal mais organizado.

http://viciosmakeup.blogspot.com.br/

Lara Tiengo disse...

Muito Bom o tuto, *---*


Bjs,
http://coisinhasdalara.blogspot.com.br/

lia disse...

Ótima dica flor ^^ Já sabia mas não uso no meu lay porque é um modelo antigo do blogger, aí não funciona...
kissus
www.cherry-liah.blogspot.com

Camila disse...

Oi flor, aceita afiliação?

Beijos,
Mundorosaachock.blogspot.com

Luíza Marinho disse...

Muito bom esse tutorial, talvez eu use no meu próximo lay^^
Adorei teu blog e já segui... Passa lá no meu e segue se gostar?!
Beijos!
keepurban.blogspot.com

Gabriela Oliveira disse...

Gostei muito do tutorial , estava procurando ele esses dias , mas não estava achando . Acho que vou usar ele .

Parabéns pelo seu blog . Você escreve muito bem, o design dele é incrível . Já estou seguindo >.<

http://smileandreams.blogspot.com.br

Thaynará disse...

Adorei o tutorial, eu tava procurando muito porque eu queria deixar o leia mais pra esquerda.

http://garotadifferente.blogspot.com

Biaah* disse...

ow, jáá coloquei seu blog como afiliado, e a barra de seguidores você encontra no rodapé do blog, e lá coloquei divulgação do seu bloguinho lindo. Beijooos

Penelope Charmosa| Twitter

The baby disse...

adoooorei o tutorial dá um charme bem legal no blog né?
sem contar que dá um ar de organizado *0*
kisses~~

#>>> http://the--baby.blogspot.com.br

Anônimo disse...

Adorei esse tutorial, bem diferente dos que eu já tinha visto por aí!
E menina, que blog é esse? Te vi lá no TZA e sério, não dá pra acreditar, esse seu lay, e os poucos posts que tem, são incríveis, parabéns *-*

Beijos,
http://quinzedilemas.blogspot.com.br/

Anônimo disse...

Ótima dica, deixa o blog mais com a nossa cara :D
http://themudancas.tk/

Descompliquei disse...

Gostei :)

www.teenlist.blogspot.com

Paloma Soares disse...

Oi tudo bom? NOOOOOOSSA! Adorei o seu blog,ele é muito lindo mesmo e eu fiquei apaixonada,adorei o designe e as postagens? PERFEEITAS ?
Gostei daqui porque é muito bem organizado,você é uma blogueira carismática e tem muito talento! E você escreve muito bem garota,continue assim que você vai longe,sério..não quero sair do seu blog :\ já fuçei ele todinho,KKKKK’ Adorei mesmo,e o nome,postagem e conteúdo? Incríveis! Eu já seguia aqui,mais nunca tive tento pra te elogiar..é que as vezes passo por aqui e nem comento :\ bom,eu adoraria que seguisse o meu novo blog,pra ajudar sabe? Agradeço! Beijos e como eu disse antes,MENINA..seu BLOG É PERFEITO,amei,amei,amei >< não tenho palavras pra descrever,hahahaha..seu blog é DIVO!! clubedetres.blogspot.com

Unknown disse...

Ameei *-* muito bom...
fiz isso no lay de sorteio que eu fiz no photoscapeforme.blogspot.com

corre lá e participa do sorteio!

Anônimo disse...

Obrigada pela visita. Uau! Que gracinha o seu blog, e o tutorial muito bem explicado! Você é uma fofa e eu adorei aqui, muito lindo o seu blog, viu? Estou seguindo aqui também, você merece ser seguida, rs.
Beijos, fashionwithstyle.tk

Anônimo disse...

Fica superlindo :)
# ~~>A garota de Preto