Anclar el menú al borde superior del bloghacer fijo el menú sencillomenú ancladomenú fijoMenú fijo en la parte superior del blogTutoriales
Menú fijo en la parte superior del blog
 |
¿Recordáis el tutorial para instalar un menú personalizado sencillo? Da igual, os refrescáos la memoria aquí. Os enseñaba cómo poner un menú que no fuesen las páginas de blogger, un menú en el que los enlaces llevasen a donde vosotros quisiéseis.
Viendo que últimamente se ha puesto muy de moda eso de dejar elementos fijos en el blog, os cuento hoy cómo dejar ese menú fijo en la parte superior del blog para que esté siempre visible para los lectores de vuestro blog. Es un sitio ideal para poner enlaces a redes sociales, un botón para seguir el blog...
Partimos de este tutorial, suponiendo que ya tengáis ese menú instalado y lo tengáis en la parte superior del blog (no bajo la cabecera, sino sobre ella), de otra forma no quedaría bien.
Pues hacerla fija es tan fácil como añadir a esto:
#chromemenu{
width: 97%;
font: 11px Tahoma,Geneva,sans-serif;
font-weight: normal;
letter-spacing: 3px;
text-transform: uppercase;
background: #fff;
margin-bottom: 35px;
border-bottom: 1px solid #dcdcdc;
}
Esto:
position:fixed;
z-index:101;
Quedando así:
#chromemenu{
width: 97%;
font: 11px Tahoma,Geneva,sans-serif;
font-weight: normal;
letter-spacing: 3px;
text-transform: uppercase;
background: #fff;
margin-bottom: 35px;
border-bottom: 1px solid #dcdcdc;
position:fixed;
z-index:101;
}
Lo que está en amarillo es la primera etiqueta del código que ya tenemos en nuestro CSS, justo después de <style type='text/css'>.
¡Y ya está! Tan fácil como pegar eso en vuestro código. Os recuerdo que con este tutorial podréis poner la fuente que queráis en el menú que tengáis instalado.
No hace falta que repita que tenéis que hacer siempre vista previa antes de guardar los cambios.
Espero que os sirva de ayuda, y ya sabeís si tenéis alguna duda, mandadme un correo.
No hace falta que repita que tenéis que hacer siempre vista previa antes de guardar los cambios.
Espero que os sirva de ayuda, y ya sabeís si tenéis alguna duda, mandadme un correo.
{Imagen: Unsplash}
13 comentarios
Muy útil sin duda :D ¡gracias!
ResponderEliminar¡Gracias a ti por pasarte a verlo! :D
EliminarTe juro que lo leo, pero no me entero de nada, ajjajajajaa,
ResponderEliminar¡Pero si es sólo copiar y pegar! xD
Eliminar¡Muy útil! Yo uso un script y cuando quiero poner algo con otro script se daña todo xD. Este me será más útil, gracias :D. Por cierto linda ¿sabes como colocar en pestañas: archivo del blog, blog rol, etiquetas?... lo vi alguna vez y siempre he querido hacerlo pero no encuentro un tutorial.
ResponderEliminar¿Te refieres a poner varios gadgets en uno solo y que estén en pestañas para hacerlos visibles? Claro, si quieres hago un tuto :D
EliminarHola! Acabo de descubrir tu blog i tu canal de Youtube i me encantan, especialmente la portada, soy muy fan del diseño y me gusta mucho como has hecho el tuyo. Por eso te quería pedir si me podías ayudar, es que me gustaría tener un dibujo así de mono en mi blog pero yo no sé dibujar :(
ResponderEliminarSi no es molestia ni nada me podrías decir quien te ha hecho ese dibujo? Mil gracias!
¡Gracias! ¿Te refieres a la muñequita? En la descripción de los vídeos está el enlace de la web de Natalia (nataliacgallego.com). Ella me lo hizo :)
EliminarBua, mil gracias! :D <3
EliminarContinua así, me encanta el blog!
¡Muchas gracias!
EliminarMe encanta la gente que domina estos temas del maldito blogger, me encanta la gente a la que le gusta la fotografía y los gatos, como a ti.
ResponderEliminar¡Muchísimas gracias tocaya! Aunque todavía me queda mucho que aprender para domirnar realmente a la bestia Blogger :D
Eliminar¡Hola! Este tutorial también me sirve para lo que estaba buscando :)
ResponderEliminarMe gustaría conseguir una cosa: que el menú aparezca debajo de la cabecera y que cuando hagas scroll hacia abajo se quede en la parte de arriba fija. ¿Sabes como podría hacerlo? ¡Gracias!
No está permitido en este blog dejar enlaces en los comentarios. Tu nick es un enlace directo a tu perfil, donde si queremos, podemos visitar tu blog.
Somos librófagos, pero si haces spam también te comeremos.
En caso de no cumplir con esta norma, tu comentario será dirigido directamente a la carpeta SPAM.