Configuración de menús y paleta de colores en WordPress
Clase 14 de 25 • Curso de WordPress No-Code
Resumen
Nuestro sitio web está avanzando, pero requiere algunos detalles clave para lograr una experiencia coherente y profesional. En este tema te mostramos cómo optimizar el menú de navegación y el diseño visual, utilizando las herramientas de WordPress y el tema Astra.
¿Cómo configurar el menú principal en WordPress para mejorar la navegación?
La navegación inicial solo tenía un enlace a la página principal, lo cual limitaba al usuario. Para solucionarlo, desde el panel de administración:
- Ingresa en el menú Apariencia y selecciona Menús.
- Crea un menú nuevo, nombrándolo Main como menú principal.
- Agrega los elementos relevantes. Aunque solo la página principal está disponible de inicio (y está presente ya en el logo), puedes añadir el taller de tintes y renombrarlo para mayor claridad.
- Agrega vínculos personalizados para páginas futuras, como blog y tienda, usando un numeral (“#”) para enlaces temporales.
- Recuerda: cuando esas páginas existan, puedes actualizar sus URLs o reemplazar los enlaces fácilmente.
Con esta estructura, la barra de navegación es más funcional y clara para el usuario.
¿Qué opciones existen para modificar el pie de página en Astra?
El pie de página tenía un aviso del tema usado en WordPress que no resulta deseado. Para cambiarlo:
- Ingresa desde Apariencia en Personalizar para abrir el Customizer.
- Localiza la sección Pie de página y edita el elemento de copyright.
- Cambia el texto como prefieras y elimina referencias al autor del tema, por ejemplo, "sitio web creado para Platzi.com".
- Ajusta el diseño: puedes modificar el relleno, el margen y colores de fondo, aunque estos últimos pueden verse afectados por prioridades de los estilos.
Si el cambio de color no impacta como esperabas, es porque otro estilo tiene mayor prioridad, un concepto importante en CSS.
¿Cómo adaptar la paleta de colores del tema Astra a tu marca?
A veces se mantienen colores predeterminados en botones o enlaces que no coinciden con la identidad visual. Para adaptar la paleta:
- Accede a Personalizar y elige el menú Global, entrando en Colores.
- Cambia los colores de énfasis y enlaces según tu guía de estilo. Usa los códigos correctos para asegurar coherencia.
- Ejemplo propuesto: enlaces normales en verde oscuro, énfasis y estado hover en verde claro.
- Si aún persisten colores no deseados, identifica los sectores responsables y cambia desde la paleta general con tus códigos propios.
- Verifica los cambios recargando la página como usuario y guarda la configuración.
Estos ajustes garantizan que el sitio refleje fielmente la identidad visual. Si tienes dudas sobre edición de menús o colores, cuéntanos tu experiencia o comparte recomendaciones en los comentarios.