[AJUDA] Alterações no layout CSS

Fala, galera, beleza?

Eu tô com dificuldades para fazer algumas modificações no layout da minha loja pelo CSS ou HTML. Seguem:

1- Não consigo alterar a fonte padrão da minha loja, a fonte do tema comprado parece não sair por nada :confused:
1.1- Teria como ter uma outra fonte para o menu?

2- Modificar a cor da fonte e background do rodapé

3- Eu consegui mudar a imagem do carrinho de compras, porém, no meu layout tem um box de sugestão de produtos e lá tem um carrinho que também queria modificar.

4- No topo da loja tem a área destinada para cadastro de e-mail para e-mail marketing. Quando eu passo o mouse por cima, as cores se invertem e dá um efeito bizarro.

5- O ícone de Procurar está desalinhado e eu não sei como resolver.

Então, galera… são essas coisas. Se alguém puder ajudar, eu seria eternamente grato!

Abraços!

Link da loja em manutenção: http://aussy-manutencao.lojaintegrada.com.br/

1 Curtida
  1. para mudar a sua fonte não tenho certeza de que á funcionar este método pois nem eu testei ainda hehehe mais faça o seguinte vá no Google Fontes e escolha sua fonte de preferencia depois clique em @import ele ira te dar um código onde você podera importar a fonte que você quer dai e só usa-lá com atributo css font-family.

1.1 Caso o passo um funcione com certeza ira funcionar para as outras partes do seu site como menu roda pé etc.

2.sim para modificar a cor do seu roda pé você ira precisar utilizar esse ID e CLASS

#rodape .institucional { background-color: #b72323; }

você pode ver mais alterações usando o console do seu navegador fica a dica ^^
quanto as cores da fonte utilize isso:

#rodape .titulo, #rodape .institucional * {
    color: #d6d6d6;
}

3.para trocar o icone do box sugestão use isso

