Si tienes un Blog creado en la plataforma Blogger y los títulos de los Gadgets o el Titulo de tus entradas o post, inclusive el Titulo de tu Blog, salen alineados a la izquierda y por motivos de diseño y atractivo deseamos centrarlos para que tengan un mejor aspecto y no sabes como centrarlos, esta entrada es para ti XD. En esta entrada aprenderemos a centrar los Títulos de nuestro Blog en Blogger, ya sean de los Gadgets de las entradas o el titulo general.
Para centrar los Titulos en nuestro Blog, nos adentraremos un poco al código CSS, pero no se preocupen no es nada complicado, al contrario es fácil de entender y de aplicar.
CENTRAR LOS TÍTULOS DE LOS GADGETS:
Los Gadgets sin duda son lo dinámico e interactivo del Blog, en una entrada anterior vimos como poner una imagen de fondo al Titulo de los gadgets, así que esta ves aprenderemos a centrar el Titulo de los gadgets, para hacerlo solo tenemos que aplicar el siguiente código:
Si deseas que el Titulo se alinee a la derecha solo sustituye center por right y si quieres al lado izquierdo pon left, aunque esta alineación es por defecto.
Este Código lo añadimos en la opción añadir CSS de Blogger:
CENTRAR LOS TÍTULOS DE LAS ENTRADAS:
Otro elemento importante y de mucha importancia son los Títulos de las entradas, recuerden nunca dejar de poner un Titulo a sus post. Para centrar el Titulo de nuestras entradas usamos el siguiente código:
De la misma forma que en los títulos de los Gadgets si queremos alinear el Titulo a la derecha sustituimos center por right.
CENTRAR EL TITULO DEL BLOG:
Para finalizar, centrar el Titulo del Blog, también puede ser parte del diseño de nuestro Blog, así que para lograr esto solo agregamos el siguiente código:
OJO: Las clases e identificadores que estamos usando, son generalmente las usadas por las plantillas de Blogger, si por algún caso usas una plantilla que no tiene dichos elementos, te recomiendo inspecciones los títulos de tu Blog, e identifiques que clase o identificador los define, luego el código para centrarlos es el mismo: text-align:center;
Cualquier duda o Aporte Hacerlo Por Comentarios. Gracias por si Tiempo!
Qeé bien!!! Hace tiempo estaba pensando como hacer esto, acabo de ponerlo en mi blog, pero solo me ha centrado alguno de los títulos de los gadgets. Me estará faltando algo?
ResponderEliminarMuchísimas gracias por tu ayuda.
Ale
Hola Alejandra, me alegra que te aya servido, me ha pasado tu problema pero lo e solucionando añadiendo el código al gadget respectivo que no se centra, así que seria cuestión de que identifiques la clase o identificador que define el titulo de ese gadget y añadir el código text-align:center;
EliminarMe ha pasado exactamente lo mismo, hay títulos de gadget que no se centran. He leído como corregirlo pero no se cómo hacerlo, no sé como encontrar el gadget en HTML. Si fueras tan amable, ¿podrías ayudarme?
EliminarGracias de antemano. Un saludo.
HOLA SOY YO TENGO UN PROBLEMA QUIERO CENTRAR EL TITULOS DE LAS ENTRADAS Y AGO LOS PASOS QUE TU HACES Y NADA NO SE PONE EN EL CENTRO NESECITO TU AYUDA ASME ESE FAVOR AYUDAME
ResponderEliminarHola Owen me hace raro que no se te centren los títulos de las entradas con ese código CSS. quizás no estemos identificando bien la clase de los títulos de tu blog, pero me hace raro ya que esa Clase que menciono en este tutorial es general para todas las plantillas de blogger. Me ayudara que me des la dirección de tu blog para poder identificar la clase que define los títulos de tus entradas y poder ayudarte!. Saludos Owen.
EliminarHola aki esta mi blogerr http://zonadeldescontrol1.blogspot.com/ ayudame
ResponderEliminarHola Owen estaba analizando un poco el código de tu blog y tienes razón, con el código que pongo en este tutorial no centra tus títulos, así que estuve probando y llegue a que podíamos hacer lo siguiente:
Eliminarh3 post-title
{
text-align:center;
}
o puedes solamente usar lo siguiente pero no es muy recomendado pero funciona:
h3
{
text-align:center;
}
Pruebalos Owen y me pasas el dato si te funciona. Saludos :D
nada no centra que dices si te doy mi blog y lo centras tu porque yo para esto soy un poco brutico
ResponderEliminarHola Owen, con permiso de Neytor te digo lo que quizá sea una solución...la que a mí me ha servido después de visitar este y otros blogs sin conseguir centrarlo y es así.
EliminarEn cada entrada, cuando se hace y se ponen las fotos etc, pues arriba donde pones el título hay que encerrarlo con las etiquetas "center" TÍTULO DE LA ENTRADA "/center"
Como el comentario no me deja poner estos signos: < > he tenido que poner las comillas: " " pero hay que sustituirlas por esos: < >
O sea: TÍTULO DE LA ENTRADA
ok?
Hay que hacerlo en cada entrada, claro, pero a mí es lo único que me ha servido.
Hola gatzaroimage gracias por brindarnos tu aporte, el Blog te lo agradece.
EliminarExcelente aporte. Llevo varios días buscando el modo correcto con el código exacto para centrar los títulos de las páginas de mi blog. Entrando en:
ResponderEliminarPlantilla -> Personalizar -> Avanzado ->Añadir CSS y copiar y pegar el código:
.post-title
{
text-align: center;
}
y pinchar en "Aplicar al blog" se centran todos los títulos de las páginas.
Muchísimas gracias en particular por ofrecerme la solución correcta,
y muchísimas gracias en general por aportar tus conocimientos gratuitamente en este blog al servicio de todos los internautas.
Saludos y ánimo para tu excelente trabajo.
Gracia Luis me alegra que te aya sido de mucha utilidad. estamos para servir. Gracias por tu comentario!
Eliminarqueria preguntarte si sabias la forma de centrar el menu de paginas en blogger, con css, por que ahora cambiaron algunas cosas en blogger y es mas dificil encontrar ciertos codigos para modificar, todos me han dicho que modifique o agregue esto o aquello pero no saben decirme donde y creo que seria mucho mas facil si lo hiciera directamente en css, el problema es que mi blog tiene el titulo centrado pero quiero centrar tambien los menues, por que quedan algo incomodos( http://mediafuego.blogspot.com/ ), espero tu respuesta y sino tenes la solucion, al menos recomendame con alguien, desde ya gracias
ResponderEliminarHola David me di una vuelta por tu Blog, y encontré una solución no tan recomendada pero si te permitirá obtener lo que quieres, es usar
Eliminar.widget ul {
margin-left: 300px
}
Haber intenta con eso, aunque no es muy recomendable porque debes tantear la distancia hacia la izquierda en px para poder centrarlo. Gracias por Comentar espero te sirva.
Muy interesante articulo, me ha servido mucho,
ResponderEliminarPero me podrías decir como se centra también la fecha de las entradas que va encima del titulo?
graicas
hola Esther puedes aplicar el siguiente estilo:
Eliminar.date-header
{
text-align:center;
}
espero te sirva gracias por comentar. Cualquier inconveniente solo deja un comentario :D
Muchas gracias ! me ha sido super útil llevaba mucho tiempo buscándolo....
ResponderEliminargracias
De Nada Esther estamos para servirte. Gracias por comentar.
EliminarUn truco muy útil y sencillo. Funcionó a la perfección.
ResponderEliminarGracias
Hola Victoria, me alegra que te aya gustado el post y sobre todo que te aya sido muy útil. Gracias por Comentar Saludos!!!
EliminarGracias, funcionó el codigo para centrar títulos del blog, Gracias Eduardo!.
ResponderEliminarMuchas gracias ^u^ lo entendi de inmediato :D
ResponderEliminarHola!! ante todo enhorabuena por tu blog. Tengo un problema ( ya he variado el css y el html), no consigo que el título del blog me salga centrado http://sixlooks.blogspot.com.es/ . Muchísimas gracias
ResponderEliminarHola Neytor,
ResponderEliminarquiero poner el título a la derecha de la imagen, algo lo he desplazado pero me gustaría que el título quedara a la derecha de la imagen.
Esta es la dirección de mi blog, para que veas la cabecera. ¿qué puedo hacer?
muchas gracias
Perdona no he puesto la dirección del blog:
ResponderEliminarhttp://orientafuenmayor.blogspot.com.es/
Hola! Después de que no me funcionara he probado h3 { text-align:center; } y si me centra los títulos de las entradas :D Pero querría que me centrase los títulos de los gadgets ¿Me puedes ayudar? ^^
ResponderEliminarUtilizo .widget .title { text-align: center; } y sigue si centrarme los titulos de los gadgets D:
EliminarHola Nezumi estuve viendo tu blog, y vi tu codigo y es un poco diferente qeuisas por el echo de tu plantilla, pero probe con:
Eliminar.widget
{
text-align:center;
}
espero te sirva cualquier problema solo comentalo, estoy para ayudarte! saludos!
¡Me va perfecto! Muchísimas gracias por la ayuda :D
EliminarDe nada Nezumi, estamos para ayudarte, cualquier otra duda no dudes en preguntar! espero que sigas visitando el blog!
EliminarPor supuesto! Oye espero no molestar pero ya que estoy.. ¿hay alguna manera de quitar lo de Plantilla Con la tecnología de Blogger que sale abajo del todo? Muchisimas gracias de nuevo
EliminarHOLA Nezumi, descuida no es ninguna molestia, si hay una forma, te vas a diseño en el portal de tu blog, y buscas el gadget de reconocimiento que generalmente esta abajo de todos como pie de pagina, hay puedes editar lo que dice puedes poner tu propio contexto al igual que hice yo, o si no deseas nada simplemente elimina el gadget, espero te ayude, si tienes inconvenientes no dudes en preguntar. gracias por comentar!
EliminarMuchisisisimas gracias. Dios te bendiga y que sigas ayudandonos a todos.
ResponderEliminarDe nada, estamos para ayudar!
EliminarMuchas gracias, muy buen post. No tuve problemas para implementar el cambio. Saludos
ResponderEliminarMuchas gracias muy buen post, pero no se centran todos los titulos de los widgets :c
ResponderEliminarMuchísimas gracias :-)
ResponderEliminarhttp://i-learn-english-with-isa.blogspot.com.es/
MUCHAS GRACIAS EL BLOG ESTA MUY INTERESANTE
ResponderEliminarola men una pregunta como hago para poner el titulo del post en la imagen para mostar del la entrada
ResponderEliminar¡Enhorabuena!, excelente información.
ResponderEliminarMuchas gracias. Llevo tiempo intentando centrar el título del gadget del índice y no había manera. Al fin lo he conseguido con tus consejos. y por casualidad no podrías decrme cómo cambar el aspecto de los marcos de los gadgets?? sólo encuentro cambiar tipo de marco, pero me gustará darles forma y sombra.
ResponderEliminarEste comentario ha sido eliminado por el autor.
ResponderEliminarMuchas gracias. Había probado otros códigos y no funcionaban. Los tuyos funcionan perfectamente!!!
ResponderEliminar¡Gracias por la ayuda! Me vino bárbaro el post.
ResponderEliminaryo quiero poner como titulo de blog un titulo que hice en photoshop en formato png pero no se como hacerlo.llevo 2 dias con esto y no se como se hace. por favor alguien sabe como????
ResponderEliminarmi blog tiene solo a un lado pequeño el titulo y no puedo cambiar por favor ayuda este es mi blog
ResponderEliminarhttp://recetafacilesdeliciosas.blogspot.com/
es un deber y no ocnsigo que el titulo ni la foto ocupe todo el espacio
A mi me ocurre lo mismo pero solo en la versión móvil, no se aplica el CSS aunque ponga. Mobile y el resto o aunque ponga solo h3...
ResponderEliminarProbé a poner center título /center (con las flechitas >) y se centra pero no a lo largo... Es como si estuviera el título metido en una caja en el lado izquierdo...
muchas gracias :3
ResponderEliminarGracias por tu aporte. La centrada del título de los gadgets funcionó perfectamente. La pregunta que tengo es ¿donde coloco el código para centrar el titulo de las entradas? No lo has escrito. Lo coloqué debajo del anterior dejando 2 espacios pero no funciona. Te agradezco tu ayuda. Bendiciones
ResponderEliminarPuedes entrar en el código fuente de tu blog, si no entiendes mucho codigo primero inspecciona elemento con la opción del navegador, una vez que tengas localizado dicho codigo puedes utilizar la clase y centrarlo con CSS.
EliminarActualización. Leí la sugerencia que le dió a Owen y la segunda me sirvió. Gracias
ResponderEliminarDespués de dar muchas vueltas, aquí encontré la solución. Gracias
ResponderEliminar