Jump to content
Vanessa Andrade

Modificando o carrinho no menu da loja virtual tray com CSS

Recommended Posts

BOA NOITE PESSOAL,

 

ESTOU COM UMA DÚVIDA POR FAVOR SE PUDEREM ME AJUDAR.

 

COMO FAÇO PARA ALTERAR O CARRINHO DA MINHA LOJA UTILIZANDO O CSS, O TEMA TEM ESSA SACOLINHA COM PATINHA DE CACHORRO, QUERO TROCAR POR UMA CARRINHO NORMAL....

QUANDO COLOCO PARA INSPECIONAR ELEMENTO APARECE ESSE MONTE DE INFORMAÇÃO...

NÃO SEI COMO FAÇO.

1.JPG

Share this post


Link to post
Share on other sites

Boa noite, Vanessa tudo bem?

 

sou iniciante com a plataforma da tray tambem e estou quebrando a cabeça para editar meu tema kk.

 

mais tenta ai vai que da certo, vai em > Inicio > Minha Loja > Design da Loja.

 

o layout que ta ativado clica em duplicar tema e salvar volte novamente para > Inicio > Minha Loja > Design da Loja.

 

e click em Edita HTML no tema . Cópia Animais de Estimação la dentro do codigo de fonte voce vai em " img > icone-carrinho.png;

 

e tenta editar por la desse salva e sobe novamente a pagina click na seta para baixo do lado de botão azul publicar e abre visualizar tema.

 

aguarde uns 10 a 15 minutos que e o tempo de reset dos cache se de certo vai ta la o novo icon do carrinho.

Share this post


Link to post
Share on other sites

Bom dia Thales, 

Muito obrigada pela sua resposta, me desculpe não sou muito leiga no assunto.

Só não entendi essa parte Cópia Animais de Estimação la dentro do codigo de fonte voce vai em " img > icone-carrinho.png;

 

Se for onde estou pensando que é não deu certo, 

22.JPG

Share this post


Link to post
Share on other sites

deixa eu explicar melhor acabei de olhar a respeito desse tema.

 

os ícones de ilustração desse tema e composto de código "SVG", eu não sou programador apenas estou montando uma loja na plataforma da tray também.

 

oque ocorre para você conseguir tirar aquele ícone dali de cima ou mudar você terá que acessar o código fonte dele e fazer essa alteração.

 

esse código abaixo e o dele.

 

para que você consiga fazer a alteração do icon carrinho vai ser nessa área

 

local:

 

elements/snippets/customer.html

e

elements/header.html

 

http://www.kadunew.com/blog/html/svg-sprite-como-criar-um-arquivo-de-icones-usando-svg

