Viewing 23 posts - 1 through 23 (of 23 total)
  • Author
    Posts
  • May 26, 2020 at 4:15 pm #1216527
    bobfurgo

    Hi guys, opening up the thread again that i Posted here:
    when I minimize the browser to be the width of mobile it looks fine. However on actual mobile devices the logo doesn’t show. Would love some advice on this, thanks!!

    May 26, 2020 at 8:30 pm #1216670
    Nikko

    Hey bobfurgo,

    Can you try adding this CSS code in Quick CSS, located in Enfold > General Styling:

    @media only screen and (max-width:767px) {
  .responsive #top #wrap_all #header {
    background-color: transparent;
  }

  #top #wrap_all #main {
    margin-top: 0 !important;
  }
}
    

Best regards,
Nikko
    May 26, 2020 at 9:07 pm #1216685
    bobfurgo

    hi nikko, thanks. it didn’t quite work out, i want there to be a black logo and white header background like the rest of the pages. Left the code there so you can take a look at that page on mobile

    May 27, 2020 at 12:31 am #1216731
    Jordan Shannon

    Hi,

    Did you add the code to the very top of quick css so it runs first? Also, please clear the cache a few times over.

    Best regards,
    Jordan Shannon

    May 28, 2020 at 5:33 pm #1217454
    bobfurgo

    yes I did. Also i removed that code because it made the header on mobile devices look weird for all pages that have a transparent header. The black logo was also not visible.

    June 1, 2020 at 4:35 am #1218311
    Nikko

    Hi bobfurgo,

    Can you try this code instead? it should affect only transparent pages on mobile:

    @media only screen and (max-width:767px) {
  .responsive #top #wrap_all #header.av_header_transparency .logo a {
    background: none !important;
  }

  .responsive #top #wrap_all #header.av_header_transparency .logo img {
    opacity: 1;
    visibility: visible;
  }
}

    Best regards,
    Nikko

    June 1, 2020 at 3:24 pm #1218446
    bobfurgo

    Hi! I think that definitely helped, looks good on a desktop browser when i see mobile version but when i actually look at my mobile phone it doesn’t show the logo.

    June 1, 2020 at 8:44 pm #1218518
    Jordan Shannon

    Hi,

    Did you clear your mobile browser cache?

    Best regards,
    Jordan Shannon

    June 1, 2020 at 8:59 pm #1218521
    bobfurgo

    yes i did and viewed in an incognito. please look on your mobile phone, you should see the same thing as i do. thanks!

    June 3, 2020 at 3:33 pm #1219107
    bobfurgo

    following up. thanks!

    June 4, 2020 at 9:47 pm #1219566
    Jordan Shannon

    Hi,

    Apologies for the delay, viewing the site from my Galaxy Note 8 I am able to see the logo. Is this an issue on a specific mobile device and browser?

    Best regards,
    Jordan Shannon

    June 4, 2020 at 9:59 pm #1219574
    bobfurgo

    Hello. I’m using an iphone and the logo is not visible there…

    June 4, 2020 at 10:01 pm #1219575
    Jordan Shannon

    Hi,

    Okay I’ll reach out to other mods with an iPhone.

    Best regards,
    Jordan Shannon

    June 5, 2020 at 11:59 am #1219758
    Yigit

    Hi,

    Your logo did not show up on mobile due to av_change_logo function you have in functions.php file.
    Domain was wrong. I updated the domain and it worked. Please review your website :)

    Cheers!
    Yigit

    June 8, 2020 at 4:30 pm #1220514
    bobfurgo

    Thank you Yigit!! however it disappears on scroll! Can you help me with this too? Sorry, I tried and can’t seem to figure it out myself :(

    June 8, 2020 at 4:42 pm #1220517
    Yigit

    Hi,

    That was because of following code in style.css file of your child theme

    #top.page-id-349 .logo img {
    opacity: 0;
    visibility: hidden;
}

    Do you remember why you have added it? I commented it out for now and that helped. Please review your website :)

    Best regards,
    Yigit

    June 11, 2020 at 3:54 pm #1221735
    bobfurgo

    Hey yigit! Thank you! It looks good however, now on desktop/laptop it’s showing both the white and black logo. how can I remove the black logo on desktop (keep on mobile though). I tried using some css but it just hid both logos! Thanks in advance

    June 11, 2020 at 4:30 pm #1221760
    Yigit

    Hi,

    Please add following code to Quick CSS as well

    .responsive #top.page-id-349 .header-scrolled .logo a {
    background-image: none;
}

    Best regards,
    Yigit

    June 11, 2020 at 8:55 pm #1221888
    bobfurgo

    hi, it didn’t work unfortuntaely

    June 11, 2020 at 9:57 pm #1221902
    Yigit

    Hi,

    I checked your website again but it seems to be working. Please make sure to flush your browser cache and refresh your page a few times.

    Best regards,
    Yigit

    June 11, 2020 at 9:59 pm #1221903
    bobfurgo

    the last code snippet you gave me didn’t hide the black version of the logo on desktop/laptop screens is what i meant to say.

    June 12, 2020 at 1:29 pm #1222042
    bobfurgo

    was able to have a developer help me with this. please close thread, thanks

    June 12, 2020 at 1:49 pm #1222060
    Yigit

    Hi,

    Sorry, I realized I misunderstood the final issue but glad you figured it out! :)

    Let us know if you have any other questions or issues and enjoy your weekend!

    Best regards,
    Yigit

  • Author
    Posts
Viewing 23 posts - 1 through 23 (of 23 total)
  • The topic ‘logo on mobile’ is closed to new replies.