Viewing 9 posts - 1 through 9 (of 9 total)
  • Author
    Posts
  • February 22, 2025 at 10:32 pm #1477669
    rehgold

    Unfortunately, I can’t find out on my own.
    I want to move an existing website to enfold theme. In the old theme, the header logo
    is adapted to the browser window and is fully responsive. I can’t do that with enfold. Does anyone have a suggestion?

    Thanks in advance
    Rainer

    February 23, 2025 at 11:17 am #1477693
    Rikard

    Hey rehgold,

    Could you link to an example so that we can see what you are looking to achieve please?

    Best regards,
    Rikard

    February 23, 2025 at 1:45 pm #1477697
    rehgold
    This reply has been marked as private.
    February 23, 2025 at 8:13 pm #1477716
    Rikard

    Hi,

    Thanks for that. I’m still not sure that I fully understand your intentions though, since the site you linked to has a background image on desktop resolutions, and only a text link on lower resolutions. Are you looking to set a background image to the header? If so, then that can be set under Enfold->General Styling->Logo Area.

    Best regards,
    Rikard

    February 23, 2025 at 9:25 pm #1477718
    rehgold

    Hi Rikard.
    The idea is to put this image https://artelt.inburlozuhause.de/wp-content/uploads/2025/02/Header_Logo_1.png as a background or Logo like on this Web page https://artelt-beratung.de. you can see it there fullresponsive it scales with the browser size.

    If i put it as a background image, it will be cut because it is to wide,
    I use the image as a logo it is to small.

    cu
    Rainer

    February 24, 2025 at 5:10 am #1477733
    Ismael

    Hi,

    We set the image as the background in the Enfold > General Styling > Logo Area panel and adjusted the header height in Header > Header Layout > Header Size to a custom pixel value. We then added this css code to adjust the background image height and hide the default logo.

    .header_color .header_bg {
    background: var(--enfold-header-color-background-image);
    background-size: auto 240px;
}

.logo img, .logo svg {
    display: none !important;
}

    Screenshot:

    View post on imgur.com

    Best regards,
    Ismael

    February 24, 2025 at 8:48 am #1477754
    rehgold

    Hi Ismael
    Thank you very much for your efforts. I’ll see how I get on with it.

    thankes a lot
    Rainer

    February 24, 2025 at 4:57 pm #1477795
    Rikard

    Hi,

    Thanks for the update. Please let us know if you should need any further help on the topic, or if we can close it.

    Best regards,
    Rikard

    February 24, 2025 at 7:16 pm #1477808
    rehgold

    Hi Rikard
    Sure you can close this case.

    Cu
    Rainer

  • Author
    Posts
Viewing 9 posts - 1 through 9 (of 9 total)
  • The topic ‘how to make the header logo image responsive and fit to browser width?’ is closed to new replies.