Rótulos Carrinho de compras

Storefront (loja)
#1

Boa tarde pessoal! Nas personalizações da loja eu consigo alterar o rótulo do botão de compras para “colocar na sacola” mas em todo o processo de compra o que continua aparecendo é “carrinho”. Ex. Meu Carrinho de Compras, Ver carrinho, Meu carrinho, etc…
Seria possível alterar? Ex. Minha Sacola de compras, Ver sacola, Minha sacola, etc…???

2 curtidas
#2

Bom dia, é possível sim. @carlospereira ou @silvavinicius conseguem passar um css pra ele? Loja é www.lojalov.com.br

3 curtidas
#3

Eu gostaria de saber como fazer também, por favor!

#4

Boa tarde @Carlos, tudo bem?

Abaixo o código CSS para a mudança que você requisitou. É só copiar e colar na área de CSS customizado. Os testes do @carlospereira não apresentaram nenhum erro, então se por acaso algo relacionado aos carrinhos passou batido, me avisa que adicionamos para você, tá bom? :grinning_face_with_smiling_eyes:

// Adicionar em Layout > Inserir Código > CSS Customizado

.minicart__empty .lead {
    font-size: 0;
}

.minicart__empty .lead:after {
    content: 'Sacola vazia ...';
    display: block;
    font-size: calc(1.25788rem + .0945vw);
    margin-bottom: 16px;
}

.minicart__aside .card-header{
    font-size: 0;
}

.minicart__aside .card-header:after {
    content: "Minha sacola de compras";
    font-size: 16px;
}

#spa .container h1 {
    font-size: 0;
}

#spa .container h1::before {
    display: block;
    content: 'Minha sacola';
    font-size: 2rem;
    color: var(--secondary);
    font-weight: 500;
}

.minicart__btn-cart {
    font-size: 0;
}

.minicart__btn-cart::after {
    content: 'Ver sacola';
    font-size: 1rem;
}
6 curtidas
#5

Show! Ficou muito bom!!! Só mais 2 coisinhas pq sou um chato…kkkkk
Qdo vou para o carrinho no navegador do computador a aba mostra “Meu Carrinho” e quando tiro o produto ele monstra “Carrinho vazio…”
Sei que é excesso de preciosismo, mas como disse sou um chato…kkkk

3 curtidas
#6

Bom dia @Carlos! Tudo certo, xará?
Adicionamos as mudanças no CSS que @silvavinicius tinha te passado e de acordo com nossos testes, no conteúdo da loja todos os ‘carrinhos’ estão sendo substituídos por ‘sacola’.
No entanto, você também pediu que fosse alterado o título da aba, e isto já não é possível só com CSS, sendo necessário adicionar um script adicional. De qualquer forma também cuidamos disso. Segue o código:

// Adicionar em Layout > Inserir Código > CSS Customizado

.minicart__empty .lead {
    font-size: 0;
}

.minicart__empty .lead:after {
    content: 'Sacola vazia ...';
    display: block;
    font-size: calc(1.25788rem + .0945vw);
    margin-bottom: 16px;
}

.minicart__aside .card-header{
    font-size: 0;
}

.minicart__aside .card-header:after {
    content: "Minha sacola de compras";
    font-size: 16px;
}

#spa .container h1 {
    font-size: 0;
}

#spa .container h1::before {
    display: block;
    content: 'Minha sacola';
    font-size: 2rem;
    color: var(--secondary);
    font-weight: 500;
}

.minicart__btn-cart {
    font-size: 0;
}

.minicart__btn-cart::after {
    content: 'Ver sacola';
    font-size: 1rem;
}
.cart__empty .lead.text-muted {
    font-size: 0;
}
.cart__empty .lead.text-muted::after {
    content: 'Sacola vazia ...';
    font-size: 16px;
}

.checkout__back .btn.btn-sm.btn-light {
    font-size: 0;
}

.checkout__back .btn.btn-sm.btn-light::after {
    content: 'Voltar à sacola';
    font-size: .875rem;
}

.product-card__buy.fade .btn.btn-primary.btn-block {
    font-size: 0;
}
.product-card__buy.fade .btn.btn-primary.btn-block::after {
    content: 'Adicionar à sacola';
    font-size: 1rem;
}
6 curtidas
#7

Agora os scripts

// Inserir no custom-js/checkout.js
function changeCartPageTitle(title) {
    const router = window.storefrontApp && window.storefrontApp.router 
    const currentRoute = router.currentRoute;
    if(currentRoute.name == 'cart') {
        document.title = title;
    }
};
window.onload = () => {
    changeCartPageTitle('Minha Sacola');
}

// Inserir no custom-js/pages.js
function changeCartButtonTitle(title) {
    const $cartButton = document.querySelector("#cart-button");
    $cartButton.title = title;
}

window.onload = () => {
    changeCartButtonTitle('Abrir Sacola');
}
6 curtidas
#8

Bom dia xará! Tudo ótimo!!!
Carlão, coloquei os scripts nos arquivos pages.js e checkout.js mas na hora de atualizar deu erro

image

#9

Vou verificar no deploy

1 curtida
#10

@carlospereira existe uma segunda forma de fazer isso. Ficou corretíssimo e vai funcionar, porém idealmente, é melhor editar o HTML do que fazer uma modificação via JS, a não ser que não tenha jeito mesmo. Nesse caso como chegou a pouco tempo, não deve ter visto ainda que o storefront das lojas possuem o html aberto. Alguns componentes são “escondidos” e podem ser abertos posteriormente para edição, mas outros você pode acessá-los via Template > Pages, esse é um caso. Para alterar isso @Carlos basta modificar loja-lov/header.ejs at master · ecomplus-stores/loja-lov · GitHub e substituir <%= _.dictionary('openCart') %> pelo texto desejado. Lembre-se de tirar o JS inserido

6 curtidas
#11

Show Matheus, muito obrigado a equipe mais uma vez!!!

3 curtidas