<div class="carrinhotopo">
    <a href="{{ links.cart }}">
        <div class="row">
            <div>
                <svg viewBox="0 0 1024 1024">
                    <path class="path1" d="M351.958 794.997h522.773c0.361-1.779 0.677-3.703 1.060-5.245 16.692-69.899 63.846-309.948 3.069-587.889-2.498-11.425-4.084-30.061-3.345-41.718l8.272-129.663c0.741-11.657-6.155-15.338-15.422-8.208l-61.541 47.346c-9.265 7.13-23.758 6.515-32.391-1.376l-52.868-48.278c-8.63-7.869-22.807-8.102-31.69-0.487l-70.279 60.229c-8.865 7.595-22.637 6.94-30.718-1.48l-62.091-64.587c-8.102-8.42-21.219-8.42-29.32 0l-62.091 64.587c-8.104 8.42-20.966 8.188-28.752-0.529l-63.253-70.828c-7.785-8.717-20.924-9.203-29.322-1.102l-68.268 65.731c-8.42 8.104-23.081 9.371-32.749 2.814l-78.339-53.058c-9.668-6.557-13.455-3.301-9.54 7.699 8.672 24.371 21.070 70.576 20.902 131.375h459.772c11.677 0 21.154 9.478 21.154 21.154s-9.478 21.154-21.154 21.154h-462.038c-0.381 3.872-0.529 7.553-1.035 11.528-6.221 49.736-61.224 185.936 3.343 574.497 1.925 11.531 3.133 30.338 2.496 41.992-2.053 38.227-7.15 119.083-15.528 163.83-2.157 11.486 2.772 15.081 12.312 8.354l89.763-63.361c9.542-6.748 23.272-4.865 30.654 4.21l53.735 65.943c7.383 9.055 19.504 9.179 27.079 0.296l56.676-66.534c7.573-8.887 19.272-8.44 26.128 1.038l51.979 71.779c6.854 9.456 19.104 10.429 27.375 2.179l72.478-72.481c8.27-8.27 21.387-8.018 29.32 0.573l62.684 67.698c7.933 8.568 20.396 8.208 27.798-0.825l57.246-69.709c7.425-9.033 20.564-10.133 29.384-2.451l81.469 70.954c8.803 7.679 15.168 4.442 14.239-7.192-3.108-38.61-9.562-120.588-11.951-167.615h-519.474c-11.677 0-21.154-9.478-21.154-21.154-0.002-11.714 9.478-21.192 21.154-21.192zM689.705 431.545c23.971 7.657 34.442 41.846 23.42 76.35s-39.393 56.273-63.339 48.614c-23.971-7.659-34.442-41.824-23.42-76.35 11.022-34.504 39.371-56.271 63.339-48.614zM534.445 388.051c11.509-36.070 42.333-58.432 68.817-49.968 26.488 8.462 38.61 44.554 27.101 80.602-11.531 36.070-42.333 58.432-68.819 49.968-26.484-8.462-38.63-44.532-27.099-80.602zM525.074 477.666c0 0 102.458 17.369 101.969 135.373 0.319 69.306-57.308 39.371-57.308 39.371s-24.351-24.519-44.638-24.519l-5.184 0.465c-20.289 0-44.66 24.519-44.66 24.519s-57.627 29.535-57.311-39.751c-0.529-118.004 101.949-135.457 101.949-135.457h5.184zM440.262 336.833c25.132-7.615 55.596 16.247 68.036 53.333 12.462 37.085 2.179 73.326-22.953 80.941s-55.596-16.247-68.036-53.333c-12.44-37.085-2.159-73.323 22.953-80.941zM356.042 429.050c23.926-7.214 52.972 15.506 64.883 50.731 11.889 35.245 2.137 69.664-21.792 76.879-23.926 7.214-52.972-15.506-64.883-50.729s-2.157-69.666 21.792-76.881z"></path>
                </svg>
                <div class="contadorcarrinho" data-cart="amount">{{ cart.amount }}</div>
            </div>
            <div>
                <span class="nomecarrinho">Minha Sacola</span>
                <div class="precocarrinho">R$ <span data-cart="price">{{ cart.price }}</span></div>
            </div>
        </div>
    </a>
</div>

 

Share this post


Link to post
Share on other sites

Nosssssa, isso é muito dificil.

Tentei gerar o svg no site que me indicou:

<link rel="stylesheet" href="https://i.icomoon.io/public/temp/da4553b091/UntitledProject/style-svg.css">
<script defer src="https://i.icomoon.io/public/temp/da4553b091/UntitledProject/svgxuse.js"></script>

 

Mas depois dai não foi para lugar nenhum fiquei travada.

 

Obrigada mais uma vez, infelizmente não vou conseguir só sei copiar e colar rsrrs.

icons8-carrinho-de-compras-50.png

icons8-compras-do-saco-cheio-50.png

Um desses dois que eu queria usar!!!

 

Share this post


