Se edita el código HTML de la plantilla (sin olvidar hacer antes una copia de seguridad), se marca "Expandir plantillas de artilugios" y se busca el apartado dónde está "maxwidgets". Con CTRL+F (buscar) llegais enseguida. Es algo como esto:
<div id='header-wrapper'>
<b:section class='header' id='header' maxwidgets='0' showaddelement='no'>
<b:widget id='Header1' locked='true' title='Aquí saldrá vuestro título (cabecera)' type='Header'>
<b:includable id='main'>
<b:section class='header' id='header' maxwidgets='0' showaddelement='no'>
<b:widget id='Header1' locked='true' title='Aquí saldrá vuestro título (cabecera)' type='Header'>
<b:includable id='main'>
Ahora hay que cambiar el valor de maxwidgets de 0 a "3", showaddelement pasarlo a "yes" y locked ponerlo en "false". El primero para que nos permita tener más de un elemento en la cabecera, el segundo para poder añadir los nuevos elementos y el tercero para poder ordenar los distintos elementos. Guardar Plantilla.
Ya podemos añadir otro elemento y colocarlo encima o debajo de la cabecera. Lo más fácil para pestañas, es crearlas con un programa de dibujo, subirlas a un borrador del blog (o alojarlas en un servidor de imágenes) y luego añadir un elemento HTML/JAVASCRIPT como éste:
<a href="http://direccióndevuestraweb/search/label/etiquetaamostrar">
<img border="0" style="CURSOR: hand" alt="textoalpasarporencima" src="http://direccióndelaimagendelapestaña"/></a>
<img border="0" style="CURSOR: hand" alt="textoalpasarporencima" src="http://direccióndelaimagendelapestaña"/></a>
Así quedaría si ponemos dos veces el anterior código, cada uno con una dirección distinta de imagen (pestaña). Hay que repetirlo tantas veces como botones se quieran poner.
- Ver Imagen con pestañas en cabecera 1.
- Otra forma de crear etiquetas
¿Vemos otro post al azar por si le encuentras utilidad o quizás prefieres ser más metódico y suscribirte a nuestras entradas por correo? También puedes imprimir este artículo y por supuesto compartirlo en redes sociales si fue de tu agrado.
muy bueno todo lo que publicas sobre blogger,estuve probando lo de los menus y el problema que tengo es que me queda espacio entre los menues y el slidebar y la primera entrada como puedo hacer para que queden pegados,gracias y saludos
ResponderEliminar¿Dónde estás poniendo el menú? Sería bueno que me mandaras una captura de pantalla. Pon el enlace a la imagen en tu comentario o envíamela por e-mail.
ResponderEliminarSaludos
quiero agradecer a oloman que me ayudo a solucionarlo,aca les dejo lo que era un error muy tonto,despues de estar varias horas armando el blogger se me habian quemado las neuronas......no me di cuenta que tenia habilitado el blogger solo para que entra yo y me aparecian el simbolo de herramientas que ocupaba el un espacio espacio entre el menu y las entradas,no me quiero acordar que me volvi loco tratando de encontrar la solucion...mate algunas neuronas que se le va a ser....
ResponderEliminarPERO QUE GRANDE ERESSSS!! joder! miles de preguntas contestadas en un sólo site!! mi más sincera enhorabuena, chapó!
ResponderEliminartengo un problema al intentar hacer el cambio en el HTML sale esto---- Se ha encontrado más de un artilugio con el ID: HTML1. Los ID de artilugio deben ser exclusivos.----
ResponderEliminarcomo lo puedo solucionar
Hola Doble D. Sólo busca uno de los artilugios HTML1 y cambia su nombre. Por ejemplo ponle HTML71 para no fallar.
ResponderEliminarOloman, estoy muy contenta, llevaba tiempo buscando hacer esto y o no lo encontraba por ninguna parte o lo que encontraba no me salía, pero este me ha salido a la primera y justo lo que yo queria. De hecho creo que esta mañana te lo he preguntado en otro post. Un millón de gracias!
ResponderEliminarYa que estoy, se le podria aplicar un efecto rollover?
Je, je. Te entendí otra cosa Laura y te dejé un link que no sé si te valdrá. Pero ahora que pides lo del rollover, creo que te va a venir de fábula:
ResponderEliminarhttp://oloblogger.blogspot.com/2008/09/botones-en-movimiento-rollover.html
Hola!Mi problema es que he pagado para que me hicieran un set para mi blog, y una vez terminado, me dice que no sabe colocar las pestañas en horizontal debajo de la cabecera. Yo sé que ahora blogger tiene un gadget para poder hacer esto, pero ...¿qué pasa si las etiquetas las quiero con las imágenes que me han hecho para cada pestaña?No sé si me explico bien. Me encantaría poder utilizar esas imágenes como pestañas.Me puedes ayudar?
ResponderEliminarTadenay, por lo que he visto, cada botón es un gadget independiente en tu barra lateral.
ResponderEliminarToma el código de cada uno de ellos y cópialo uno a continuación de otro, sin saltos de línea.
Luego, todo junto, lo pegas en un nuevo gadget (tendrás que eliminar los anteriores una vez que veas que sale como quieres). Por último, mueves ese nuevo gadget a la parte superior pinchando y arrastrando.
Hola
ResponderEliminarEstoy intentando alinear una imagen,a la derecha del titulo del blog, y no lo consigo.
La cabecera esta dividida en dos partes, y aunque en diseño de plantilla he logrado alinearlos. Al abrir el blog la imagen sigue saliendo un poco mas bajo. La imagen la he recortado al maximo en altura.
He estado mirando los cuatro temas que tienes acerca de la cabecera de un blog, y lo mas que he conseguido es poner el elemento "añadir un gadget" encima del titulo del blog.
¿Sabes si hay algun modo de alinear imagen y titulo?
El blog es "http://mcpepo01.blogspot.com"
Saludos
toctoc06, creo que el único problema es que diste demasiado porcentaje a los dos HEADER. Prueba a poner un valor inferior aquí:
ResponderEliminar.header2 {width:48%; float: right; margin:0 auto 1%;}
Por cierto, el último 1% anula ese margin, pero es que para lo que lo quieres, tampoco te hace falta:
.header2 {width:40%; float: right; }
! Perfecto !
ResponderEliminarGracias por el apunte.
Saludos
Este comentario ha sido eliminado por el autor.
ResponderEliminarDoremi Filicos, cambiada plantilla y solucionados todos los problemas de una ¿no?
ResponderEliminar¿Es posible, sin usar imágenes, dar un color diferente a cada pestaña? Concretamente, lo que quiero hacer es que al poner el ratón encima de una pestaña salga un color solo para esa pestaña, pero sin tener que usar imágenes de ningún tipo.
ResponderEliminar¿Se puede?
Si las pestañas tienen un color plano hecho desde CSS, sólo tienes que añadir al elemento con el que formas esas pestañas -no detallas si la haces con DIV, listas LI, etc.- la pseudoclase :hover y luego otras propiedades de fondo distintas para ese efecto.
EliminarPor ejemplo, si tienes algo así:
#menu li {background: #fff;}
...tendrás que añadir esto otro para que al pasar el ratón por encima se vuelvan negras:
#menu li:hovr {background: #000;}
Yo lo tengo así:
Eliminar/* Tabs
----------------------------------------------- */
.tabs {
margin-right: 8px;
margin-left: 8px;
}
.tabs-inner .widget {
background: #23b14d;
}
.tabs-inner .widget li a {
display: inline-block;
padding: 8px 14px;
font: normal normal 14px Arial, Tahoma, Helvetica, FreeSans, sans-serif;
color: #1f3747;
border-left: 1px solid #3b7481;
}
.tabs-inner .widget li.selected a, .tabs-inner .widget li a:hover {
color: #1f3747;
background-color: #446688;
text-decoration: none;
}
.main-inner .widget {
margin: 0;
}
Y serían 8 pestañas diferentes.
Eso te debería funcionar con el color de fondo #23b14d en estado normal y on el color #446688 cuando haces hover. Lo más que puedes hacer es colocar el bakground normal en .tabs-inner .widget li a
Eliminar¿Entonces no se puede?
EliminarCreo que dije lo contrario. De todas maneras, si es tu menú superior, ahí te salen en verde/azul según haces hover o no ¿No es eso lo que quieres?
EliminarHola.!
ResponderEliminarTengo la cabecera de mi blog de esta forma, lo que quisiera saber es, si puedo dividir la cabecera en dos? Te lo pregunto por que lo he querido hacer pero a la hora de buscar unos codigos, no los encuentro.. me podrias ayudar?
Saludos
Hola. En esta serie de 3 entradas explico cómo dividir el footer del blog en varias columnas. Con el mismo sistema puedes dividir la cabecera:
Eliminarhttp://www.oloblogger.com/2009/05/plantilla-blogger-crear-secciones.html
Espero que te sirva.
Hola, lo leeré espero me sirva y más que todo espero entenderle ;) saludos y gracias
ResponderEliminar