Avada Forums Community Forum multiple logos for different pages

Viewing 15 posts - 1 through 15 (of 16 total)
  • Author
    Posts
  • Hassan T.
    Keymaster
    Post count: 9

    This won’t be possible with the provided options of Avada and requires a custom solution. You can follow this tutorial on how to have a different logo for a specific page.

    Aragosta
    Participant
    Post count: 5

    Hello Hassan work fine!

    But but I saw that it does not manage the retina logo, what can I do?

    Thank you
    Marco

    Aragosta
    Participant
    Post count: 5

    Hassan i solved!

    Romero L.
    Participant
    Post count: 19

    Sensei @marklchaves, how would you solve this?

    I want to have a logo on my home page and another logo, on the other pages. Hopefully you know a nice trick….thanks as always!

    Hassan T.
    Keymaster
    Post count: 9

    This won’t be possible with the provided options of Avada and requires a custom solution. You can follow this tutorial on how to have a different logo for a specific page.

    marklchaves
    Participant
    Post count: 873

    Hello @paulstartups,

    Thanks again for the A2A! I replied yesterday. I think my post went into the moderation bit bucket. I reposted on GitHub.

    Thanks!

    Romero L.
    Participant
    Post count: 19

    I just saw it @marklchaves! It’s a really nice solution, thanks a lot for sharing it! and I’m glad more people will benefit from your answer 🙂

    PS: Too bad it went to the moderation bucket, that shouldn’t happen.

    Romero L.
    Participant
    Post count: 19

    Hi again @marklchaves!

    Thank you again for the complete explanation, if you wouldn’t have explained the processes to get the page ID I would have been stuck.

    I just apply it to my site and it works really nice on desktop! However, on my iphone the new logo looks blurry because of the retina display. Do you know a way to solve this since the retina size logo most be 2X the desktop size?

    Thanks again!!

    Romero L.
    Participant
    Post count: 19

    Hi @hassant! I didn’t get it the first time I saw it, but now I do. Thank you!

    marklchaves
    Participant
    Post count: 873

    Hello @paulstartups,

    Thanks for the Retina follow-up question. I updated my post with the CSS media queries for Retina on Avada.

    Please give that a try.

    Thanks! 🙂

    Romero L.
    Participant
    Post count: 19

    Hello @marklchaves hope you’re having a great day!

    Thank you for taking the time to help me with this 🙂

    I tried with the updated CSS code on your post, but for some reason, now is not showing any logo. My retina logo size is (height: 88px and width: 450px) so I updated the background-size to (44px 225px;).

    Do I need to change something else, may be something in the media queries?

    Thanks!

    marklchaves
    Participant
    Post count: 873

    Hi @paulstartups,

    You’re welcome.

    I should always caveat all custom CSS added to Avada may need the !important directive. You can always use your dev tools inspector to verify what to override.

    You might have to use !important in the code I provided especially for these three when you see them. Remember the pixel dimensions are from my examples.

    
        display: block !important;
        height: 65px !important;
        width: 65px !important;
    

    If these don’t work, I’d need to look at the code to make any meaningful diagnosis.

    Good luck!

    Romero L.
    Participant
    Post count: 19

    Hi @marklchaves!

    Thanks a lot! I added the !important directive to those 3, and it didn’t work at the beginning, it wasn’t showing any logo. I felt that the reason was related to the media queries, so I decided to hide them. When I did, it showed the logo distorted. Then I change back the background size to 100% and it showed properly, even in my retina phone 🙂 ….it seems that the media queries were not necessary. We only need to use your code with the retina logo (2X the size) and set the height and width to the wanted size (1X), and not forgetting to add the !important directive.

    Thanks again for helping me and for sharing your knowledge with the community!!

    marklchaves
    Participant
    Post count: 873

    Wonderful, @paulstartups! Exceptional CSS detective work on your end. 🙂

    I wonder if this is browser-specific. Which browser were you using for this issue?

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