Tutoriales: Modificar los títulos de las entradas

La verdad que este truco me pareció muy interesante :)

Hola mis queridos loqueros!! 

Hoy!! ¿como están?

yo aquí por fin con mi primer tutorial!!

espero que lo entiendan y les gusten... como verán empece hacer tutoriales

así que me pueden pedir su tutorial por la sección de CONTACTAME :)

        Vídeo Tutorial

         El truco trata de corregir el titulo de las entradas de su blog! es decir, digamos que su titulo pasa de 3 lineas en la entrada pero usted lo quiere en una sola linea para que no descuadre el orden o la visibilidad del blog o entrada! ( mas o menos me entiendo eso?) no? jajaja bien empecemos poco a poco haber.... 

Anteriormente mi titulo de la entrada se veía así!

Ahora se ve así!!

si quieres colocar este truco en tu blog entonces

Debemos estar en el escritorio de tu blog >> ir a plantilla >> clic en Editar HTML 

le das clic dentro (en donde están los códigos y le das CTRL + F)

• Primero debemos saber cual es el código que presenta el titulo de las entradas de su blog la gran mayoría utiliza este  .post h2  si el tuyo usa este código genial! sino entonces busca cual es el código ok ya con este código lo copias y pegas en la barra de búsqueda... una vez localizado solo debemos agregarle 3 códigos que son:

overflow: hidden;  text-overflow: ellipsis;  white-space: nowrap;

quedara así mas los otros códigos que tengas en ese código:

.post h2 {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}

le dan clic en guardar y hasta hay ya lo tienen como se los mostré anteriormente

      Yo se que me van a preguntar!! que si al entrar a esa entrada el titulo se va a ver completo!! la verdad si se puede solo que aun no eh podido saber como se hace entonces ¿que hago? simplemente coloque en el :hover (que al pasar el cursor este me muestre el titulo completo) ... para hacer esto debemos buscar el siguiente código  .post h2 strong, .post h2 a:hover el cual quedara de esta forma:

.post h2 strong, .post h2 a:hover {

color: #5F04B4;

white-space: normal;

-webkit-animation-duration: 5s;

}

lo que esta en rojo es lo que deben de agregarle a ese código y ya 
con eso le dan clic en guardar y listo!! tendrán lo siguiente:

Alguna pregunta ... no dudes en preguntarlo!!!