Viewing 12 posts - 1 through 12 (of 12 total)
  • Author
    Posts
  • March 13, 2017 at 5:20 pm #760107
    Sander

    Hi There,

    I’ve found a similar topic to use a different logo for sticky header, but I can’t get it working. Could you help me with this?

    Regards, Sander

    March 13, 2017 at 6:24 pm #760173
    Guenni007

    i need more input.
    you have choosen the sticky header on Enfold Options Dialog – and now ?

    the sticky option is a globaly one – so how do you get pages with and some without sticky behavior?

    March 14, 2017 at 11:32 am #760597
    Sander

    As you can see on https://www.screencast.com/t/l1chj12cyO and http://apptomorrow.zoiezo.nl/ the pay-off beneath the logo for the sticky header is hardly readable. I would like to show the logo here without the pay-off.

    March 15, 2017 at 12:52 pm #761368
    Yigit

    Hi,

    Please add following code to Fuctions.php file in Appearance > Editor

    add_filter('avf_logo_subtext', 'kriesi_logo_addition');
function kriesi_logo_addition($sub) {
    $sub .= '<img src="https://kriesi.at/documentation/enfold/wp-content/uploads/sites/2/2015/11/logo_enfold_docs.png"/>';
    return $sub;
}

    and then add following code to Quick CSS in Enfold theme options under General Styling tab

    .header-scrolled .logo > a > img { display: none !important; }

    Please make sure that > sign is not converted to – http://i.imgur.com/IDXRZQ3.png in Quick CSS field.

    Best regards,
    Yigit

    March 15, 2017 at 2:16 pm #761421
    Sander

    Hi,

    I followed your instructions, but the logo for the sticky header is missing. See http://apptomorrow.zoiezo.nl/. I’ve added the wp login credentials to have a look if I did anything wrong.

    Thanks, Sander

    March 15, 2017 at 2:58 pm #761437
    Guenni007

    the code is good – but the second logo is missing.
    How did you insert the second logo ?

    i prefer this method via functions.php of child-theme

    function second_logo($logo) {
$logo .= '<strong class="logo second-logo"><a href="url2" target="_blank">' ;
$logo .= '<img src="url to you second logo" />';
$logo .= '</a></strong>';
return $logo;
}
add_filter('avf_logo_final_output', 'second_logo');

    afterwards you can set this second-logo to display: block with:

    .header-scrolled .second-logo > a > img { display: block !important; }

    • This reply was modified 7 years, 8 months ago by Guenni007.
    March 15, 2017 at 3:35 pm #761455
    Sander

    I have followed the instructions from Yigit so it should show the logo from Enfold.

    March 16, 2017 at 5:17 pm #762071
    Yigit

    Hi,

    You added the code i provided to style.css file instead of functions.php file. I moved it to functions.php file and added following code to Quick CSS

    .subtext img { opacity: 0; }
.header-scrolled .subtext img { opacity: 1; }

    Please review your website now

    Best regards,
    Yigit

    March 16, 2017 at 5:44 pm #762085
    Sander

    Hi Yigit,

    Thanks for your help and sorry for my clumpsy behaviour. However after this changes the logo for mobile has a lot of whitespace below the logo and doens’t align with the hamburger icon anymore. See https://www.screencast.com/t/TacZ3oJm

    Regards, Sander

    March 16, 2017 at 8:54 pm #762190
    John Torvik

    Hi,

    To align your logo, just add this custom CSS code at Enfold Theme Options > General Styling > Quick CSS

    

@media only screen and (max-width: 767px) {
  .responsive .logo img {
    top: 22px;
  }
}

    Let me know if it works :)

    Best regards,
    John Torvik

    March 17, 2017 at 4:29 pm #762572
    Sander

    Thanks, that works perfectly!!!

    March 19, 2017 at 9:31 am #763148
    Rikard

    Hi,

    Great, glad we could help. Please let us know if you should need any further help on the topic.

    Best regards,
    Rikard

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