Viewing 9 posts - 1 through 9 (of 9 total)
  • Author
    Posts
  • May 30, 2016 at 12:40 am #640053
    mmsdev

    Hi!

    What’s the widest you can have a logo?
    Our logo has the company name next to it and its quite long..

    I can do it with cutting it up and using the logo area for the logo and then the company name as a header background image, so they look like one.
    This seems to work ok on most pages (with a bit of guess work getting them to line up)

    But the issue is we have a transparent header on the home page which is black with white menu items and the background image we are using as a work around is black text.

    So it would be better all round to use the actual logo area then we can have a transparent version of the logo which is set in the “Transparency Logo” setting in Theme Theme Options>Header>”Transparency Logo

    Unless there is also a setting to have a alternate transparent header image>?

    May 30, 2016 at 1:29 am #640058
    Josue

    Hey,

    Both workarounds can be achieved with CSS but we’d need to see the site live.

    Best regards,
    Josue

    May 30, 2016 at 2:15 am #640064
    mmsdev

    Hi. Josue!
    Here you go.

    • This reply was modified 8 years, 6 months ago by mmsdev.
    May 30, 2016 at 12:43 pm #640284
    Josue

    Hi,

    Disable the background image from the theme settings and use this CSS code instead:

    /* Transparent */
.av_header_transparency #header_main .container .inner-container {
    background: url(https://s3-eu-west-1.amazonaws.com/midischool/~midischool/wp-content/uploads/2016/05/23143639/site-header21.jpg) no-repeat top center;
}

/* Non-transparent */
#header_main .container .inner-container {
    background: url(https://s3-eu-west-1.amazonaws.com/midischool/~midischool/wp-content/uploads/2016/05/23143639/site-header21.jpg) no-repeat top center;
}

    Best regards,
    Josue

    May 30, 2016 at 2:18 pm #640374
    mmsdev

    Thanks but now it looks like this..

    Even if i made them not on a white background (obvious) on both back grounds as per attachment

    1: Transparent It is showing a white back ground on the logo
    2: Scroll down / mobile it is not in line with the logo anymore.

    3: On a mobile it looks like attachment 3 (Should not show the header image)

    • This reply was modified 8 years, 6 months ago by mmsdev.
    May 31, 2016 at 12:18 pm #640865
    Andy

    Hi,

    I checked your website on desktop and on mobile. It looks good to me on both. Could you fix it already? if not please send us a mockup with the results you want to achieve, so we can provide you some precise css code.

    Best regards,
    Andy

    May 31, 2016 at 3:05 pm #640941
    mmsdev

    No defiantly not right.

    See attachments for mock ups of how it should look, its not a massive or complicated look.

    Would be completely strait forward if enfold had a setting for “alternative header image when transparent” as its does for the logo.

    1: Header mock up for transparent header
    2: Header when scrolled down, white header
    3: On mobile devices: No header image showing (currently working but the logo is pixelated.

    May 31, 2016 at 5:11 pm #640981
    mmsdev

    SOLVED MANY THANKS THOUGH

    June 1, 2016 at 8:01 am #641282
    Rikard

    Hi,

    Great, glad you got it working :-)

    Thanks,
    Rikard

  • Author
    Posts
Viewing 9 posts - 1 through 9 (of 9 total)
  • You must be logged in to reply to this topic.