Cómo crear un mapa del sitio visual en WordPress (la forma fácil)

¿Alguna vez has visitado un sitio web grande y complejo y te has sentido perdido intentando encontrar lo que necesitas? Hemos notado este problema en varios sitios importantes como publicaciones de noticias o tiendas en línea, incluso si ya tienen un menú de navegación útil 😅

La buena noticia es que hemos descubierto una solución fácil a este problema: un mapa del sitio visual. Esta es una guía fácil de usar que ayuda a los visitantes a navegar por la estructura de un sitio.

En esta publicación, te mostraremos cómo crear un mapa del sitio visual en WordPress con un plugin fácil de usar.

¿Mi sitio web realmente necesita un mapa del sitio visual?

Un mapa del sitio es como un mapa de carreteras para tu sitio web, que muestra todas las páginas importantes y cómo están conectadas.

Si estás familiarizado con los principios de SEO para WordPress, entonces probablemente ya conozcas el término mapas del sitio XML. Estos están diseñados para los motores de búsqueda, ayudándoles a encontrar y comprender tu contenido.

Por otro lado, también existe el mapa del sitio HTML.

En esta publicación, nos centraremos en los mapas del sitio visuales, que son un tipo de mapa del sitio HTML que muestra la estructura de tu sitio de una manera más atractiva visualmente y fácil de entender que un mapa del sitio XML.

Si tienes un sitio web que atiende a diferentes tipos de usuarios, un mapa del sitio visual puede ayudar a guiar a cada visitante a la página o publicación más relacionada con su interés. Es como tener un guía amigable que muestra a todos a dónde ir.

Los mapas del sitio visuales también pueden ser excelentes para sitios web educativos o cursos en línea. Pueden mostrar la ruta de aprendizaje y ayudar a los estudiantes a comprender cómo se conectan los diferentes temas.

Para tiendas en línea con muchas categorías de productos, un mapa del sitio visual puede ayudar a los compradores a comprender tu gama de productos de un vistazo y encontrar las categorías que les interesan con más facilidad. Aquí tienes un gran ejemplo que encontramos en el sitio web de The Good Guys:

Teniendo esto en cuenta, veamos cómo crear un mapa del sitio visual en WordPress.

Cómo crear un mapa del sitio visual en WordPress sin código (fácil para principiantes) 🗺️

Solíamos recomendar el plugin Slick Sitemap para crear mapas del sitio visuales, pero no se ha actualizado en mucho tiempo. Y cuando lo probamos recientemente, descubrimos que no funciona tan bien como antes.

También intentamos usar Gutenberg y algo de CSS personalizado para crear un mapa del sitio. Esto funcionó al principio, pero a medida que agregamos más páginas a nuestro sitio, el mapa del sitio comenzó a verse extraño porque el CSS no podía seguir el ritmo de los cambios.

Nos gusta encontrar soluciones fáciles que te ahorren tiempo y no compliquen las cosas aquí en WPBeginner. Y afortunadamente, encontramos un excelente reemplazo de plugin llamado Simple Sitemap que hace bien el trabajo.

Para empezar, necesitarás instalar y activar el plugin de WordPress en tu sitio web. Una vez hecho esto, puedes proceder a crear una nueva publicación o página para tu mapa del sitio. O bien, puedes abrir una existente usando el editor de bloques de Gutenberg.

En nuestro caso, decidimos crear una nueva página llamada 'Mapa del sitio'.

Con el editor de bloques abierto, haz clic en el botón '+' en cualquier lugar de la página y selecciona el bloque 'Simple Sitemap'.

Por defecto, el plugin crea un mapa del sitio de tus páginas y sus subpáginas, pero no de tus publicaciones.

Si deseas agregar publicaciones al mapa del sitio, puedes ir a la sección ‘Configuración General’ en tu pestaña ‘Bloque’. Aquí, escribe ‘Publicación’ en el campo ‘Seleccionar tipos de publicación a mostrar’.

Una vez que lo hagas, encontrarás todas tus publicaciones mostradas debajo de la sección de páginas en el mapa del sitio.

