Tutorial | Leia Mais na largura do post


Hey, hey, hey!
Ói eu aqui travês! Novamente eu venho com um tutorial, porque além de ser fácil é um dos marcadores mais importantes do blog. Antes de continuar, queria falar que eu só não postei por causa do meu Blogger, que bugou e eu não conseguia colocar imagem na postagem. Graças a Deus consertei isso \o/ Enfim.

O tuto de hoje vai ensinar a vocês como colocar o botão "Leia Mais" em toda a largura do post.
Let's Go! ~

1. Vá em Modelo > Editar HTML e procure por: ]]></b:skin
2. Acima deste código cole um desses:

.jump-link {
text-align: center;
margin-top: 3px;
padding:2px;}
.jump-link a {
text-transform:uppercase;
display:block;
padding:2px;
margin:1px;
background: #dcf8f1;
border: 1px solid #b7ece4;box-shadow: inset 1px 1px 0 #fef8f9;
color: #fff;
font-size: 11px;}

.jump-link {
text-align: center;
margin-top: 3px;
padding:2px;}
.jump-link a {
padding:2px;
font-size:14px;
text-transform:uppercase;
display:block;
padding:2px;
margin:1px;
color:#bbb;
background:#eee; border:1px solid #f5f5f5;}

@font-face { font-family: "silkscreen"; src: url('http://static.tumblr.com/1kdckk4/9yjlolf0w/slkscr.ttf'); }
.jump-link {
color:#fff;
padding: 3px;
margin: 2px;
text-align: center;
font-size: 8px;
background: #fcd6db;-webkit-box-shadow: inset 0px 0px 6px #fbbbc3, inset 1px 0px 0px #fff, inset 0px 1px 0px #fff;-moz-box-shadow: inset 0px 0px 6px #fbbbc3, inset 1px 0px 0px #fff, inset 0px 1px 0px #fff;-o-box-shadow: inset 0px 0px 6px #fbbbc3, inset 1px 0px 0px #fff, inset 0px 1px 0px #fff;border: 1px solid #fcd6db;-webkit-border-radius: 200px;-moz-border-radius: 200px;-o-border-radius: 200px;}
.jump-link a {
color:#fff;font-size: 8px;font-family: "silkscreen";word-spacing: -2px;}

.jump-link {
text-align: center;
background-color: #fff;
border: 3px double #ebebeb;
}
.jump-link a{
color: #705587;
}

E pronto! Se necessário edite as cores e tudo mais :)

Então foi isso pessoas ^^. Espero que tenham gostado, aguardo comentários de vocês Õ/
Um beijo ♥

4 comentários:

  1. Oi Túlio, tudo bem? Espero que sim. Esse tutorial é ótimo, fica lindo <3
    Kisu ~ Bleeding

    ResponderExcluir
  2. Awwn, queria que tivesse colocado um preview *~*
    Mas aposto que é lindo *U*

    http://skull-minds.blogspot.com.br/

    ResponderExcluir