[OFICINA] - Pequenas alterações em sua loja

[cleberandrade]

Pra fazer isso a receita é:

1. Copiar e colar todos os estilos CSS associados aos ícones/menus desejados no site original:

.novo-atendimento{...} .novo-conta{...} .novo-carrinho{...} etc

2. Ocultar o menu atual com o código:

.superior .span4 .acoes-conta {display:none}

3. Copiar os 3 DIVS que fazem parte do menu desejado

<div class="novo-atendimento item-cabecalho hidden-phone">...</div>
<div class="novo-conta item-cabecalho hidden-phone">...</div>
<div class="novo-carrinho item-cabecalho hidden-phone">...</div>

e colar após o div .superior .span8 através do código javascript abaixo

$(".superior .span8").after("<div class='span4'>CÓDIGO-HTML-ACIMA-COM-ASPAS-SIMPLES</div>")

não esquecendo de modificar os links e textos conforme seu site

4. E fazer os ajustes necessários no CSS colado e no CSS do seu site para o novo menu atender às cores, tamanhos do seu template, sem contar nos ajustes para o mobile.

É um trabalho minucioso e criterioso; difícil dar o bolo pronto, somente a receita rs. Mas o bom é que os ícones já estarão lá bonitinhos do jeito exato do site que você citou como modelo.

[enilahacessorios]

Joia @cleberandrade. Vou tentar aqui
volto para dar notícias!!!

Obrigado por enquanto

[cleberandrade]

Por nada!

Ah, o css pra você copiar os estilos do site Use Jeans é esse daqui https://cdn.awsli.com.br/temasv2/447/__theme_custom.css?v=1593621335

E, obviamente eu colei somente os divs externos e coloquei reticências nos divs internos para não deixar a mensagem aqui muito longa, mas é só ir no site Use Jeans e copiar os divs inteiros.

[Yuri.Rodrigues]

Olá, bom dia pessoal!

Alguém sabe como aumento a barra de categorias junto com o full banner nem precisa ser tela toda, apenas um pouco mais.

[Eduardo_Siqueira]

Boa tarde, queria deixar minha loja mais parecido com o site https://www.youcom.com.br/
minha loja é https://www.nossoacessorio.com.br/
agradeço desde já se me ajudarem o mínimo que seja

[cleberandrade]

@Yuri.Rodrigues

Basta aumentar a quantidade de pixels dos divs desejados. No caso são esses:

.menu li {  /* controla o espaçamento entre os textos do menu */
    padding: 0 20px;  /* substitua 20 pelo número desejado */
}

Dica: a quantidade de “padding” (código acima) a adicionar deve ser igual à quantidade de “max-width” (código abaixo) dividida pela quantidade de submenus. Ex: se você adicionar 90px em “max-width”, ficando com 1230px, e tiver 9 submenus, então você tem que adicionar mais 10px no padding, ficando 30px.

.conteiner {  /* controla a largura do conteúdo do site */
    max-width: 1140px;   /* substitua 1140 pelo número desejado */
}

Em “Editar CSS” no menu superior você cola os códigos anteriores logo após a última linha de código.

[cleberandrade]

São sites completamente diferentes, fica difícil dizer o que fazer. Milhares de coisas! Fontes, cores, tamanhos, posições, larguras.

De modo geral, se você quer “copiar” a aparência de um site que gostou, é só usar a função “Inspecionar Elemento” no navegador (clique com botão direito em qualquer lugar do site) e ir “pescando” as propriedades desejadas de cada elemento e ir colando no código da sua loja.

Exemplo: se você quer que o preço da sua loja também seja vermelho que nem o site que você mencionou, é só “inspecionar elemento” e verificar que o código original é

#widget .price {
    color: #ff5050;
}

Sabendo disso, você vai no seu site e também “inspecionar elemento” e verifique que o mesmo texto do preço do produto tem esse código abaixo:

.cor-secundaria {
   color: #000000;
}

Aí é só substituir a propriedade color do site desejado no seu site.

Segue esse passo a passo para todos os elementos desejados. Se você não tem nenhuma experiência com isso nem faça, pois serão milhares de alterações, muita chance de dar algum erro e desconfigurar seu site. Veja com alguém experiente ou mude de tema (mais adequado)!