Link to post
Share on other sites
<div class="carrinhotopo">
    <a href="{{ links.cart }}">
        <div class="row">
            <div>
                <svg viewBox="0 0 1032 1032">
                    
                    <path class="path1" d="M409.6 1024c-56.464 0-102.4-45.936-102.4-102.4s45.936-102.4 102.4-102.4 102.4 45.936 102.4 102.4-45.936 102.4-102.4 102.4zM409.6 870.4c-28.232 0-51.2 22.968-51.2 51.2s22.968 51.2 51.2 51.2 51.2-22.968 51.2-51.2-22.968-51.2-51.2-51.2z"></path><path class="path2" d="M768 1024c-56.464 0-102.4-45.936-102.4-102.4s45.936-102.4 102.4-102.4 102.4 45.936 102.4 102.4-45.936 102.4-102.4 102.4zM768 870.4c-28.232 0-51.2 22.968-51.2 51.2s22.968 51.2 51.2 51.2 51.2-22.968 51.2-51.2-22.968-51.2-51.2-51.2z"></path><path class="path3" d="M898.021 228.688c-12.859-15.181-32.258-23.888-53.221-23.888h-626.846l-5.085-30.506c-6.72-40.315-43.998-71.894-84.869-71.894h-51.2c-14.138 0-25.6 11.462-25.6 25.6s11.462 25.6 25.6 25.6h51.2c15.722 0 31.781 13.603 34.366 29.112l85.566 513.395c6.718 40.314 43.997 71.893 84.867 71.893h512c14.139 0 25.6-11.461 25.6-25.6s-11.461-25.6-25.6-25.6h-512c-15.722 0-31.781-13.603-34.366-29.11l-12.63-75.784 510.206-44.366c39.69-3.451 75.907-36.938 82.458-76.234l34.366-206.194c3.448-20.677-1.952-41.243-14.813-56.424zM862.331 276.694l-34.366 206.194c-2.699 16.186-20.043 32.221-36.39 33.645l-514.214 44.714-50.874-305.246h618.314c5.968 0 10.995 2.054 14.155 5.782 3.157 3.73 4.357 9.024 3.376 14.912z"></path>
                </svg>
                <div class="contadorcarrinho" data-cart="amount">{{ cart.amount }}</div>
            </div>
            <div>
                <span class="nomecarrinho">Meus Produtos</span>
                <div class="precocarrinho">R$ <span data-cart="price">{{ cart.price }}</span></div>
            </div>
        </div>
    </a>
</div>

 

https://static.eventials.com/media/e55e91b2cc22ba117ba8d1546537f7a4c037cf67/792c87461ea57aa1563e32672785fedb0620e474/1464099001/trayopencodetreinamentoparceiros.pdf

Share this post


Link to post
Share on other sites

eu esqueci de remover o nome segue o codigo sem ele

 

<div class="carrinhotopo">
    <a href="{{ links.cart }}">
        <div class="row">
            <div>
                <svg viewBox="0 0 1032 1032">
                    
                    <path class="path1" d="M409.6 1024c-56.464 0-102.4-45.936-102.4-102.4s45.936-102.4 102.4-102.4 102.4 45.936 102.4 102.4-45.936 102.4-102.4 102.4zM409.6 870.4c-28.232 0-51.2 22.968-51.2 51.2s22.968 51.2 51.2 51.2 51.2-22.968 51.2-51.2-22.968-51.2-51.2-51.2z"></path><path class="path2" d="M768 1024c-56.464 0-102.4-45.936-102.4-102.4s45.936-102.4 102.4-102.4 102.4 45.936 102.4 102.4-45.936 102.4-102.4 102.4zM768 870.4c-28.232 0-51.2 22.968-51.2 51.2s22.968 51.2 51.2 51.2 51.2-22.968 51.2-51.2-22.968-51.2-51.2-51.2z"></path><path class="path3" d="M898.021 228.688c-12.859-15.181-32.258-23.888-53.221-23.888h-626.846l-5.085-30.506c-6.72-40.315-43.998-71.894-84.869-71.894h-51.2c-14.138 0-25.6 11.462-25.6 25.6s11.462 25.6 25.6 25.6h51.2c15.722 0 31.781 13.603 34.366 29.112l85.566 513.395c6.718 40.314 43.997 71.893 84.867 71.893h512c14.139 0 25.6-11.461 25.6-25.6s-11.461-25.6-25.6-25.6h-512c-15.722 0-31.781-13.603-34.366-29.11l-12.63-75.784 510.206-44.366c39.69-3.451 75.907-36.938 82.458-76.234l34.366-206.194c3.448-20.677-1.952-41.243-14.813-56.424zM862.331 276.694l-34.366 206.194c-2.699 16.186-20.043 32.221-36.39 33.645l-514.214 44.714-50.874-305.246h618.314c5.968 0 10.995 2.054 14.155 5.782 3.157 3.73 4.357 9.024 3.376 14.912z"></path>
                </svg>
                <div class="contadorcarrinho" data-cart="amount">{{ cart.amount }}</div>
            </div>
            <div>
                <span class="nomecarrinho"></span>
                <div class="precocarrinho">R$ <span data-cart="price">{{ cart.price }}</span></div>
            </div>
        </div>
    </a>
