Logo menu + Anchor link

  • Author
    Posts
  • #162598

    geralavigne
    Member
    Original poster

    Hi, there!

    I need help with these two topics in my website > http://www.lavignedelemos.com.br

    1. I am trying to figure out how to change the logo color (to a black version) when the menu scrolls. Here is the link with the black logo image: https://lavignedelemos.files.wordpress.com/2021/04/af_logo_lavignedelemos_preto-08.png

    2. I want to add an anchor link to the footer (where the contact information is) but I don’t know how to add since the footer is a widget.

    Can you help me, pls?

    Thanks in advance :)

    Letícia

    The blog I need help with is: lavignedelemos.com.br

    #162603

    tarasdashkevych
    Theme Author

    Hello Letícia,

    “I am trying to figure out how to change the logo color (to a black version) when the menu scrolls.”
    – It’s not possible to change color of the image using CSS, so we need to use an alternative image for that. By default, WordPress allows to upload only a single logo image.

    However, it’s possible to change the logo image using a custom CSS.

    I would recommend you to set your black version of the logo as a default logo, and then add this custom CSS:

    
    @media (min-width: 768px) {
        .site-header:not(.scroll-header) .site-branding img {
            display: none;
        }
    
        .site-header:not(.scroll-header) .site-branding .custom-logo-link::before {
            background-image: url(https://lavignedelemos.files.wordpress.com/2021/04/cropped-cropped-af_logo_lavignedelemos-08-2.png);
            background-size: 220px 70px;
            background-repeat: no-repeat;
            display: block;
            width: 220px;
            height: 70px;
            content: "";
        }
    }
    

    “I want to add an anchor link to the footer…”
    – Have you managed to resolve this problem? I can see that your footer widgets include links in widgets.

    Please let me know if you have any additional questions about the logo or/and the links in the footer area.

    Kind regards,
    Taras

    #162623

    geralavigne
    Member
    Original poster

    Hey, Taras!

    Thanks for the help :)


    “I want to add an anchor link to the footer…”

    My client ended up preferring to create a contact page, so the link wasn’t necessary.

    About the menu, I have another question:
    Is there a way to freeze it to the top of the page and not scroll down?

    Thanks again!

    Letícia

    #162631

    tarasdashkevych
    Theme Author

    Hi Letícia,

    “Is there a way to freeze it to the top of the page and not scroll down? “
    – Sure. Please add this custom CSS to your site to disable sticky header functionality:

    @media (min-width: 768px) {
      .site-header {
        position: absolute;
      }
    }

    Let me know if you have any additional questions regarding this topic.

    Best regards,
    Taras

    #162766

    geralavigne
    Member
    Original poster

    Thanks, Tara!

    One last question:

    Is there a way to decrease the size of the image header in the blog section and the featured pages?

    thanks :)
    Letícia

    #162769

    geralavigne
    Member
    Original poster

    I just found out in another topic about the same question and this css works perfectly!

    .singular-page-header {
    height: 25em;
    }

    Thanks :))

    #162773

    geralavigne
    Member
    Original poster

    I’m closing the topic!

    #162782

    tarasdashkevych
    Theme Author

    Letícia,

    I am glad to hear you were able to find a solution :)

    Kind regards,
    Taras

The topic ‘Logo menu + Anchor link’ is closed to new replies.