A continuación, personalizaremos el orden en que se listan las páginas y las publicaciones. Puedes elegir entre título, fecha, ID, autor, nombre, modificado, orden del menú, orden aleatorio o recuento de comentarios. También puedes elegir entre el orden ‘Ascendente’ o ‘Descendente’.

Desplazándote hacia abajo, puedes elegir:

• Mostrar la etiqueta del tipo de publicación para diferenciar claramente entre páginas y publicaciones en el mapa del sitio.
• Mostrar los extractos de las publicaciones y páginas. Decidimos deshabilitar esta opción porque puede hacer que el mapa del sitio sea muy largo.
• Habilitar enlaces del mapa del sitio. Si deshabilitas esta opción, los usuarios no podrán hacer clic en los enlaces del mapa del sitio.
• Hacer que cada enlace se abra en una nueva pestaña cada vez que se haga clic en ellos, para que los usuarios no abandonen la página del mapa del sitio.

Cualquiera que sea la configuración que elijas dependerá de tus preferencias y las necesidades de tu sitio web, así que asegúrate de pensar cuidadosamente en estas opciones. Además, siempre puedes habilitar o deshabilitar estas configuraciones si cambias de opinión.

Debajo de esa sección se encuentra ‘Etiquetas de tipos de publicación’. Aquí, puedes reemplazar la etiqueta predeterminada del tipo de publicación con otro texto.

En nuestro ejemplo, hemos decidido reemplazar la etiqueta ‘Páginas’ por ‘Explora Nuestras Páginas’ como una llamada a la acción.

Finalmente, puedes abrir la sección ‘Configuración de Pestañas’.

Aquí es donde puedes habilitar pestañas para mostrar los enlaces de tu mapa del sitio. Por defecto, los enlaces de tu mapa del sitio se dividirán según su tipo de publicación. Esta puede ser una excelente opción si no quieres que tu página de mapa del sitio sea demasiado larga.

Una vez que estés satisfecho con el aspecto de la página del mapa del sitio, puedes continuar personalizando la página a tu gusto. Si necesitas ayuda, aquí tienes algunas guías para empezar:

• Cómo editar un sitio web de WordPress (Guía definitiva)
• Cómo agregar fuentes personalizadas en WordPress
• Cómo agregar una barra de desplazamiento personalizada a cualquier elemento en WordPress (si el bloque del mapa del sitio es un poco largo)

Cuando esté listo, simplemente haga clic en Guardar, Actualizar o Publicar.

Asegúrese de ver su nueva página en el móvil, escritorio y tableta para ver si se ve bien en todos los dispositivos o no.

Así es como se ve nuestro mapa del sitio visual:

Consejos adicionales para mejorar la navegación de su sitio web

¿Quiere hacer su sitio web aún más fácil de usar? Consulte estas guías a continuación:

• Cómo agregar un menú responsivo de pantalla completa en WordPress – Aprenda a crear un menú que se vea genial en todos los dispositivos.
• Cómo mostrar enlaces de navegación de migas de pan en WordPress – Ayude a los visitantes a comprender dónde se encuentran en su sitio.
• Cómo agregar navegación por teclado con teclas de flecha en WordPress – Haga que su sitio sea más accesible para los usuarios de teclado.
• Cómo crear un directorio de personal en WordPress (con perfiles de empleados) – Organice la información de su equipo de manera efectiva.
• Trucos para la barra lateral de WordPress para obtener los máximos resultados – Optimiza tu barra lateral para una mejor navegación y participación.

Esperamos que este artículo te haya ayudado a aprender cómo crear un mapa del sitio visual en WordPress. También te puede interesar nuestra selección experta de los mejores constructores de páginas de arrastrar y soltar para WordPress y nuestra guía definitiva sobre los elementos de diseño más efectivos para un sitio web en WordPress.

Si te gustó este artículo, suscríbete a nuestro canal de YouTube para obtener tutoriales en video de WordPress. También puedes encontrarnos en Twitter y Facebook.