GaryFTParticipantFebruary 12, 2019 at 5:33 amPost count: 1
Is there somehow a way i can exchange the logo in the header for a new page?
Page A – Logo A
Page B – Logo B
and so onHassan T.KeymasterMarch 7, 2019 at 3:19 pmPost count: 9AragostaParticipantMarch 5, 2020 at 4:43 pmPost count: 5
Hello Hassan work fine!
But but I saw that it does not manage the retina logo, what can I do?
MarcoRomero L.ParticipantApril 17, 2020 at 9:52 pmPost count: 19Hassan T.KeymasterApril 18, 2020 at 6:54 amPost count: 9marklchavesParticipantApril 19, 2020 at 12:18 amPost count: 873Romero L.ParticipantApril 19, 2020 at 1:33 amPost count: 19Romero L.ParticipantApril 19, 2020 at 5:52 pmPost 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.ParticipantApril 19, 2020 at 5:56 pmPost count: 19marklchavesParticipantApril 19, 2020 at 11:22 pmPost count: 873Romero L.ParticipantApril 20, 2020 at 10:14 pmPost 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!marklchavesParticipantApril 22, 2020 at 1:07 amPost count: 873
I should always caveat all custom CSS added to Avada may need the
!importantdirective. You can always use your dev tools inspector to verify what to override.
You might have to use
!importantin 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.ParticipantApril 22, 2020 at 9:13 pmPost count: 19
Thanks a lot! I added the
!importantdirective 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!!
- You must be logged in to reply to this topic.