.icon-shopping-cart:before {
    content: "";
    display: block;
    background: url(http://i.imgur.com/xzfcxp8m.png) no-repeat !important;
    width: 40px;
    height: 40px;
}

4.esse efeito que acontece quando você passa o mouse em cima se chama hover use isso para poder remove-lo

.componente .interno:hover {
    background-color: transparent;
}
  1. Seu icone aqui está correto não sei do que se trata mais está ok na minha tela

DICA: Amigo o ideal seria se aprofundar um pouco mais com CSS se você dominar isso você consegue dominar essa plataforma uns 80% utilize o console do seu navegador para poder auxilia-ló nas edições de seu site e uma forma rápida e eficaz de alterar os componentes de seu site.

4 Curtidas

Muito obrigado, @FELIPeh123456789. Me ajudou bastante! O do ícone eu já havia conseguido trocar.

Deixa eu fazer mais umas perguntas, se não for abuso, rs.

1- Tem como fazer um hover de zoom nos mini banners, logo abaixo do fullbanner? Seria um zoom básico, talvez escurecendo um pouco a imagem.

2- Na página do produto, tem como dar zoom nas fotos ao passar o mouse em cima delas, para o cliente ver os detalhes? Alguns temas da loja tinham essa função, mas o que peguei, infelizmente, não tem :confused:

3- No rodapé, tem como colocar uma imagem ao invés de só trocar a cor?

Muito obrigado! Abraços!

1 Curtida

De nada amigo então esses efeitos hovers com zoom tem como fazer sim faça o seguinte:

   li.flex-active-slide img:hover  {
            -moz-transform: scale(1.3);
            -webkit-transform: scale(1.3);
            transform: scale(1.3);
        }

li.flex-active-slide img {
    transition: .5s;
}

cara esses dois códigos fazem esse efeito que você quer claro que se pegar em mais alguma componente que você não queira terá que analisar o código para ver se ele esta utilizando a mesma class mais creio eu que não vá bugar nada

  1. Se não me engano nas próprias configurações da loja integrada você habilita isso caso contrario o código e basicamente o mesmo do item 1

  2. tem e só você upar uma imagem a sua escolha na própria interface da loja integrada depois você ao invés de usar background-color utilize background-image:url(url da imagem) exemplo:

     #rodape .institucional {
         background-image: url(https://cdn.awsli.com.br/386/386267/arquivos/footer.jpg);
     }
    

é isso espero ter ajudado de novo hehehehe qualquer coisa estou a disposição.

2 Curtidas

Cara, tu é meu ídolo, hahahah

Muito obrigado!

Em relação as fontes, eu só consegui nos títulos… e não no corpo todo do site. Ainda está com uma fonte serifada do tema.

heheh que isso precisando é só chamar hehehe

Mais tente isso

body{
font-family: 'Ravi Prakash', cursive;
}

essa fonte é de exemplo você deve usar o @import da sua fonte no site que mencionei anteriormente do google fonts o import dessa fonte seria isso

@import url('https://fonts.googleapis.com/css?family=Ravi+Prakash');

lembrando que esse import deve estar no topo do seu css e a primeira coisa que o css deve pegar depois seu código tente isso e veja se resolve

Não foi. Veja se é isso mesmo:

@import url(‘https://fonts.googleapis.com/css?family=Marvel:700’);

.titulo { font-family: ‘Marvel’, sans-serif; font-weight: 400; }
#cabecalho .menu.superior .titulo {font-size:20px}
body{
font-family: ‘Marvel’, sans-serif;
}

Essas são as primeiras linhas do meu CSS
A fonte do título já estava indo normal… a do restante que persiste o erro.

Eu entro no “inspecionar elemento” no navegador, como sugeriu. Lá, eu desmarco a fonte e toda a fonte do meu site muda, conforme quero. Mas não sei como levar isso, em código, para o CSS

copia a sua alteração do inspecionar elemento incluindo as class e os id que aparecem exemplo se no seu inspecionar esta assim

body.sapn9 .menu .superior{
    margin-left:15px;
}

você copia tudo e cola no css da loja que vai

Valeu pela ajuda, cara. Consegui mexer em bastante coisa só mexendo no inspecionar elemento.

Só tem 2 coisas que tô empacado. No menu, tem um hover quando se passa o mouse pelas categorias, e esse hover está ficando em cima do meu logo. A ideia é: Ou diminuir a largura desse hover, ou colocar prioridade pro meu logo, fazendo com que ele fique sempre a frente de tudo.

E a outra é retirar o logo do Admake no rodapé. No inspecionar, eu consigo colocar a visibilidade 0, mas não consigo retirá-lo. Ele ocupa muito espaço no rodapé.

Se puder me ajudar nessas duas coisas, seria irado! Haha

Como alterar a fonte no site todo e no mobile?
Alterei no meu. Mas só mudou em algumas partes e no mobile continua a antiga.
Como fica no código?

Já fiz diversas alterações via CSS com códigos por aqui, mas ainda preciso acertar mais coisas.
Agradeço à quem se ajudar.

Obrigado.

Cara… as primeiras linhas do meu código são:

.titulo { font-family: ‘Marvel’, sans-serif; font-weight: 400; }
#cabecalho .menu.superior .titulo {font-size:20px}

body{
font-family: ‘Marvel’, sans-serif;
}

No caso, Marvel é a minha fonte. Não sei se vai funcionar aí, haha

Tentei e não fez diferença. Precisa importar do Google para aparecer no site todo?
Parece que está faltando algo nesse processo…

Opa… tem sim. Tenta colocar isso no topo do seu código:

@import url(‘https://fonts.googleapis.com/css?family=Marvel:700’);

*O URL é o do google font que ele te dá

Boa tarde.

Estou tentando alterar o ícone de uma das minhas formas de pagamento via CSS. Aparentemente o que fiznão funcionou. Alguém poderia me auxiliar?!

Oi Felipe, tudo bom?
Percebi que você é o cara do CSS.
Gostaria que você me ajudasse a diminuir a fonte do menu (todos os itens na mesma linha - se possível, maiúscula e a fonte branca. Segue o link para você analisar.
https://portalvivabem.lojaintegrada.com.br/

Obrigada

Oi Felipe. Desculpe lhe escrever diretamente, mas preciso resolver uma questão de layout que deve tirar e letra. Preciso altear a imagem de uma das formas de pagamento. Alterando no inspecionar elemento funciona, mas não consigo deixar permanente na LI.
Abaixo o que alterei e tentei salvar. www.supriflex.com.br

Pague em 28 dias.
            <span class="cor-secundaria">
                Desconto de <b class="cor-principal">5%</b>
            </span>

@FELIPeh123456789 bom dia Felipe, pode me ajudar, pq estou com algumas dificuldades e até agora ninguém me ajudou. É possivel eu alterar o codigo fonte direto no site ? Onde eu teria que mexer, pq só abre em branco e não sei onde isso vai alterar.
Grato

Oi @supriflex! Eu vi que no seu site ao passar o mouse no menu a cor da fonte das categorias muda, saberia me dizer qual o código para fazer esse efeito?
Se souber me ajudar ficarei agradecido.
Abraço