Ajuda - Como Mudar Tamanho do Preço a Vista

Boa Tarde Galera tudo bem,

Preciso muito da ajuda de vcs… estou tentando a dias aumentar o tamanho dos preços a vista da vitrine e não consigo, todos os códigos que peguei aqui na comunidade só altera o tamanho do valor parcelado e eu preciso alterar o valor do preço a vista ( valor total) da vitrine e da pagina do produto, espero que algum expert da comunidade me ajude ficarei muito grato :smiley:

1 - Alterar tamanho da fonte dos preços a vista ( valor total ) Vitrine

2 - Alterar tamanho da fonte do preço A vista ( valor total) Pagina do produto

aqui esta meu site para darem uma olhada obrigado. www.kadabramagica.com.br

@kadabramagica

Bom, vamos lá:

Alterar tamanho da fonte do preço A vista ( valor total) Pagina do produto
Use esse código aqui abaixo e aumente esse valor que está em 20 de acordo com o tamanho que achar melhor:

.produto .acoes-produto .preco-produto .titulo {
font-size: 20px;
}

2 curtidas

@Luciano

Muito obrigado luciano deu super certo você é o cara :smiley: ajudou muitoooo mesmo

por acaso você teria o código para fazer o mesmo processo na vitrine (home)?? só falta esse.

1 curtida

@kadabramagica para esse poderá utilizar esse código abaixo e aumente esse valor que está em 20 de acordo com o tamanho que achar melhor:

.listagem .preco-produto strong.titulo {
font-size: 20px;
}

2 curtidas

Obrigado luciano mais não estou conseguindo com esse código, ja tentei de todo jeito e todo tamanho e não muda nada na vitrine.

tem alguma forma especifica ou outro codigo…

por que com esse nao esta mudando nada, o primeiro foi perfeitamente, o que posso fazer?

@kadabramagica Acontece que já tem um código no CSS de sua loja falando do tamanho do preço, por esse motivo o código do final não está alterando.

Tamanho

@kadabramagica se alterar esse 11px acho que fica certo em sua loja.
Seu código está com vários tamanhos para o preço nesse trecho que te enviei.
Vale dar uma revisada ai.

Luciano muito obrigado pela sua ajuda consegui achar, estava em outra aba esse mesmo codigo que me mando com o tamanho de 14PX so editei e deu certo você é o cara vlw :smiley:

1 curtida

Olá Luciano

Você tem conhecimento de como posso fazer para deixar minha vitrine assim:
image

Preço Colorido R$XXX (vermelho)
6x de R$XXX (negrito)
valor a vista R$XXX (negrito)

Oi @useicuston
tenta isso no seu css:

a.nome-produto.cor-secundaria {
font-size: 16px !important;
font-weight: 400 !important;
color: #000 !important;
}

.listagem .listagem-item .info-produto .preco-produto .preco-parcela strong, .listagem.aproveite-tambem .listagem-item .info-produto .preco-produto .preco-parcela strong {
font-weight: 900 !important;
color: #000 !important;
}

.listagem .listagem-item .info-produto .preco-produto .preco-promocional, .listagem.aproveite-tambem .listagem-item .info-produto .preco-produto .preco-promocional {
color: #d01515 !important;
}

.listagem .listagem-item .info-produto .preco-produto .preco-venda, .listagem.aproveite-tambem .listagem-item .info-produto .preco-produto .preco-venda {
color: #d01515 !important;
}

span.desconto-a-vista {
font-weight: 900 !important;
color: #000 !important;
}

acho que vai ficar mais parecido com o que vc pediu na imagem e as coisas coloridas e em negrito tbm

abraço!

2 curtidas

Olá Alexandre, muito obrigado ficou sensacional.
image
Na última linha (valor com desconto) gostaria de inverter o negrito é possível?
Ficou: ou R$53,91 via Boleto Bancário

Gostaria: ou R$53,91 via Boleto Bancário

