Como MUDAR A COR DA LOGO E DO MENU ao rolar a página | Elementor

IMG_9717

Micaela Soares

Fundadora

Neste artigo

    Nesse vídeo, ensino como mudar a cor da logo e também a cor do menu ao rolar(scrollar) páginas criadas com o elementor. 🔻🔻Links mencionados no vídeo🔻🔻

    ✔️Criando menu fixo e transparente com elementor: https://youtu.be/qIQ3Z3kOr3I

    ✔️Como criar um Menu Diferente para cada página com Elementor: https://youtu.be/jMYLLi4O6V4

    Código CSS utilizado:

    #header.elementor-sticky–effects { background-color: #fff; transition: all .5s ease; box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.1); } #header.elementor-sticky–effects .logo img { content:url(‘link da logo’); } #header.elementor-sticky–effects .roblox li a { color: #031154!important; }

    ✔️ Link do site mostrado no vídeo – http://descomplicandosites.com.br/tut… ✔️ Link do nosso site – http://descomplicandosites.com.br/

    ✔️ Link do vídeo anterior – https://youtu.be/8MfINC3VBvs ☑️ Como MUDAR A COR DA LOGO E DO MENU ao rolar a página | Elementor ☑️Compartilhe o vídeo: https://youtu.be/ANLXu24eaMI

    ☑️Se inscreva para ver novos vídeo e dicas sobre WordPress, Elementor e Woocommerce. Clique aqui: https://bit.ly/QueroMeInscreverDS

    Dependendo do design do site desenvolvido com elementor, será necessário mudar o logotipo do cabeçalho e de repente a cor dos itens de menu ao rolar(scrollar/escrollar) a página, para que o menu fixo não misture com o layout do site e provocar uma experiência ruim ao usuário que navega no site. Por exemplo: suponhamos que você tenha um menu fixo transparente que combine com seu lindo banner e sua cor de logo, mas na rolagem da página tanto a logo quanto os itens de menu, ficam misturando com o restante do layout do site. E isso não fica visualmente agradável. Neste caso, você precisará trocar a logo para um outra com uma cor diferente e também mudar a cor dos itens de menu ao scrollar a página. Esse tutorial é para resolver esse problema.

    📍 Sigam nossas redes sociais

    💲 Facebook – http://facebook.com/descomplicandosites

    💲 Instagram – https://instagram.com/descomplicando….

    Foto de Micaela Soares

    Micaela Soares

    Eu sou a Micaela Soares, criadora do Descomplicando Sites. Aqui, eu ensino de forma prática e direta como criar sites profissionais usando WordPress e Elementor, mesmo que você esteja começando do zero. Ao longo da minha trajetória, transformei o que aprendi no mercado em um método simples de aplicar, focado não só em design, mas em criar sites que passam credibilidade, atraem clientes e geram resultado de verdade. Hoje, compartilho conteúdos no YouTube e aqui no blog, além de desenvolver templates e materiais que facilitam o dia a dia de quem quer trabalhar com criação de sites ou melhorar a presença online do próprio negócio.
    Foto de Micaela Soares

    Micaela Soares

    Eu sou a Micaela Soares, criadora do Descomplicando Sites. Aqui, eu ensino de forma prática e direta como criar sites profissionais usando WordPress e Elementor, mesmo que você esteja começando do zero. Ao longo da minha trajetória, transformei o que aprendi no mercado em um método simples de aplicar, focado não só em design, mas em criar sites que passam credibilidade, atraem clientes e geram resultado de verdade. Hoje, compartilho conteúdos no YouTube e aqui no blog, além de desenvolver templates e materiais que facilitam o dia a dia de quem quer trabalhar com criação de sites ou melhorar a presença online do próprio negócio.
    🎨 Parceiro oficial

    Crie sites profissionais sem código com Elementor Pro

    O construtor visual mais completo do WordPress, com mais de 100 widgets exclusivos.

    Testar agora →
    ⚡ Parceiro oficial

    Hospedagem rápida e barata para seu WordPress

    Use o cupom DESCOMPLICANDOSITES e economize até 85% na Hostinger.

    Ver oferta →

    Respostas de 3

    1. Ola, bom dia.

      Muito boa a aula.

      Queria tirar uma duvida, ao colocar o css com o link da outra logo, quando rolo a pagina a logo fica imensa, saberia me dizer como corrigir isso?

    Deixe um comentário

    O seu endereço de e-mail não será publicado. Campos obrigatórios são marcados com *

    Continue aprendendo