Si quieres cambiar el estilo de tu blog, ponerle otro estilo de fuente o escritura, un estilo que te guste, por ejemplo Comic Sans MS, sólo debes seguir los pasos que te enseñaré y podrás cambiar el estilo de letra en cualquier parte de tu blog...
Para comenzar debemos tener claro que fuente queremos poner a cada parte del blog (Arial, Comic Sans MS, Arial black...) y puedes ver estilos y los nombres en Microsoft Word por ejemplo. Debes saber como se escribe.
Si quieres cambiar la fuente del texto de la sidebar (barra lateral) debes buscar esto...
#sidebar-wrapper {
Debajo tiene un bloque algo parecido a esto (será diferente según el modelo de tu plantilla)
#sidebar-wrapper {Y le agregas la línea que está en rojo.
background:$sidebarBgColor;
width:234px;
float:$endSide;
padding:0;
color: $sidebarTextColor;
font-size: 83%;
font-family: Comic Sans MS;
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
overflow: hidden; /* fix for long non-text content breaking IE sidebar float */
}
Dónde dice Comic Sans MS puedes escribir el nombre de la fuente que quieras (borrándo la de Comic Sans MS, pero asegúrate que está escrita correctamente).
Si quieres cambiar la fuente del texto de la fecha que aparece encima del título de las entradas (si no hemos echo el truco de tunear la fecha) debes buscar esto...
h2.date-header {
Y debajo tendrá su correspondiente bloque (diferente según las plantillas)
h2.date-header {Y le agregas la línea que está en rojo.
margin:0 0 .5em;
line-height: 1.4em;
font: $dateHeaderFont;
font-family: Comic Sans MS;
text-transform:lowercase;
color:$dateHeaderColor;
}
Dónde dice Comic Sans MS puedes escribir el nombre de la fuente que quieras (borrándo la de Comic Sans MS, pero debe estar escrita correctamente).
Si quieres cambiar la fuente del texto del título de la entrada, del cuerpo, de las etiquetas y del autor (te quedará todo con la misma fuente) debes buscar esto...
.post {
Y le agregas esta línea debajo:
font-family:Comic Sans MS;
Dónde dice Comic Sans MS puedes escribir el nombre de la fuente que queramos (borrándo la de Comic Sans MS, pero debe estar escrita correctamente).
Si sólo quieres cambiar la fuente del título, para poder tener fuentes diferentes en título y cuerpo, debes buscar esto...
.post h3 {
Y debajo le incluyes esta línea...
font-family:Comic Sans MS;
Si además quieres que la fuente cambie al pasar el cursor por encima del título de la entrada, debes buscar esto...
.post h3 a:hover {
Y debajo le incluyes la línea...
font-family: Comic Sans MS;
Si también quieres que cambie de color, debes comprobar si tiene esta línea incluida en el bloque anterior:
color: $mainVisitedLinkColor;
Si la tiene incluida, borra lo que está en rojo y ponle un código de color (puedes verlos en la tabla de colores)
Te quedaría así:
color: #da2f3e;
Lo rojo es el código del color ;-)
Si quieres cambiar la fuente del texto de la entrada, la fuente del cuerpo, debes buscar esto...
.post-body {
Y le añades esta línea debajo:
font-family: Comic Sans MS;
Si además quieres añadirle color de texto, añade esta otra línea debajo:
color: #da2f3e;También puedes elegir el color, borrando lo que está en rojo y escribiendo el código de tu color.
Si quieres cambiar la fuente del texto del post-footer (pié del post) debes buscar esto...
.post-footer {
Añades esta línea debajo:
font-family: Comic Sans MS;
Si también quieres añadirle color, mira primero en el bloque para comprobar si tiene esta línea:
color:$postTitleColor;
Si la tiene, borramos lo que está en rojo y ponemos el código de nuestro color, quedaría así...
color: #da2f3e;
Si quieres cambiar la fuente del texto del título de los elementos de la sidebar (barra lateral) debes buscar esto...
.sidebar h2 {
Y mirar si tiene esta línea...
font: $sidebarHeaderFont;
Si la tiene, bórrala pon esta en su lugar...
font-family: Comic Sans MS;
Si además quieres ponerle un color que te guste, busca en el mismo bloque esta línea:
color: $sidebarHeaderColor;
Si la tiene, la borras y la cambias por esta otra (si no la tiene, sólo tienes que añadir esta otra)
color: #da2f3e;
Si quieres cambiar la fuente del texto del texto de los elementos de la sidebar (barra lateral) debes buscar esto...
.sidebar .widget {
Y le añades esta línea debajo:
font-family: Comic Sans MS;
Si además quieres añadirle color, ponle esta otra línea también:
color: #da2f3e;Cambia el color #da2f3e por el código de tu color.
Hola Jaime, he dejado un premio en mi blog para ti, pasa a recogerlo cuando quieras. Aunque me parece que repites este premio ya :-)
Un saludo!!
AMIGOOO!!!
De verdad, pero de vredad sos un gran tipo!!!
Arregle todo tal cual me lo mandaste y quedo, es mas, hasta cambie algunas fuentes!!!!
Te mereces un premio y para eso, tengo que crearlo (y no se como para variar!) pero ni bien lo tenga lo recibiras!
Gracias totales!!!!
Hola Helena!! me alegra mucho lo del premio :-) ahora mismo lo recojo :-) no pasa nada que se repita :-) tu lo entregaste con ilusión y por eso merece la pena :-) un abrazo0!!
Hola Khyronthell!! me alegra muchísmo que puedieses conseguir lo que necesitabas :-) el premio no te preocupes ;-) si puedes hacerlo bien y si no no pasa nada, para mí el mejor premio es teneros a todos, vosotr@s :-) se puede hacer con paint por ejemplo, cojiendo una imágen y escribiendo algo encima :-) un abrazooo enorme amigo!!!!!!! :-)
Pies esto si que quiero ponerlo en practica,en cuanto solucione los pequeños problemas del blog me pondré con ello
Gracias jaime me encanta asomarme a tu balcón!!!!
Hola Jaime, gracias por la invitación y como mencioné, acá paso por el blog, felicitaciones, esta completito completito, ya te sigo.
Saludos!, ah, ya que estoy, por esa casualidad abrá alguna manera de aumentar el numero de autores de un blog?, blogger solo te deja tener 100 autores y en poetas anonimos ya nos esta empezando a quedar chico, es una lastima ya que va a quedar gente a fuera en un tiempo.
Yo soy un poco nula en estas cosas del ordenador y necesito explicaciones de infantil.Jejeje. A mi me gustaría cambiar el fuente de lo que escribo en las entradas y dejar (por ahora) todo lo demás tal cual. Se puede hacer? Y donde busco esas cosas que tu dices que hay que cambiar? Gracias por tu ayuda.
Hola morganna!! jeje me alegra muchísimo que te guste asomarte :-) a mi me encanta asomarme para hablar con vosotr@s :-) un abrazo0!!
Hola Maximiliano Melchior......(mx.m-)!! me alegra que te guste El Balcón :-) que bien que te unas a los seguidores:-) por ahora no conozco ninguna forma de cambiar los autores.. eso normalmente está por el equipo de blogger.. intentaré informarme pero creo que es difícil:-( un gran saludo!!!!!!!! :-)
Hola Dulce, si solo quieres cambiar la fuente del texto con el que escribes, haz el paso que dice:
Si quieres cambiar la fuente del texto de la entrada, la fuente del cuerpo, debes buscar esto...
Si necesitas algo de ayuda, dímelo :-) un abrazo amiga!! :-)
Hola Jaime,
milenhorabuenas por tus trucos.
Te pongo a prueba:
si quiero cambiar el estilo de fuente (fuente, tamaño, negrita...) solo del titulo de ALGUNAS entradas...?
Espero. Gracias
Anónimo, todavía no conozco la manera de hacer eso pero puedo investigar y quizás pueda hacerse ;-)
Tal vez agregándo unas propiedades en el CSS :-S
Te avisaré si aprendo la manera de hacerlo :-)
¡Hola Jaime! ¡Qué truco más estupendo! Yo quisiera cambiar la fuente de toooodo mi blog. ¿Hay alguna forma que sintetice todos los pasos que tú indicas? ¿O es necesario ir haciéndolo bloque por bloque?
Espero tu respuesta. Un saludo.
Hola Yolanda! verás, no es necesario ir paso a paso.
Puedes cambiar varias fuentes del blog añadiendo la línea font-family: Sans-Serif; (con la fuente que desees) en el bloque que comienza con el nombre body {.
Ese bloque lo encontrarás en el CSS de tu plantilla (Diseño>edición HTML>expandimos artilugios).
Con esa línea cambiarás la fuente de algunos apartados del blog (no todos). Si aún sigues teniendo la misma fuente en determinados sitios (como los títulos de la barra lateral), utiliza este tutorial.
Uyyyyyyyyyyyy, con lo que me gustan a mí estas electropijadas!!!!!! jejeje. Me lo activo, para cuando decida que la letra que tengo me aburre... jejeje
Laube!!! jajajaja me encantó lo de electropijadas ^^. Desde que necesites algo dímelo ☺.
jejejeje... Ni lo dudes!!! Te tengo acribillado a preguntas!!!!!
¡No digas eso! me encanta responder cada una de tus dudas ☺.
¡Abrazos!
BUEN POST!!!
¡Gracias CHiCken!
Hola Jaime, genial como siempre!! he cambiado la letra con todos los apartados que das y algo he debido de hacer mal, porque en todos sitios me sale la comic sans, menos en los comentarios que deja la gente y en las entradas nuevas que escribo directamente, porque en las que escribo en word si me aparece. Muchas gracias.
Cristina, ¿Al escribir las entradas en Word, pegas el contenido directamente al editor de entradas?
Te comento que al publicar artículos copiados directamente del Word, la configuración cambia por completo, ya que word añade unas etiquetas y unos atributos que blogger no utiliza.
A partir de ahora, escribe las entradas en el word pero después pégalas en el editor haciendo clic en la pestaña "Edición de HTML" ;).
Para cambiar la letra en los comentarios, busca la línea:
#comments-block{
Y añade font-family: Comic Sans MS; debajo.
Hola Jaime te quería preguntar, no se que es lo que he hecho mal, porque me aparece la letra comic sans pero me sale en negrita, lo que dificulta su lectura, ¿me podrías echar una mano? y no se como arreglarlo normalmente las entradas las hago en word y las publico directamente no se si eso tiene algo que ver. Muchas gracias
Hola Jaime te quería preguntar, no se que es lo que he hecho mal, porque me aparece la letra comic sans pero me sale en negrita, lo que dificulta su lectura, ¿me podrías echar una mano? y no se como arreglarlo normalmente las entradas las hago en word y las publico directamente no se si eso tiene algo que ver. Muchas gracias
Cristina, busca los bloques que te muestro a continuación y agrega en cada caso lo que ves en negrita:
.post-body {
font-family:Comic Sans MS;
font-weight:normal;
line-height:1.6em;
}
#sidebar-wrapper {
float:right;
font-family:Comic Sans MS;
font-weight:normal;
overflow:hidden;
width:250px;
}
.sidebar h2 {
background:transparent url(http://img269.imageshack.us/img269/9342/florfrangipancopia.png) no-repeat scroll left center;
font-weight:normal;
padding:5px 5px 5px 35px;
}
De esa forma debe funcionar correctamente. Si sigues con el mismo problema házmelo saber ;).
Muchas gracias Jaime, ya está resuelto da gusto que eficiencia. Besitos
¡Estupéndo, Cristina! Ya veo lo bien que te ha quedado :D.
Abrazos.
Hola Jaime, soy Cati, una profesora de Primaria; siempre paso por tu blog para aprender algún truquito que le dé un poco de vidilla al blog de aula que tengo.Pienso que tú sí que eres un gran maestro.Eres sencillo y muy didacta. Gracias por tu esfuerzo y paciencia con los demás.Un abrazo.
¡Bienvenida CATI! No sabes lo mucho que me agrada leer tu comentario. Estoy completamente seguro de que tú también eres una gran profesora, trabajo en el cual se necesita más paciencia que en el mundo blogger ;).
Muchas gracias a ti por comentar. ¡Abrazos!
super super!! gracias por tu claridad me ha servido mucho
mi blog
¡Genial, Manu! Por cierto, muy atractiva la cabecera de tu blog.
Genial Jaime :D:D:D
El Balcon Siempre Me Ayuda, Tanto como con la Familia de periquitos y mi blog:D
Me alegra mucho oír eso Alejandro :D.