AÑADELE ESTILO AL LEER MAS DE TU BLOG DE BLOGGER

AÑADELE ESTILO AL LEER MAS DE TU BLOG DE BLOGGER.


 



Seguro ya tienes instalado el leer mas de Blogger pero su apariencia es muy simple por lo cual hoy vengo con un truco en el que le pondras el estilo que quieras al leer mas de tu blog,Empezemos:





Pasos

1. Primero buscas el siguiente codigo

]]></b:skin>


Para instalarlo en vuestro Bloc solo tenéis que seguir estos pasos:



1 Un clic en “Plantilla”                           

           



   2 Un clic en “Editar HTML”                                  



  Ahora se te abrirá el Editor HTML de tu plantilla





En  este punto deberás presionar la tecla “Control” de tu teclado seguido de la tecla “F” para que aparezca el buscador integrado en la parte superior derecha de tu editor,
debes esperar unos segundos hasta que se muestre, aquí es donde tendrás que insertar el código para buscarlo e insertar los códigos correspondientes en el editor, 




3 Busca el siguiente código


]></b:skin> 

Cuando lo hayas Encontrado el código deberás insertar las siguientes líneas de código justo arriba del código que encontraste





.jump-link {
float: right;
padding: 4px 6px;
border: 2px solid #81BEF7;
background: #CEE3F6;
}

.jump-link a {
color: #FFFFFF;
text-decoration: none;
font-weight: bold;
}

.jump-link:hover {
border: 2px solid #BE81F7;
background: #E3CEF6;
}

.jump-link a:hover {


3. Esto te dara un leer mas como el siguiente.


Si quieres personalizar el leer mas sigue las siguiente instrucciones:


ESTA PARTE DEL CODIGO ES LA QUE LE DA EL ESTILO GENERAL AL LEER MAS:
.jump-link {
float: right; EL ATRIBUTO «RIGHT» COLOCA EL LEER MAS A LA DERECHA, PUEDES CAMBIARLO POR «LEFT»
padding: 4px 6px;
border: 2px solid #81BEF7; ES EL COLOR DEL BORDE
background: #CEE3F6; ES EL COLOR DEL FONDO
}


ESTA PARTE DEL CODIGO LE DA EL ESTILO AL LINK DE LEER MAS
.jump-link a {
color: #FFFFFF; ESTE ES EL COLOR DE LAS LETRAS «LEER MAS»
text-decoration: none;
font-weight: bold;
}


ESTA PARTE DEL CODIGO LE CAMBIA EL ESTILO AL ESTAR EL MOUSE ENCIMA DEL LEER MAS:
.jump-link:hover {
border: 2px solid #BE81F7; COLOR DEL BORDE AL ESTAR EL MOUSE ENCIMA
background: #E3CEF6; COLOR DEL FONDO AL ETAR EL MOUSE ENCIMA


Si solo le quieres cambiar el color entonces ve a la  Paleta de colores Hexadecimal aqui                     






Fecha:  08/11/2020





Publicado por:                                                  















No hay comentarios:

Publicar un comentario

Adbox

@templatesyard