FROM CACHE - pt-br_header
Resolvido

Menu do site não está abrindo no mobile

Belezaki
Visitante
3 0 0

Recentemente, apaguei algumas linhas de código do header para tirar o símbolo do carrinho do header, mas não acho que essa seja a causa desse problema. Por favor alguém sabe como solucionar isso? 

20230422-0156-40.0163667.gif

 

A lupa de pesquisa está funcionando normalmente, só o botão do menu está desse jeito. Aqui uma foto que talvez auxilie na solução do problema, Obrigado!

 

image_2023-04-21_231102335.png

1 SOLUÇÃO ACEITA

raphaellima
Shopify Partner
46 10 9

Sucesso.

Provavelmente ao alterar o código você pode ter excluído algum trecho de código que fazia o mobile funcionar corretamente, acredito que só é possível te ajudar com prints de alguns trechos do código relacionados ao header/menu, poucas chances de envolver o theme.liquid (onde chamamos o header).

 

Caso você prefira não compartilhar o código, o que você deve fazer para resolver:

- Procure entender sobre HTML e como uma página é montada.

- Entenda sobre CSS e depois vá para media queries do CSS.

As tags HTML possuem classes / ids que as identificam, assim você usa o CSS para alterar as propriedades de estilo dessa tag. Exemplo:

 

<div id="minha-div">
  <p class="paragrafo">Meu texto vem aqui</p>
</div>

 

No código acima temos uma tag "p" com a classe "paragrafo", dentro de uma tag "div" com o id "minha-div". Podemos mudar a cor do texto para branco da tag "p" utilizando o código abaixo

.paragrafo {
   color: #FFFFFF
}

E podemos fazer com que o texto e a sessão representada pela nossa tag "div" não apareça mais em telas menores que 600px com o código abaixo:

 

@media (max-width: 600px) {
   #minha-div{
      display: none
   }
}

 

Raphael Lima | Developer
WhatsApp: +55 (31) 92002-9324

Exibir solução no post original

1 RESPONDER 1

raphaellima
Shopify Partner
46 10 9

Sucesso.

Provavelmente ao alterar o código você pode ter excluído algum trecho de código que fazia o mobile funcionar corretamente, acredito que só é possível te ajudar com prints de alguns trechos do código relacionados ao header/menu, poucas chances de envolver o theme.liquid (onde chamamos o header).

 

Caso você prefira não compartilhar o código, o que você deve fazer para resolver:

- Procure entender sobre HTML e como uma página é montada.

- Entenda sobre CSS e depois vá para media queries do CSS.

As tags HTML possuem classes / ids que as identificam, assim você usa o CSS para alterar as propriedades de estilo dessa tag. Exemplo:

 

<div id="minha-div">
  <p class="paragrafo">Meu texto vem aqui</p>
</div>

 

No código acima temos uma tag "p" com a classe "paragrafo", dentro de uma tag "div" com o id "minha-div". Podemos mudar a cor do texto para branco da tag "p" utilizando o código abaixo

.paragrafo {
   color: #FFFFFF
}

E podemos fazer com que o texto e a sessão representada pela nossa tag "div" não apareça mais em telas menores que 600px com o código abaixo:

 

@media (max-width: 600px) {
   #minha-div{
      display: none
   }
}

 

Raphael Lima | Developer
WhatsApp: +55 (31) 92002-9324