FROM CACHE - es_header

Modificar menú tema Dawn versión movil

RESUELTAS

Modificar menú tema Dawn versión movil

espasdasymasdbf
Shopify Partner
2 0 1

Hola comunidad! después de varios días de frustración he decidido pedir ayuda con este tema. El comportamiento del menú del tema Dawn no me gusta. Tiene un máximo de tres niveles pero si un nivel cuenta con descendencia, este no es clickable por lo que poniendo un ejemplo tengo la colección Zapatos y le agrego subnivel Zapatos Hombre y Zapatos Mujer, el elemento padre(Zapatos) no te lleva a ningún sitio, solo abre el desplegable. He podido solucionar parte del problema modificando el código del archivo 'header-dropdown-menu.liquid' agregando unos enlaces pero solo funcionan en la versión escritorio. Lo que me está volviendo loco es no encontrar ningún archivo en el que encuentre la versión móvil o tal vez no estoy entendiendo bien. El resultado es que he tenido que repetir en el menú el elemento padre al siguiente nivel Zapatos->Todos los zapatos / Zapatos Hombre / Zapatos mujer pero no me gusta para nada esta solución. 

{% comment %}
Renders a standard dropdown style menu for the header.

Usage:
{% render 'header-dropdown-menu' %}
{% endcomment %}

<nav class="header__inline-menu">
<ul class="list-menu list-menu--inline" role="list">
{%- for link in section.settings.menu.links -%}
<li>
{%- if link.links != blank -%}
<header-menu>
<details id="Details-HeaderMenu-{{ forloop.index }}">
<summary
id="HeaderMenu-{{ link.handle }}"
class="header__menu-item list-menu__item link focus-inset"
>
<a href="{{ link.url }}" class="header__menu-item list-menu__item link link--text focus-inset" style=> {% comment %} Enlace añadido por DBF (solo etiquieta <a>){% endcomment %}
<span
{%- if link.child_active %}
class="header__active-menu-item"
{% endif %}
>
{{- link.title | escape -}}
</span>
</a> {% comment %} Enlace añadido por DBF </a> {% endcomment %}
{% render 'icon-caret' %}
</summary>
<ul
id="HeaderMenu-MenuList-{{ forloop.index }}"
class="header__submenu list-menu list-menu--disclosure color-{{ section.settings.menu_color_scheme }} gradient caption-large motion-reduce global-settings-popup"
role="list"
tabindex="-1"
>
{%- for childlink in link.links -%}
<li>
{%- if childlink.links == blank -%}
<a
id="HeaderMenu-{{ link.handle }}-{{ childlink.handle }}"
href="{{ childlink.url }}"
class="header__menu-item list-menu__item link link--text focus-inset caption-large{% if childlink.current %} list-menu__item--active{% endif %}"
{% if childlink.current %}
aria-current="page"
{% endif %}
>
{{ childlink.title | escape }}
</a>
{%- else -%}
<details id="Details-HeaderSubMenu-{{ link.handle }}-{{ childlink.handle }}">
<summary
id="HeaderMenu-{{ link.handle }}-{{ childlink.handle }}"
class="header__menu-item link link--text list-menu__item focus-inset caption-large"
>
{% comment %} <a href="{{ link.url }}"class="link--text"> Enlace añadido por DBF (solo etiquieta <a>){% endcomment %}

<span>{{ childlink.title | escape }}</span>
{% comment %} </a> Enlace añadido por DBF </a> {% endcomment %}

{% render 'icon-caret' %}
</summary>
<ul
id="HeaderMenu-SubMenuList-{{ link.handle }}-{{ childlink.handle }}-{{ grandchildlink.handle }}"
class="header__submenu list-menu motion-reduce"
>
{%- for grandchildlink in childlink.links -%}
<li>
<a
id="HeaderMenu-{{ link.handle }}-{{ childlink.handle }}-{{ grandchildlink.handle }}"
href="{{ grandchildlink.url }}"
class="header__menu-item list-menu__item link link--text focus-inset caption-large{% if grandchildlink.current %} list-menu__item--active{% endif %}"
{% if grandchildlink.current %}
aria-current="page"
{% endif %}
>
{{ grandchildlink.title | escape }}
</a>
</li>
{%- endfor -%}
</ul>
</details>
{%- endif -%}
</li>
{%- endfor -%}
</ul>
</details>
</header-menu>
{%- else -%}
<a
id="HeaderMenu-{{ link.handle }}"
href="{{ link.url }}"
class="header__menu-item list-menu__item link link--text focus-inset"
{% if link.current %}
aria-current="page"
{% endif %}
>
<span
{%- if link.current %}
class="header__active-menu-item"
{% endif %}
>
{{- link.title | escape -}}
</span>
</a>
{%- endif -%}
</li>
{%- endfor -%}
</ul>
</nav>

 

1 SOLUCIÓN ACEPTADA

Teo
Shopify Staff
2365 513 336

Éxito.

Hola, @espasdasymasdbf:

 

