Muchos de los temas en WordPress ofrecen la opción de fijar la cabecera o menú únicamente en las opciones premium. Ahora no es problema con este código CSS para dejar fijo el menú en WordPress.
En este articulo incluyo el código para fijar la cabecera en WordPress y el Manuel paso a paso para integrarlo en cualquier tema de WordPress.
Si conoces un poco de programación, debes saber que instalar plugin para dejar fija la cabecera en WordPress no es buena práctica para la velocidad del sitio web, ni para el Seo. Teniendo en cuenta que los plugin además del CSS para fijar la cabecera; también agregan código extra de JavaScript, PHP y CSS que no necesitamos para fijar la cabecera.
Es por eso por lo que comparto este Código CSS para dejar fijo el menú en WordPress, ya que el código únicamente agrega 6 líneas de código CSS.
Código CSS para menú fijo al hacer Scroll
/* Código de estilo para el menú superior fijo */
.menuFijo-superior {
position: fixed;
top: 0;
left: 0;
right: 0;
z-index: 9999;
background-color: White;
}
/* Añade aquí los estilos adicionales que desees para el menú fijo */
Como agregar el código CSS en WordPress
Dentro del escritorio de WordPress ir a apariencia, después a personalizar que es donde incluiremos el código.
Después en CSS adicional.
Ahora tenemos que identificar la clase del menú. Para hacerlo damos clic derecho sobre la pagina web, y nos dirigimos a la opción inspeccionar.
Para ubicar fácilmente la clase del menú debemos elegir la opción de seleccionar elemento con el mouse…
…y ponemos el cursor sobre el menú donde vamos a agregar el CSS para dejarlo fijo en la parte superior.
Después de identificar la class, ahora lo que resta es incluirla en (.id-menuFijo-superior) modificando la clase.
Si todo salió bien el código CSS para dejar fijo el menú en WordPress deberá quedar así:
Listo, con este código css queda fijo el menú.
Si prefiere cambiar el color del menú, modifique el (background-color: White;)