Como aumentar o tamanho do botão de finalizar compra e adicionar ao carrinho

[reidosprecos]

Como aumentar o tamanho do botão de finalizar compra e adicionar ao carrinho no tema brooklyn?   Quero aumentar a altura e largura deles, mas não consigo, estou achando muito pequeno. Também gostaria de diminui a largura do campo onde aparecem a quantidade dos produtos.

[Luisa]

Oi @reidosprecos ,

Para alterar o tamanho do botão de adicionar ao carrinho, você precisará editar o código fonte de seu tema. Antes que efetue qualquer customização, recomendo que primeiro faça uma cópia de seu tema, pois caso aconteça qualquer erro em sua edição você poderá converter seu website para sua versão antiga. 

Para a edição do botão AddtoCart (Adicionar ao carrinho) basta ir em seu painel de controle > Loja virtual > Temas > Ações > Editar código. Dentro de seu editor de CSS, clique na pasta chamada Assets no lado esquerdo de sua página, e localize o arquivo theme.scss, style.scss ou timber.scss. Você então precisará apenas colar o código no final dessa página:

.product-form__item--submit, #addToCart-product-template.btn, #AddToCart--product-template.btn, #addToCart.btn, #AddToCart.btn, .product-form .btn, .product-form__cart-submit, .product-single__add-to-cart {
    width: 150px;
    hight: 100%;
}

Você poderá alterar o tamanho do botão como você desejar, alterando o tamanho em pixels na frente da palavra "width" ou utilizando porcentagem se você preferir. Para a altura, edite o campo "hight" em pixels ou porcentagem. 

Já para o campo de quantidade de sua página de produtos, dentro do mesmo arquivo onde você editou o botão de adicionar ao carrinho, cole o seguinte código no final da página:

input#Quantity {
    max-width: 55px;
}

O valor 55px pode ser substituído por qualquer outro número de sua preferência.

Caso você não tenha familiaridade com edições via código, ou tenha dificuldade em seguir os passos que compartilhei aqui, você poderá solicitar que nossa equipe te ajude com essas customizações. Para temas gratuitos em lojas que estejam em um de nossos planos pagos oferecemos 60 minutos de design com nossos especialistas. Para solicitar essa customização, por favor entre em contato com nosso suporte diretamente, adicionando os detalhes de tamanho e, se possível, exemplos do resultado que você quer alcançar.

Espero que isso ajude! 🙂 

Até mais! | Luisa