Gracias por escribirnos. Entiendo que deseas editar el menú del tema Dawn para que, al clicar en el elemento padre, el sistema redirija a una página específica en versión móvil. Esto en lugar del comportamiento actual, que es simplemente mostrar los sub-elementos hijo del menú, ¿cierto? Será un placer ayudar.

 

Los temas de Shopify se han construido nativamente con este comportamiento predefinido. Si un elemento del menú contiene otros sub-elementos; lo esperado es que, al hacer clic sobre el elemento padre, simplemente se desplieguen o aparezcan los sub-elementos vinculados al elemento general. Por el momento, no hay una forma de cambiar esta lógica, a menos que se implemente código personalizado, como estás haciendo.

 

Dicho esto, es importante tener en cuenta que las preguntas relacionadas con desarrollo o lenguaje de código complejo, Liquid, Scripts o la API quedan fuera del alcance de nuestro conocimiento en el equipo de soporte de la Comunidad. Con todo, me alegra informarte de que existe un foro en la Comunidad que se llama Shopify Partners and Developers y que está controlado por expertos. Dentro de este foro, es posible que uno de nuestros especialistas pueda revisar la configuración de la redirección del menú y ofrecer una resolución.

 

Entretanto, si te has registrado programa de Shopify Partner, te recuerdo que puedes contactar con nuestros especialistas de soporte de Partners para resolver cualquier consulta técnica con respecto al desarrollo o personalización de una tienda de Shopify. Aparte, también tienes la opción de contratar los servicios de otro Partner de Shopify para resolver cualquier pregunta o solicitar asistencia con el desarrollo que está realizando. Dime, originalmente, ¿habías intentado contactar con nuestros especialistas de soporte de Partners?

 

Como alternativa, me alegra también informarte de que contamos con un equipo de especialistas en temas que pueden implementar personalizaciones por ti si cumples con la política de diseño. En este caso, lo ideal sería escribirnos a través del Centro de Ayuda para que este equipo de especialistas revise si es posible implementar una solución para redirigir a tus clientes a una página específica al seleccionar un elemento padre del menú desde un dispositivo móvil. Mientras, ¿cómo está siendo tu experiencia con Shopify?

Teo | Social Care @ Shopify 
 - ¿Te resultó útil mi respuesta? Dale Me gusta para hacérmelo saber 
 - ¿Resolvimos tu pregunta? Dale a Aceptar como solución
 - Para saber más visita el Centro de ayuda de Shopify o nuestro Blog de Shopify

Ver la solución en mensaje original publicado

2 RESPUESTAS 2

Teo
Shopify Staff
2365 513 336

Éxito.

Hola, @espasdasymasdbf:

 

Gracias por escribirnos. Entiendo que deseas editar el menú del tema Dawn para que, al clicar en el elemento padre, el sistema redirija a una página específica en versión móvil. Esto en lugar del comportamiento actual, que es simplemente mostrar los sub-elementos hijo del menú, ¿cierto? Será un placer ayudar.

 

Los temas de Shopify se han construido nativamente con este comportamiento predefinido. Si un elemento del menú contiene otros sub-elementos; lo esperado es que, al hacer clic sobre el elemento padre, simplemente se desplieguen o aparezcan los sub-elementos vinculados al elemento general. Por el momento, no hay una forma de cambiar esta lógica, a menos que se implemente código personalizado, como estás haciendo.

 

Dicho esto, es importante tener en cuenta que las preguntas relacionadas con desarrollo o lenguaje de código complejo, Liquid, Scripts o la API quedan fuera del alcance de nuestro conocimiento en el equipo de soporte de la Comunidad. Con todo, me alegra informarte de que existe un foro en la Comunidad que se llama Shopify Partners and Developers y que está controlado por expertos. Dentro de este foro, es posible que uno de nuestros especialistas pueda revisar la configuración de la redirección del menú y ofrecer una resolución.

 

Entretanto, si te has registrado programa de Shopify Partner, te recuerdo que puedes contactar con nuestros especialistas de soporte de Partners para resolver cualquier consulta técnica con respecto al desarrollo o personalización de una tienda de Shopify. Aparte, también tienes la opción de contratar los servicios de otro Partner de Shopify para resolver cualquier pregunta o solicitar asistencia con el desarrollo que está realizando. Dime, originalmente, ¿habías intentado contactar con nuestros especialistas de soporte de Partners?

 

Como alternativa, me alegra también informarte de que contamos con un equipo de especialistas en temas que pueden implementar personalizaciones por ti si cumples con la política de diseño. En este caso, lo ideal sería escribirnos a través del Centro de Ayuda para que este equipo de especialistas revise si es posible implementar una solución para redirigir a tus clientes a una página específica al seleccionar un elemento padre del menú desde un dispositivo móvil. Mientras, ¿cómo está siendo tu experiencia con Shopify?

Teo | Social Care @ Shopify 
 - ¿Te resultó útil mi respuesta? Dale Me gusta para hacérmelo saber 
 - ¿Resolvimos tu pregunta? Dale a Aceptar como solución
 - Para saber más visita el Centro de ayuda de Shopify o nuestro Blog de Shopify

espasdasymasdbf
Shopify Partner
2 0 1

Gracias Teo, intentaré desde el soporte Partner