Descubre cómo puedes mostrar el carrito de WooCommerce en el bloque de navegación (menú) de forma condicional mediante código.
El bloque de navegación es el responsable de mostrar el menú en los temas de bloques de WordPress (o temas clásicos que hayan dado soporte). Permite mostrar un listado de items, que son bloques anidados, y ha mejorado muchísimo en las últimas actualizaciones.
Aunque se puede personalizar bastante desde la interfaz de usuario, no te permite mostrar u ocultar items de forma condicional. Por suerte, la versión de WordPress 6.1 introduce un filtro de PHP que permite interaccionar con el bloque de navegación.
Esto abre un campo de posibilidades inmenso, como por ejemplo, añadir el carrito de WooCommerce de forma condicional.
Vamos a ver cómo:
Snippet para añadir el carrito de WooCommerce al menú de forma condicional
Asegúrate de que estás usando un tema de bloques (por ejemplo el Twenty Twenty-Three) o, si estás usando un tema clásico, de que has dado soporte a las partes de plantilla y tienes una cabecera definida.
A continuación añade el siguiente snippet al fichero functions.php o a tu plugin de funcionalidades:
Para ver este código y los otros 2055 snippets de esta web,
identifícate o suscríbete aquí.
En este código utilizas el filtro block_core_navigation_render_inner_blocks
para añadir un botón al final del menú cuando el usuario está en una ficha de producto de WooCommerce ( is_singular('product')
).
O, en el segundo ejemplo, si quieres que se muestre siempre menos en la página principal.
La idea es que uses la etiqueta condicional que te vaya bien en cada caso (por ejemplo, is_home
, is_page
…).
Pero no tienes porqué limitarte solo a las etiquetas condicionales de WordPress, sino que puedes usar otro tipo de condicionales.
Por ejemplo, si quieres que el carrito solo se muestre en caso de que no esté vacío, puedes usar este código:
Para ver este código y los otros 2055 snippets de esta web,
identifícate o suscríbete aquí.
En este caso el bloque de carrito no se mostrará hasta que se añada, como mínimo, un producto.
Ya ves que tener un filtro con el que modificar el bloque de navegación te da una flexibilidad extra a lo que ofrece la interfaz de usuario.
Eso sí, ten en cuenta que al estar usando un filtro de PHP tienes la limitación de que el resultado solo lo verás en la parte frontal de la web, en el backend no se reflejarán los cambios.
Conclusiones
Como puedes ver, gracias al nuevo filtro del bloque de navegación de WordPress puedes añadir elementos al menú de cualquier tema de forma condicional.
En este caso añades el carrito de WooCommerce, pero las posibilidades son inmensas. En futuros tutoriales explicaré más formas de sacarle partido.
Si tienes alguna duda te leo en los comentarios. Y si quieres dejarme una sugerencia para futuros tutoriales, envíamela a través del formulario de contacto.
Todo ventajas de ser suscriptor. 😉