Como personalizar o botão "Leia Mais"

Imagine um botão de leia mais personalizado para ficar mais atraente as suas postagens? Bom, eu vi isso em outro blog, mais ele foi excluído, e resolvi ensinar aqui para vocês. Vamos lá?


Primeiramente, vá no blogger, e clique em Layout. 

Bom, depois disso crie um gadget e clique em Gadget HTML/JavaScript

Daí, dentro da caixinha, cole esse código

<style> /*inicio do css do leia mais*/ /*estilo do leia mais*/ .jump-link{ background: #0000FF; /*cor de fundo*/ width: 100px; /*largura do fundo*/ height: 22px; /*altura do fundo*/ padding-top:4px; text-align: center; /*alinha o link*/ float:right; /*lado do link*/ border: 1px solid #c0c0c0; /*borda*/ border-radius: 4px; /*arredondamento-Opera*/ -moz-border-radius: 4px; /*arredondamento-Mozilla*/ -webkit-border-radius: 4px; /*arredondamento-Chrome e Safari*/ } /*estilo do link normal leia mais*/ .jump-link a{ margin-top: 06px; font-size: 11px; /*tamanho da fonte*/ font-family: Arial; color: #ffffff; /*azul*/ text-decoration: none; } /*estilo do link hover(ao passar mouse) leia mais*/ .jump-link a:hover{ font-size: 11px; /*tamanho do link ao passar o mouse*/ margin-top: 06px; font-family: Arial Black; color: #f5f5f5; /*cor do link ao passar o mouse*/ text-decoration: none; margin-left:8px; /*'empurra' o link para direita*/ transition:0.3s; /*da o efeito lento enquanto o link é 'empurrado' para direita - Opera*/ -moz-transition:0.3s; /*da o efeito lento enquanto o link é 'empurrado' para direita - Mozilla*/ -webkit-transition:0.3s; /*da o efeito lento enquanto o link é 'empurrado' para direita – Chrome e Safari*/ } /*fim do css do leia mais*/ </style>
Bom, ele vai ser naturalmente preto. Se o seu blog for alguma de alguma coisa relacionada com Terror, acho que fica bem legal, mais se você é menina ou menino mesmo e quer mudar, é muito fácil! Vou deixar algumas cores mais usadas:

Branco	Vermelho	Verde	Azul	Magenta	Ciano	Preto	Amarelo
#FFFFFF	#FF0000	#33ff33	#0000FF	#FF00FF	#00FFFF	#000000	#FFFF00

Bom, para colocar a cor de fundo, mude aonde está background: #0000FF; /*cor de fundo*/, e coloque o tom de cor que você quer. Para mais cores: Cores e pegue o HTML de cada cor.