Header icon pops out when I hover the cursol at the icon

Hi teams,
Thank you very much for providing us with the cool template, Shapely.
I love the design so much.
Here, I have two questions.
URL: https://maltashozo.com

  1. The header icon pops out big when I hover the cursor at the icon.
    I would like to stop this.
    This may occur as I might have put the link to the header icon.
    Just teach me how to remove the link.

  2. How to change the link colors
    I tried to change the link colors in the header and the “profile” page in vain adding the following css;
    a:link { color: #7a998f; }
    a:visited { color: #000000; }
    a:hover { color: #35997b; }

Thank you very much for your help in advance.

Masako

1 Like

Hey there,

  1. Please add this CSS code in the Appearance > Customize > Additional CSS:
a.custom-logo-link:hover img {
    width: 100% !important;
}
  1. there is no such thing to change all of them with such code, which one you want to change and where?

Regards,

Hi!
Thank you very much for your quick response.

  1. I did. On the computer, the icon is fine now.
    But the icon still gets bigger on a mobile phone.

  2. I would like to change the link color of the two places as attached.

Thanks & Best Regards,

Masako

Hey there,

Try this code for the color changes for link:

.main-navigation .menu li a {
color: #f30000 !important;
}
ul li a {
color: red !important;
}

Logo:

a.custom-logo-link:hover img {
    width: 100px !important;
}

Regards,

Thanks for your advice.
I added the CSS as you instructed last week.

But the link colors had not changed until I downloaded the Photo Gallery plugin today.
Strangely, now the hovering colors of the links are good. Thanks.

  1. I am facing another problem.
    This time, the color of the text, link color, and page title has returned to black again as attached.
    Could you kindly advise me on how to change the color to white again?

  2. Logo size on mobile remains the same although I added the CSS.
    Could you please let me know if there is any solution?

Thanks and best regards,

Hey there

@Masako I think you need to change the body text color:

body {
    color: #ffe7e7;
}


.main-navigation .menu li a {
    color: #fbe9e9;
}

Regards,

Hi, teams,

I sorted out the problem.
The CSS code added in the Customize > Additional CSS did not work at all.
I directly wrote the CSS code on the stylesheet in the child-theme.
Then, it successfully worked.

Thanks for your kind support.

Hi there,

Thank you for letting us know that you were able to resolve the issue by directly adding the CSS code to the child-theme stylesheet. We’re glad to hear that it worked for you!

If you have any further questions or need assistance with anything else, please feel free to reach out to us. We’re here to help.

Thanks again for your update and for choosing our product.

Regards,