Queria poder por o endereço

Eu queria por o endereço da minha loja física neste local do meu site, porém, não estou conseguindo por, alguém poderia me ajudar?

1 curtida

Olá fiz algo que possa lhe atender:
Use JS:

$(function() {

    setTimeout(function(){
          $('#rodape > div.pagamento-selos > div > div > div.span4.selos').after($('<div class="rodape-endereco"><li class="rodape-endereco1"> Nossa Loja Física:</li><li class="onde-estamos">Rua xxxxxxxx, 000 - São Paulo - CEP: 00000-000 - São Paulo/SP.</li></li><li class="linhaendereco"></li></div>'))
          
    }, 500);

});

E agora aplique esse CSS:

#rodape > div.pagamento-selos > div > div > div.rodape-endereco {
   
    padding-top: 15px;
    margin-top: 8px;
    align-items: center;
}
#rodape > div.pagamento-selos > div > div > div.rodape-endereco > li.rodape-endereco1{
  display: flex;
  font-size: 14px;
    font-weight: 700;
    color: #646464;
 
    
}

#rodape > div.pagamento-selos > div > div > div.rodape-endereco > div > span.b{
  padding: 0 15px 15px 15px;
}

o resultado esperado será esse:

Pode ser melhorado, são ajustes simples.

Espero ter ajudado.

1 curtida

Obrigado Mauricio, você foi uma benção!

1 curtida

conseguiria me auxiliar a fazer algo semelhante a este? Tenho dois endereço e queria deixar-los bem visíveis no mesmo local.

Desde já, agradeço!
image

1 curtida

Informe para mim por favor os dois endereços que já faço com os dados certos deles.

Primeiro endereço: Av. Dom Hélder Câmara, 4521 - Loja C - Del Castilho - RJ
Segundo endereço: Rua dos Tupis, 181 - Centro, Belo Horizonte - MG, 30190-060.

1 curtida

tá ótimo vou montar algo legal aqui para você

Obrigado meu amigo, me ajudará bastante!

1 curtida

montei aqui para você veja qual qual lhe agrada mais:
A opção 2 é exatamente igual a que você me mandou, já a opção 1 a diferença que a fonte é baseada no seu tema.

Lembrando que o “onde estamos” por ser substituído por “Nossas Lojas Físicas”.

Aguardo vc para mandar o código.

adorei a primeira opção, ficou incrível. Obrigado mesmo!

1 curtida

Tá ótimo vou mandar para você.
Primeiro apague tudo o que eu mandei antes ok.

Agora insira esse JS:

$(function() {

    setTimeout(function(){
          $('#rodape > div.pagamento-selos > div > div > div.span4.selos').after($
          ('<div class="rodape-endereco"><button data-izimodal-open="#enderecoModal" data-izimodal-preventclose=""><svg width="438pt" height="438pt" viewBox="-43 0 438 438.00018" xmlns="http://www.w3.org/2000/svg"><path d="m320.57 75.68c-33.23-48.098-85.895-75.68-144.48-75.68-58.586 0-111.25 27.582-144.48 75.68-33.07 47.859-40.715 108.44-20.469 161.98 5.3516 14.449 13.891 28.52 25.332 41.77l132 155.05c1.9023 2.2305 4.6836 3.5156 7.6172 3.5156 2.9297 0 5.7109-1.2852 7.6133-3.5156l131.98-155.02c11.945-13.84 20.242-27.523 25.367-41.824 20.227-53.586 12.574-114.12-20.48-161.96zm1.7383 154.97c-0.019532 0.058594-0.042969 0.11719-0.0625 0.17578-4.3359 12.141-11.238 23.449-21.723 35.586l-0.046876 0.054688-124.38 146.11-124.43-146.16c-9.9219-11.484-17.242-23.5-21.785-35.762-17.945-47.461-11.145-101.14 18.191-143.61 29.445-42.609 76.105-67.047 128.03-67.047 51.918 0 98.582 24.438 128.02 67.047 29.336 42.461 36.141 96.145 18.191 143.61z"></path><path d="m176.09 74c-56.359 0-102.05 45.688-102.05 102.05s45.691 102.05 102.05 102.05 102.05-45.691 102.05-102.05c-0.0625-56.332-45.715-101.98-102.05-102.05zm0 184.1c-45.316 0-82.051-36.734-82.051-82.051 0-45.312 36.734-82.047 82.051-82.047 45.312 0 82.047 36.734 82.047 82.051-0.050781 45.289-36.758 81.992-82.047 82.047z"></path></svg>          <div class="onde-estamos"><span class="a">Onde estamos:</span><span class="b">Av. Dom Hélder Câmara, 4521 - Loja C - Del Castilho - RJ</span><span class="c">Rua dos Tupis, 181 - Centro, Belo Horizonte - MG, 30190-060</span></div></button></div>'))
    }, 500);

});

E esse CSS:



#rodape > div.pagamento-selos > div > div > div:nth-child(3) > button {display:flex;background:none;align-items: center;}
#rodape > div.pagamento-selos > div > div > div:nth-child(3) > button:hover {opacity:0.7}
#rodape > div.pagamento-selos > div > div > div:nth-child(3) > button > svg {width: 32px;height: 32px;display:flex;margin-right: 7px;}
#rodape > div.pagamento-selos > div > div > div:nth-child(3) > button > div > span {display:flex;flex-direction:column;text-align:left;font-size:13px;line-height: 14px;flex: 1;}
#rodape > div.pagamento-selos > div > div > div:nth-child(3) > button > div > span.a{
color: #818181;
    font-size: 1.3vw;
    font-weight: bold;
    text-transform: lowercase;
    border: none;
    padding: 0px 0px 5px 0px;
}
#rodape > div.pagamento-selos > div > div > div:nth-child(3) > button > div > span.b{
      padding: 0px 0px 5px 0px;
}

Espero ter ajudado.

1 curtida

Obrigado Mauricio pela ajuda imensa

2 curtidas

É possível fazer dessa maneira também:

https://lovers-teste.lojaintegrada.com.br/pagina/onde-encontrar.html

Fica bem bacana.

Olá, @Mauricio_Pereira Tudo bem?
Gostei dessa solução que criou queria tentar incluir também, mas sou muito leigo.
Incluir o codigo CSS tranquilo, mas onde insiro esse JS? Seria no campo de HTML?

Desculpa pela pergunta boba, mas sou leigo referente a esse assunto rs

1 curtida

Olá, isso mesmo o CSS no painel editar CSS e o JS na aba incluir HTML, porém coloque o tipo JS.

Brigadão consegui aqui, nunca tinha incluindo nada por esse campo do HTML

Se possível me tira uma duvida.
Incluir código CSS através do “editar CSS” da na mesma que fazer pelo “incluir código HTML” e la em tipo selecionar CSS?

1 curtida

Na teoria pela opção “incluir código HTML” ele vai sobrepor o seu CSS.
Mas para fins de padronização eu prefiro deixar meu CSS junto do editar CSS.
A menos que eu tenha desenvolvido alguma ferramenta, ai eu faço um código único e aplico tanto o html, JS e CSS tudo do mesmo bloco.

1 curtida