Personalizar enlace de "sigue leyendo"

Primero lo primero, ya que en este tutorial explicaré como personalizarlo pero por si no sabes ni siquiera como se pone el enlace te lo explico rapidamente.

¿Qué es el enlace 'sigue leyendo'?

Lo puedes ver en el 90% de mis entradas y permite 'ocultar' una parte de la entrada para continuar leyendo tras hacer clic en un link. Personalmente, me resulta muy útil ya que, como subo muchas imágenes al blog, eso hace que las mismas no aparezcan en la portada principal del blog y este no tarde tanto en cargarse.

¿Cómo lo pongo en mis entradas?

Ponerlo en tus entradas es muy sencillo. Cuando estés escribiendo (o bien cuando ya hayas terminado) sólo tienes que situarte donde quieres que se produzca el corte y apretar el icono que te señalo a continuación.

Cuando le hayas hecho clic, te aparecerá una especie de línea divisora. Lo que quede debajo de la misma es lo que aparecerá cuando pinches en "Seguir leyendo".

Ahora si te vas a tu blog, te aparecerá por defecto que ese link dice 'más información'. Si tu sólo quieres cambiarlo y que ponga 'seguir leyendo' u otra cosa sólo tienes que ir a la pestaña Diseño de tu blog y hacer clic en Editar en el elemento Entradas del blog. Y modificas lo que dice 'texto del enlace de la página de entrada'. Luego guardas los cambios y ya. 

¿Cómo personalizarlo?

Si quieres personalizar un poco el link, te vas a la pestaña Plantilla, te metes en la Editar HTML, haces clic en la caja del código y aprietas CTRL+F para que te salga el buscador, buscas ]]></b:skin> y antes de ello, pegas lo siguiente y si quieres puedes modificar lo que está marcado.

.jump-link {
float: center;  /* Alineación */
background: #ff0000; /* Color de fondo */
border: 1px solid #ffffff;  /* Grosor y color del borde */
padding: 2px 2px;
}
.jump-link a {
color: #ffffff; /* Color del link */
text-decoration: none;
}
.jump-link:hover {
background: #000000; /* Color de fondo al pasar el cursor */
border: 1px solid #fffff; /* Grososo y color del borde al pasar el cursor */
}

¿Y si quiero reemplazar el link por una imagen? 

1. Te vas a ir a la pestaña Plantilla de tu blog y te vas a meter en Editar HTML. Primero que nada, haces clic en la caja del código y luego abres el buscador (CTRL+F) y ahi buscas: <data:post.jumpText/>

2. Y a eso lo reemplazas por <img src="URL de la imagen"/> , pero aún no guardes los cambios.

3. Ya que tengas la imagen que quieres utilizar, la cargas a Tinypic y copias el último de los links que te da, que dice 'Enlace directo para presentaciones' y te vas al código de tu blog y reemplazas lo que dice URL de tu imagen por ese link. 

Te aparecerá, por defecto la imagen alineada hacia la izquierda. Pero si quieres centrarla todo lo que tienes que hacer es agregar <center></center> antes y después de la sentencia de la imagen; es decir tiene que quedar así: <center><img src="URL de la imagen"/></center>

Y listo! Si tienes alguna duda, comenta y te ayudaré :) Espero que te haya servido. Besos!