Mini Banners na versão mobile

@PATMERZ
Você precisa inserir o código javascript para carregar no rodapé.

Abs
Flores | www.upper.rocks

Boa tarde! Desculpa Não entendi “inserir o código javascript para carregar no rodapé”.
Onde devo remover conforme você citou, por favor poderia direcionar :

É só remover a class .hidden-mobile dos elementos

$(‘#corpo .conteiner .banner.hidden-phone’).removeClass(‘hidden-phone’);

Eu gostaria que aparecesse todos os banners que estão aparecendo no desktop no mobile. Mas não estou entendendo, esse codigo que você indicou no grupo onde consigo remover? Se no CCS, Html.

Visitei o seu site e gostei do ícone do whatsapp, poderia me explicar como usar na minha loja? abçs

Boa tarde! Marlon_Pereira acessa esse link: https://www.youtube.com/watch?v=Q_pdZBi8XoA
ensina passo a passo. Qualquer dúvida é só chamar.

Boa tarde! É sobre o ícone do whatsapp flutuante que tem no meu site.

ola boa noite alguem saberia me informa a respeito deste asunto.
tenho criado os produtos na minha loja e tenho salvado normalmente
mais eles não estão aparecendo na loja ja atualisei a pagina mais nada dos produtos aparece ja tem alguns cadastrado

@PATMERZ Olá, como fez esse layout com formato carrossel no mobile? precisou de um código?

obrigado pela dica …

Cria um novo arquivo em Incluir HTML…

O arquivo deve ficar no rodapé e deve ser do tipo HTML

< script> $(’#corpo > div > div.secao-principal.row-fluid.sem-coluna > div > div.row-fluid.banner.mini-banner.hidden-phone’).removeClass(‘hidden-phone’);

1 curtida

@PATMERZ @Mirian_Buss_Noivas
Bom dia Algumas de vocês podem compartilhar como conseguiram fazer o banner mobile com tamanho diferente do desktop.
Muita gente está atrás disso e ninguém se propõe a ajuda.
Obrigado

Olá! Por acaso tem algum passo a passo para esse procedimento.

SOLUÇÃO DEFINITIVA - BANNERS MOBILE.

Esse script foi criado pelo usuário @gian_dias e compartilhou comigo em outra postagem.
Eu usei as imagens no tamanho 640px X 500px e ficou muito legal.
Esse script pega os banner pela class css e substitui as imagens full pelas informadas nos links das imagens.

Para funcionar você precisa inserir exatamente esse código no rodapé, html, todas as páginas
Conforme imagem abaixo:

Crédito ao @gian_dias que fez a gentileza de compartilhar :hugs:

document.getElementsByClassName('tarjas')[0]; x = window.screen.width; if (x <= 767) { document.getElementsByClassName('slides')[0].getElementsByTagName('img')[0].src='LINK DA IMAGE'; document.getElementsByClassName('slides')[0].getElementsByTagName('img')[1].src='LINK DA IMAGE'; document.getElementsByClassName('slides')[0].getElementsByTagName('img')[2].src='LINK DA IMAGEM'; }
7 curtidas

Bom dia amigo, teste aqui e funcionou, é possível colocar link?

Obs.: o meu funcionou como javascript e nao html

Conseguiu resolver?, estou com o mesmo problema

@RafaMonteiroo Ele usa o link do banner da versão desktop.

1 curtida

@Everton52 Sim, olha o script acima… Funcionou

Verdade, nao tinha notado, obrigado

Maravilha. Poderia enviar o script por escrito, além da imagem? Agradeço!

Olá!
Dando uma passadinha para anunciar um produto que nossa agência está produzindo:

É o curso de CSS BÁSICO PARA LOJISTAS DE E-COMMERCE
Faça as suas próprias alterações no tema da sua loja como cores, posicionamento de elementos, exibição de partes específicas tanto na versão de desktop quanto na versão mobile. Adquira mais conhecimento na plataforma para não ser passado para trás!

Adiciona o nosso instagram: https://www.instagram.com/idraise.acv/ e manda um direct pra gente!
Trabalhamos com a plataforma da loja integrada a uns 4 anos e agora vamos passar alguns conhecimentos para frente! :wink:

1 curtida

@Infinity_Produtos Aqui não tem como colocar código de scritpt.
Você pode colocar só essa parte como Java scritp que vai funcionar também. Veja a imagem final.

   document.getElementsByClassName('tarjas')[0];

x = window.screen.width;
if (x <= 767) {
document.getElementsByClassName(‘slides’)[0].getElementsByTagName(‘img’)[0].src=‘LINK IMAGEN’;
document.getElementsByClassName(‘slides’)[0].getElementsByTagName(‘img’)[1].src=’ LINK IMAGEN’;
document.getElementsByClassName(‘slides’)[0].getElementsByTagName(‘img’)[2].src=‘LINK IMAGEN’;
}

5 curtidas