Revista Blog

Tutorial Blogger: Cómo hacer un menú por categorías

Publicado el 10 septiembre 2014 por Laura Conde @LaureKif

Buenísimos días a tout le monde!
Por fin vuelven los tutoriales blogger!! Yujuuu, los he echado mucho de menos, porque la verdad es que me encanta prepararlos. :D
Antes de empezar con el de hoy, que además es bien cortito; quiero comentaros sobre esta temporada en Miss Lavanda, rápido que tampoco me quiero enrollar :P
Voy a bajar un poco el ritmo de publicaciones, con mucha mucha pena, pero ya me es imposible actualizar tanto. Entre la tienda y la uni apenas puedo sacar tiempo; y yo publicar por publicar no, soy perfeccionista y no podría hacerlo :D
Así que "nuevo" horario de publicación:
• Lunes y miércoles a las 11h: tutoriales, freebies, recursos, fotografía... vamos de lo que hablo en el blog normalmente.
• Domingos a las 11h: nuestra sección para conocer blogs, los Domingos Molones. Y el primero de cada mes la sección Con Gafas 3D que hacemos Little Haggi y yo en colaboración.
• Todos los 20 de mes a las 11h El Proyecto de la A a la Z.
En vacaciones y periodos que no tenga uni posiblemente publique los viernes, porque yo estarme quieta como que no.
Y ahora lanzo una pregunta: ¿os interesaría una sección de inspiración en el blog? La haría una vez al mes un viernes y os enseñaría una recopilación de cosas de diseño gráfico y web inspiradoras. Bueno si es así me lo dejáis en un comentario :D
Y ahora sí:
Tutorial Blogger: Cómo hacer un menú por categorías
Bueno antes aclarar, que no es un menú como el de las páginas de blogger, así que no se puede poner el enlace a la página principal ni a páginas estáticas. Funciona igual que las etiquetas, ya que es ese mismo gadget pero con un poco de estilo para que quede más chachi.
Lo primero que tenemos que hacer es obviamente ir a Diseño → Agragar un gadget, elegimos el de etiquetas y marcamos la opción nube, esto es muy importante. Además, si tenéis muchas etiquetas podéis seleccionar las que queráis que aparezcan.
Tutorial Blogger: Cómo hacer un menú por categoríasBien, hecho esto, vamos a ir a Plantilla → Personalizar → Avanzado → Añadir CSS, y pegamos este código:
.cloud-label-widget-content {
text-align: center; /*Donde queréis que quede alineado el texto*/
float:center;
font: normal normal 12px Arial; /*Tipografía*/
text-transform: uppercase; /*Para que quede en mayúsculas, si no borrar esta línea*/
}
.label-size a {
display: block;
margin: 2px 2px 0 0;
padding: 4px;
border: 1px solid #aaaaaa; /*Si queremos borde, si no borrar esta línea*/
color:#aaaaaa; /*color del texto*/
background: #ffffff;  /*color de fondo*/
text-decoration:none;
}
.label-size a:hover {
border: 1px solid #aaaaaa; /*Borde al pasar por encima el ratón, si no queréis borde, borrar esta línea*/
color:#333333; /*Color del texto al pasar el ratón por encima*/
background: #cccccc; /*Color del fondo al pasar el ratón por encima*/
text-decoration:none;
}
• Por defecto está puesto para que el texto esté alineado en el centro, si lo queréis a la izquierda o derecha, sustituid center por left o right respectivamente.
• La tipografía que vais a usar, podéis ajustar su tamaño cambiando el 12 por el que preferáis y la tipografía usada cambiando el Arial por el nombre de dicha fuente.
• Si vais a usar un borde podéis personalizar el grosor cambiando el 1, el tipo de línea cambiando el solid (dashed es a rayas y dotted a puntitos) y el color cambiando su código hexadecimal. Si no queréis el borde borráis esa línea de código y listo.
• Podéis ponerle un color de fondo y cambiarle el color al texto :D
Y esto ha sido todo, un tutorial bien corto ¿verdad?
Tutorial Blogger: Cómo hacer un menú por categorías
Espero que os haya gustado este tutorial y por supuesto que os sea muy muy útil ;)
Si es así me lo decís y lo compartís por vuestras redes que para mí es un favor muy grande que yo no doy más de mí para andar en todas las redes sociales jajaja ¡Muchas, muchas gracias!
Pasad un miércoles chachi!! Besotes muy fuertes!! Laura (que ahora mismo está en la universidad hasta las 20h snifff :P)



Volver a la Portada de Logo Paperblog