E uma outra dúvida abusando da sua boa vontade, é possível inverter? o posicionamento dos valores
hoje esta assim (vou enumerar para ficar mais fácil de entender):
(1) Valor Parcelado
(2) Valor “original” sem desconto
(3) Valor em destaque com desconto
(4) Valor a vista com desconto via boleto

Gostaria que ficasse:
(3) Valor em destaque com desconto
(2) Valor “original” sem desconto
(1) Valor Parcelado
(4) Valor a vista com desconto via boleto

Deixei o código assim:
/* Tamanho e Cor do Preço na vitrine */
a.nome-produto.cor-secundaria {
font-size: 16px !important;
font-weight: 400 !important;
color: #000 !important;
}

/* Preço parcelado */
.listagem .listagem-item .info-produto .preco-produto .preco-parcela strong, .listagem.aproveite-tambem .listagem-item .info-produto .preco-produto .preco-parcela strong {
font-weight: 900 !important;
color: #000 !important;
}

/* Preço anterior ao desconto */
.listagem .listagem-item .info-produto .preco-produto .preco-venda, .listagem.aproveite-tambem .listagem-item .info-produto .preco-produto .preco-venda {
color: #000 !important;
}

/* Preço com desconto em destaque */
.listagem .listagem-item .info-produto .preco-produto .preco-promocional, .listagem.aproveite-tambem .listagem-item .info-produto .preco-produto .preco-promocional {
color: #d01515 !important;
}

span.desconto-a-vista {
font-weight: 900 !important;
color: #000 !important;
}

oi @useicuston
sobre a inversão do negrito, tenta isso:

remover essa parte:
span.desconto-a-vista {
font-weight: 900 !important;
color: #000 !important;
}

e colocar isso no lugar:
.desconto-a-vista strong.cor-secundaria {
color: #000 !important;
font-weight: 900 !important;
}

já sobre o reposicionamento, tem que ver com calma essa parte, pois se sair usando o jquery/js só pelas classes, vai replicar tudo que existe nas vitrines…
outro detalhe é sobre o reposicionamento do valor original e o com desconto… a ideia dele é fazer o famoso “de” e “por”, por isso a loja integrada aplica naquela posição mesmo, pra fechar o contexto “de X reais por Y reais”

abraço!

1 curtida

Muito obrigado Alexandre
Deu super certo.

Grande abraço
Marcelo Lopes

Alexandre vou abusar da sua boa vontade novamente

image

Gostaria de tirar o “botão de quantidade” - não é útil pois tenho variações de cor e tamanho

E gostaria de diminuir o espaço vazio (branco) entre o botão vermelho (ver mais) e o final dos texto de valores.

Obrigado novamente
Marcelo Lopes

Oi @useicuston
para remover esse botao de quantidade, aplique isso no css:

.listagem .listagem-item .acoes-produto .qtd-prod, .listagem.aproveite-tambem .listagem-item .acoes-produto .qtd-prod {
display: none;
}

para solucionar o caso dos espaços, aplique isso:
.listagem .listagem-item, .listagem.aproveite-tambem .listagem-item {
height: 580px;
}

Até!

1 curtida

Bom dia Alexandre
Novamente agradeço pela ajuda, esta perfeito agora… como eu precisava.
Muito obrigado
Tenha um ótimo dia

Abraço
Marcelo Lopes

1 curtida

Ola Alexandre_Bard vi que voce auxiliou o amigo acima e queria lhe pedir um favor se possivel, eu queria deixar examente como voce fez , mas eu inseri o codigo css e não esta aparecendo o boleto, voce tem ideia do que poderia ser. Minha pagina www.jimgames.com.br , muito obrigado e desculpe o incomodo.

1 curtida

Tudo bem Luciano,
Também estou tentando aumentar o tamanho da fonte do PREÇO PRODUTO, tentei usar o código que você passou mas não deu certo pra mim. Pode me dizer onde coloco o código, é no CSS? ABRAÇO

Obrigado, funcionou.

nao estou conseguindo aumentar a fonte do “preço a vista” na pagina do produto… ja colei esse codigo no CSS e nao deu certo. alguem pode me ajudar por favor?