# 2.8.6 Menú < Ajustes



# 2.8.6.1 Menú interfaz < Ajustes

El menú principal de navegación de la tienda pública puede ser creado según preferencias. Se pueden añadir los elementos que se quieren mostrar.

**Es posible añadir varios tipos de elementos:**

- Categorías.
- Productos.
- Páginas (CMS).
- Enlaces personalizados.

Ejemplo de configuración de menú principal vista pública.

[![image-1665477714134.png](https://kb.wakaprint.com/uploads/images/gallery/2022-10/scaled-1680-/image-1665477714134.png)](https://kb.wakaprint.com/uploads/images/gallery/2022-10/image-1665477714134.png)

#####   


#####   


##### **1. Personalización del menú principal**

Desde del gestor sección Ajustes-&gt;Menú, se gestionan los elementos visibles para el cliente en el menú principal de la tienda.

[![image.png](https://kb.wakaprint.com/uploads/images/gallery/2025-11/scaled-1680-/cdcimage.png)](https://kb.wakaprint.com/uploads/images/gallery/2025-11/cdcimage.png)

#####   


#####   


##### **2. Interfaz de personalización de elementos del Menú**

La interfaz se presenta en dos columnas. en una tercera columna se dan indicaciones de funcionamiento. A efectos de este manual se explicarán las dos segundas columnas. Izquierda y derecha vista desde el usuario.

[![image.png](https://kb.wakaprint.com/uploads/images/gallery/2025-11/scaled-1680-/n0Aimage.png)](https://kb.wakaprint.com/uploads/images/gallery/2025-11/n0Aimage.png)

<table border="1" class="align-center" id="bkmrk-%C2%A0columna-derecha-aju" style="border-collapse: collapse; width: 94.0741%; border-width: 1px; height: 272.8px;"><colgroup><col style="width: 12.1107%;"></col><col style="width: 17.6718%;"></col><col style="width: 70.1928%;"></col></colgroup><tbody><tr style="height: 57.6px;"><td class="align-left" rowspan="7" style="border-width: 1px; height: 57.6px;">**Columna**

**derecha**

  
</td><td class="align-left" style="border-width: 1px; height: 57.6px;">**Ajuste**

</td><td class="align-left" style="border-width: 1px; height: 57.6px;">**Funcionalidad**</td></tr><tr style="height: 46.4px;"><td class="align-left" style="border-width: 1px; height: 46.4px;">Tipo de elemento</td><td class="align-left" style="border-width: 1px; height: 46.4px;">Opciones de elementos disponibles para añadir al menú en modo lista para chequear el que se quiera añadir.</td></tr><tr style="height: 80px;"><td class="align-left" style="border-width: 1px; height: 80px;">Buscar</td><td class="align-left" style="border-width: 1px; height: 80px;">Una vez seleccionado el tipo de elemento se busca escribiendo mínimo tres caracteres de su nombre. Mostrará resultados y se selecciona el que se quiere añadir.

El elemento añadido se verá en la columna izquierda. Es decir, ya está añadido.

</td></tr><tr style="height: 29.6px;"><td class="align-left" style="border-width: 1px; height: 29.6px;">Enlace personalizado

</td><td class="align-left" style="border-width: 1px; height: 29.6px;">Para añadir un enlace personalizado como elemento del menú</td></tr><tr style="height: 29.6px;"><td class="align-left" style="border-width: 1px; height: 29.6px;">Etiqueta

</td><td class="align-left" style="border-width: 1px; height: 29.6px;">Para especificar nombre para el elemento de tipo enlace. Se mostrará en el menú.</td></tr><tr style="height: 29.6px;"><td class="align-left" style="border-width: 1px; height: 29.6px;">Enlace

</td><td class="align-left" style="border-width: 1px; height: 29.6px;">Url pública de la página para que el usuario al hacer clic la vea.</td></tr><tr><td class="align-left" style="border-width: 1px;">Añadir enlace

</td><td class="align-left" style="border-width: 1px;">Botón para que se añada el enlace como elemento del menú.</td></tr></tbody></table>

- Imagen de ejemplo de añadir elemento tipo categoría al menú.

[![image.png](https://kb.wakaprint.com/uploads/images/gallery/2025-11/scaled-1680-/fyLimage.png)](https://kb.wakaprint.com/uploads/images/gallery/2025-11/fyLimage.png)

#####   


- Imagen de ejemplo de añadir elemento tipo enlace al menú.

[![image.png](https://kb.wakaprint.com/uploads/images/gallery/2025-11/scaled-1680-/2JUimage.png)](https://kb.wakaprint.com/uploads/images/gallery/2025-11/2JUimage.png)

<table border="1" class="align-center" id="bkmrk-columna-izquierda-aj" style="border-collapse: collapse; width: 94.0741%; border-width: 1px; height: 680.45px;"><colgroup><col style="width: 12.0862%;"></col><col style="width: 22.5959%;"></col><col style="width: 65.2916%;"></col></colgroup><tbody><tr style="height: 57.6px;"><td class="align-left" rowspan="9" style="border-width: 1px; height: 586.65px;">**Columna**

**izquierda**

  
</td><td class="align-left" style="border-width: 1px; height: 57.6px;">**Ajuste**

</td><td class="align-left" style="border-width: 1px; height: 57.6px;">**Funcionalidad**</td></tr><tr style="height: 46.4px;"><td class="align-left" style="border-width: 1px; height: 46.4px;">Elementos del menú</td><td class="align-left" style="border-width: 1px; height: 46.4px;">Muestra en lista, con texto precedido de icono los elementos añadidos al menú</td></tr><tr style="height: 80px;"><td class="align-left" style="border-width: 1px; height: 80px;">Icono</td><td class="align-left" style="border-width: 1px; height: 80px;">El icono de cada elemento permite reconocer si es una categoría, un producto, una página de contenido o un enlace.

</td></tr><tr style="height: 137.05px;"><td class="align-left" style="border-width: 1px; height: 137.05px;">Ordenar

</td><td class="align-left" style="border-width: 1px; height: 137.05px;">- El orden ene e que se muestran es el mismo en el que se mostrarán en la vista pública.
- Se pueden ordenar según preferencias. Con clic sobre el elemento, mantener clic, arrastrar a nueva posición y soltar clic en nueva posición.

</td></tr><tr style="height: 57.6px;"><td class="align-left" style="border-width: 1px; height: 57.6px;">Configurar

</td><td class="align-left" style="border-width: 1px; height: 57.6px;">Botón para acceder a las opciones de configuración del elemento del menú. Se muestra al poner el cursor sobre el elemento.</td></tr><tr style="height: 57.6px;"><td class="align-left" style="border-width: 1px; height: 57.6px;">Enlace

</td><td class="align-left" style="border-width: 1px; height: 57.6px;">Url pública de la página para que el usuario al hacer clic la vea.</td></tr><tr style="height: 57.6px;"><td class="align-left" style="border-width: 1px; height: 57.6px;">Añadir enlace

</td><td class="align-left" style="border-width: 1px; height: 57.6px;">Botón para que se añada el enlace como elemento del menú.</td></tr><tr style="height: 35.2px;"><td style="border-width: 1px; height: 35.2px;">Icono cubo basura

</td><td class="align-left" style="border-width: 1px; height: 35.2px;">Botón para quitar el elemento del menú. </td></tr><tr style="height: 57.6px;"><td style="border-width: 1px; height: 57.6px;">Requerir confirmación al borrar

</td><td class="align-left" style="border-width: 1px; height: 57.6px;">Para activar o desactivar la petición de confirmación antes de quitar un elemento del menú</td></tr><tr style="height: 93.8px;"><td style="border-width: 1px; height: 93.8px;"></td><td class="align-left" style="border-width: 1px; height: 93.8px;">Configuración&gt;Builder</td><td class="align-left" style="border-width: 1px; height: 93.8px;">Dentro de configuración del elemento del menú se encuentra el botón para activar el maquetador del desplegable del elemento del menú con Builder.   
  
A tener en cuenta:  
  
- Si se activa el botón de Builder en un elemento del menú mostrará un desplegable en el elemento en la vista del cliente cuando el usuario ponga el cursor encima.
- Si el desplegable está maquetado con Builder el elemento del menú en el gestor mostrará el botón de texto "Editar builder". Permite acceder a actualizar, desactivar o eliminar la maquetación hecha.
- Categorías. Este tipo de elementos muestran el desplegable en función del ajuste que se decida en ajustes generales. Categorías hijas de la categoría del elemento del menú en modo árbol o en modo tarjeta, productos, o contenido maquetado con Builder.
- Productos. Solo mostrará desplegable si se ha maquetado con Builder.
- Páginas (CMS). Solo mostrará desplegable si se ha maquetado con Builder.
- Enlaces personalizados. Solo mostrará desplegable si se ha maquetado con Builder.

  
</td></tr></tbody></table>

# 2.8.6.2 Añadir y ordenar elementos al Menú < Ajustes

##### **1. Pasos para añadir un elemento al menú:** 

**1.1 De tipos:** Categorías, Productos, Páginas (CMS).

1.1.1. Seleccionar el tipo de elemento a añadir haciendo clic en la casilla e tipo correspondiente.

1.1.2 Escribir al menos tres caracteres del nombre del elemento para que muestre resultados coincidentes.

1.1.3 En los resultados que muestra hacer clic en el que interese añadir. s

1.1.2. Se añadirá al menú. Comprobarlo en la vista de la lista de elementos del menú (columna derecha).

  
1.2 Añadir elemento **tipo enlace**:

1.2.1 Escribir el nombre asignado al elemento en el campo llamado "Etiqueta".

1.2.2 Escribir o pegar la url pública del enlace en el campo llamado "Enlace".

1.2.3 Hacer clic en botón "Añadir enlace".

#####   


##### **2. Ordenar los elemento del menú**

Con clic mantener y arrastrar hacia arriba o abajo y soltar clic en nueva ubicación se pueden ordenar los elementos añadidos al menú. En la vista pública se muestran ene el mismo orden.

##### **3. A tener en cuenta en vista móvil**

5.1 En la vista móvil el menú de navegación lateral se muestra después de los productos que tiene la categoría.  
  
5.2 Con los desplegables maquetados **con Builder**.   
En la vista móvil al hacer clic en un elemento del menú llevará al usuario a la vista del desplegable del elemento del menú, salvo que por varios motivos el elemento no tenga desplegable. En este supuesto llevará directamente a ver los productos de la categoría.

# 2.8.6.3 Menú principal público desplegables < Ajustes

#####   


##### **1. Desplegables de elementos del menú personalizables desde ajustes generales.**

Vistas en pantallas tamaños LG y MD

 **1.1 Categorías simple.** Muestra las subcategorías hijas, nietas, y más subcategorías en modo jerarquía de la categoría padre

  
.   
[![image.png](https://kb.wakaprint.com/uploads/images/gallery/2025-08/scaled-1680-/2Iiimage.png)](https://kb.wakaprint.com/uploads/images/gallery/2025-08/2Iiimage.png)

**1.2 Categorías tarjetas.** Muestra las subcategorías hijas de la categoría padre. En modo tarjeta.

[![image.png](https://kb.wakaprint.com/uploads/images/gallery/2025-08/scaled-1680-/PX4image.png)](https://kb.wakaprint.com/uploads/images/gallery/2025-08/PX4image.png)

**1.3 Productos:** Muestra todos los productos que están en la categoría padre.

[![image.png](https://kb.wakaprint.com/uploads/images/gallery/2025-08/scaled-1680-/e4kimage.png)](https://kb.wakaprint.com/uploads/images/gallery/2025-08/e4kimage.png)

#####   


##### **2. Desplegables de elementos del menú personalizables con Builder**

Todos los tipos y elementos del menú pueden tener un desplegable personalizado con el maquetador Builder.   
A continuación se muestran **algunos ejemplos** de personalización del desplegable de elementos del menú.

**2.1** Desplegable de menú elemento tipo categoría creado con **bloque imagen.**

[![image.png](https://kb.wakaprint.com/uploads/images/gallery/2025-08/scaled-1680-/hw0image.png)](https://kb.wakaprint.com/uploads/images/gallery/2025-08/hw0image.png)

**2.2** Desplegable de menú elemento tipo categoría creado con bloque imagen. **Sin html.**

[![image.png](https://kb.wakaprint.com/uploads/images/gallery/2025-08/scaled-1680-/C4nimage.png)](https://kb.wakaprint.com/uploads/images/gallery/2025-08/C4nimage.png)

**2.3** Desplegable de menú elemento tipo categoría creado con **bloques productos, texto e imagen.**

[![image.png](https://kb.wakaprint.com/uploads/images/gallery/2025-08/scaled-1680-/YA3image.png)](https://kb.wakaprint.com/uploads/images/gallery/2025-08/YA3image.png)

**2.4** Desplegable de menú elemento tipo categoría creado con **bloques texto, lista, imagen y productos** en Builder.

[![image.png](https://kb.wakaprint.com/uploads/images/gallery/2025-08/scaled-1680-/iSvimage.png)](https://kb.wakaprint.com/uploads/images/gallery/2025-08/iSvimage.png)

**2.5** Desplegable de menú elemento tipo categoría creado **con bloque producto y slider.**

[![image.png](https://kb.wakaprint.com/uploads/images/gallery/2025-08/scaled-1680-/7Vlimage.png)](https://kb.wakaprint.com/uploads/images/gallery/2025-08/7Vlimage.png)

**2.6** Desplegable de menú elemento tipo categoría creado con **bloque html** en Builder. Cada elemento de la lista está enlazado con la página del producto.

[![image.png](https://kb.wakaprint.com/uploads/images/gallery/2025-08/scaled-1680-/zvnimage.png)](https://kb.wakaprint.com/uploads/images/gallery/2025-08/zvnimage.png)

**2.7** Desplegable de menú elemento tipo página de contenido. Realizado **con bloque html**, para que muestre todos los productos clasificados por categoría. Al hacer clic en el nombre del producto lleva a su página de compra.

[![image.png](https://kb.wakaprint.com/uploads/images/gallery/2025-08/scaled-1680-/OPlimage.png)](https://kb.wakaprint.com/uploads/images/gallery/2025-08/OPlimage.png)

**2.8** Desplegable de menú elemento tipo categoría creado **con bloque html y bloque de imagen.**

[![image.png](https://kb.wakaprint.com/uploads/images/gallery/2025-08/scaled-1680-/dljimage.png)](https://kb.wakaprint.com/uploads/images/gallery/2025-08/dljimage.png)

**Ejemplo 9.**  Desplegable de menú elemento tipo categoría creado **con bloques de imágenes y bloque html.**

[![image.png](https://kb.wakaprint.com/uploads/images/gallery/2025-08/scaled-1680-/C5Himage.png)](https://kb.wakaprint.com/uploads/images/gallery/2025-08/C5Himage.png)