</div>

 

Share this post


Link to post
Share on other sites

Boa tarde Thales,

 

Tudo bem? Espero que sim.

Quando puder acessa minha página já ativei o tema modificado, mas ainda estou ajustando....

No pc aparece o banner normal, mas quando acesso do meu celular j7 ele corta o banner na versão mobile, você tem idéia de como ajusto, estranho não alterei nada na versão mobile...

Obrigada, mais uma vez .

E como está indo na sua página????

Share this post


Link to post
Share on other sites

Oi, vi que vcs estão conversando sobre o Tema da tray de animais de estimação.

Também uso esse tema e na home quando passamos o mouse em cima do produto, aparece a patinha escrito Quero Esse!

Gostaria de mudar essa imagem, e não estou achando no html, você podem me ajudar?

Obg

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

  • Similar Content

    • By fideles
      Mais uma vez venho aqui pedir ajuda a vocês.
       
      Tenho um formulario que criei aqui na empresa algo bem simples, somente para sair das planilhas de excel, que seria cadastro de funcionarios.
       
      Tem os campos, matricula, nome completo, unidade de trabalho, endereço e telefone de emergencia.
       
      A parte do formulario funciona, a gravação no BD tbm, listar as informações também, ai me perguntaram se era possível um auto preenchimento dos campos colocando somente a matricula do funcionario e respondi que eu não sei porque realmente não sei.
       
      A ajuda que eu preciso de vocês seria, é possível fazer isso ? Colocar a matricula e vir do banco e preencher os outros inputs? Se sim, é possível me derem um exemplo de como funciona e eu estudar o codigo e colocar nos outros inputs.
       
      Obrigado antecipadamente. 
       
    • By lezão
      Boa noite!
      Td bem com vcs?
      Peguei um codigo de modal muito util para mim, mas ele naun sai do lugar, estou tentando posiciona lo em outro lugar e naun consigo.
      Ja fiz de tudo e nada resolveu alguém pode me ajudar?
      Gostaria que ele ficasse, aonde eu colocar ele aceitar e rodar.
      segue o codigo abaixo:
      <style> body {font-family: Arial, Helvetica, sans-serif;} * {box-sizing: border-box;} /* Button used to ppen the contact form - fixed at the bottom of the page */ .open-button { background-color: #555; color: white; padding: 16px 20px; border: none; cursor: pointer; opacity: 0.8; position: fixed; bottom: 23px; right: 28px; width: 280px; } /* The popup form - hidden by default */ .form-popup { display: none; position: fixed; bottom: 0; right: 15px; border: 3px solid #f1f1f1; } /* Add styles to the form container */ .form-container { max-width: 300px; padding: 10px; background-color: white; } /* Full-width input fields */ .form-container input[type=text], .form-container input[type=file], .form-container input[type=textarea] { width: 100%; padding: 15px; margin: 5px 0 22px 0; border: none; background: #f1f1f1; } /* When the inputs get focus, do something */ .form-container input[type=text]:focus, .form-container input[type=file]:focus, .form-container input[type=textarea]:focus { background-color: #ddd; outline: none; } /* Set a style for the submit/login button */ .form-container .btn { background-color: #4CAF50; color: white; padding: 16px 20px; border: none; cursor: pointer; width: 100%; margin-bottom:10px; opacity: 0.8; } /* Add a red background color to the cancel button */ .form-container .cancel { background-color: red; } /* Add some hover effects to buttons */ .form-container .btn:hover, .open-button:hover { opacity: 1; } </style> <button class="open-button" onclick="closeForm()">Open Form</button> <div class="form-popup" id="myForm"> <form action="/action_page.php" class="form-container"> <h1> <img src="http://mercatotal.com.br/gnservice/img/logotipo2.png" width="170px" height="70px"/></h1> <label for="nome"><b>Nome:</b></label> <input type="text" placeholder="Seu Nome" name="nome" required/> <label for="foto"><b>Foto:</b></label> <input type="file" placeholder="Sua Foto" name="foto" required/> <label for="comment"><b>Comentários:</b></label> <textarea placeholder="Seu Comentário" name="depoimento" cols="36,7" rows="10" required></textarea> <button type="submit" class="btn">Login</button> <button type="button" class="btn cancel" onclick="openForm()">Close</button> </form> </div> muito obrigado!
    • By carlosmassam
      Bom noite a todos.

      Eu tenho o seguinte código
       
      <input type="radio" id="radio01" name="radio01" value="radio01"> <input type="radio" id="radio02" name="radio02" value="radio02"> <input type="radio" id="radio03" name="radio03" value="radio03"> <input type="radio" id="radio04" name="radio04" value="radio04"> <input type="radio" id="radio05" name="radio05" value="radio05"> Este código me apresenta 5 radiobuttons distintos, um ao lado do outro. Eu gostaria que, ao clicar em um deles, desse check no radiobutton que eu cliquei e também em todos os radiosbuttons anteriores, e os radionbutton posteriores fossem "deschecado".
      Por exemplo: ao clicar no radio04, ele deve fichar com check, e os radio03, radio02 e radio01 também devem ficar com check, como o radio05 vem depois do radio04, ele não deve ser checado, então permanecerá como está.
      Mas se eu então clicar no radio02, os radio03 e radio04 devem mudar para "deschecado" e os radio02 e radio01 devem permanecerem checados.
    • By lezão
      Boa tarde, meus amigos (as)!
      Estou tentando fazer uma box desse jeito da foto em anexo.
       
       
      Este é o código que estou tentando fazer ficar igual a da foto...
       
      alguém pode me ajudar ?
       
      fieldset{ width:100%; height:100%; padding: 1em; font:80%/1 sans-serif; border-radius: 10px; padding: 5px; min-height:1px; background: -webkit-linear-gradient(90deg, #CCCCCC, #FFFFFF) repeat scroll 0 0 transparent; background: -moz-linear-gradient(90deg, #CCCCCC, #FFFFFF) repeat scroll 0 0 transparent; border: 1px solid #AAAAAA; border-radius: 10px 10px 10px 10px; box-shadow: 0 0 15px #AAAAAA; font-size: 15px; color: #000; text-transform: uppercase; text-align: center; } div.box { width: 250px; display: inline-block; padding: 15px; min-height:1px; } <div class="box"> <fieldset onclick="location.href='#'" style="cursor:pointer;" align="center"> <img src="btn-galeria.png" width="130" height="130" /> <br/><br/> <span> Galeria de Fotos</span> <br/><br/> </fieldset> </div>  

    • By vinissant7
      Boa tarde Amigos,
       
      Estou precisando que quando o usuário esteja logado, e ele clique em um link dentro da imagem (tag area com HREF) ele cadastre no banco de dados o nome e email do usuário e a hora que ele entrou no link, lembrando que quando ele loga ele inicia uma SESSION.
       
      é possivel fazer isso na tag <map> <area href="####" > </map> ?
       
      Desde já obrigado!
       
×

Important Information

Ao usar o fórum, você concorda com nossos Terms of Use.