[Eduardo_Siqueira]

É mais passar o mouse no menu e abrir c uma foto
a vitrine e aquele “precias de ajuda” no lado direito

[enilahacessorios]

SOCORRO @Appmake.store SOCORRO!!!
juro que tentei, e tentei muito…na raça, estou conseguindo algumas coisas…

Tudo começou com a minha vontade de deixar a barra superior (inicial) como a da foto:

Não consegui resolver até agora, porem, consegui via Script, colocar um menu dropdown e, apagar os itens de contato. Isto, digamos que me ajudou 50% do que eu queria. Problemas:

1. ainda não consegui colocar a barra de pesquisa na barra superior.
2. não consigo colocar o carrinho na barra superior.
3. ao criar o java com o menu dropdown, desconfigurou a barra superior do menu mobile…

juro, eu só quero que a barra inicial (superior) fique como a da foto. vocês conseguem me orientar?

eu agradeço muito, antecipadamente

Obrigada, Enilah
www.enilahacessorios.com.br

[elisama_22]

@Leonardo_Vicentini_F

$(function(){
	$(".span4.pagamento .titulo.cor-secundaria").text("Confira nossas formas de pagamento:");
	$(".span4.selos .titulo.cor-secundaria").text("COMPRE COM SEGURANÇA");
});

Bom dia! é apenas colocar este codigo no CSS? O meu não funcionou.
elisouzastore.com.br

[Leonardo_Vicentini_F]

não é CSS, é JS.
Precisa ser inserido em HTML

[elisama_22]

Leo,
Bom dia!

Coloquei agora no HTML e nao funcionou… carregou o codigo no rodape da pagina .
elisouzastore.com.br

[elisama_22]

@Leonardo_Vicentini_F

.rastreio-content {
    margin-top: 30px;
}

input#OrderTracking {
    color: #ff914d;
    vertical-align: top;
}

button.rastreio {
    background: #ff914d;
    margin-left: 9px;
}

Bruna , bom dia! Poderia enviar o codigo completo de rastreio

[goldenimports1]

Boa tarde, estou com um pequeno problema nas páginas dos meus produtos. Ao selecionar a opção de variação do produto as informações da variação ficam em branco.
! Anexei 1 print da pagina do produto antes de clicar na variação, e o outro print após ter clicado… Vão reparar que a informação some, acredito que tem alguma cor sobrepondo a caixa de variação quando selecionada…
Alguém pode me ajudar a deixar de uma maneira que após selecionar a variação o cliente ainda possa ver os dados da mesma?

[goldenimports1]

Antes de clicar na seleção fica assim:

[goldenimports1]

Meu site é: www.goldenimports.com.br

[enilahacessorios]

Oi Reis, tudo bem?conseguiu resolver? caso positivo pode compartilhar o codigo que usou?

muito obrigada

[enilahacessorios]

@cleberandrade

.superior .span4 .acoes-conta {display:none}

Oi Cleber…rsrs está muito complicado…juro que tentei!!! para eu só colocar o carrinho alinhado lado a lado com as ações da conta, como faço? estou usando os seguintes códigos, até foi, mas não estão alinhados:

ME AJUDA PLEASE
obrigada

CSS

.conteudo-topo .inferior .carrinho > a,
.conteudo-topo .inferior .acoes-conta {
display: inline-block;
}
.conteudo-topo .inferior .acoes-conta,
.conteudo-topo .inferior .acoes-conta li {
width: inherit !important;
float: inherit;
}
.conteudo-topo .inferior .acoes-conta {
margin-left: 25px;
}
.conteudo-topo .inferior .acoes-conta li,
.conteudo-topo .inferior .acoes-conta li a {
display:inline-block;

}
.conteudo-topo .inferior .carrinho > a i {
line-height: 30px;
}

JS (RODAPE - HTML - TODAS AS PAGINAS)

[enilahacessorios]

JS (RODAPE - HTML - TODAS AS PAGINAS)

[moca_linda]

Olá amigo, esse código inseri no HTML ou CSS, em sendo no HTML qual passo? Obrigado!