Community Forums › Forums › Archived Forums › General Discussion › Genesis default logo displays on mobile devices
- This topic has 7 replies, 3 voices, and was last updated 10 years, 2 months ago by amplifiedsteve.
-
AuthorPosts
-
September 19, 2013 at 3:10 am #63344shellshockMember
Hi
I have been working with the Genesis Sample responsive theme to create my own theme.
Problem is the logo defaults on mobile devices to a Genesis Framework logo and isnt showing the one the I placed and that shows ok on the desktop version.
Anyone else have this issue or know how to bug fix?
Thanks
ShelliSeptember 19, 2013 at 8:12 am #63364RobinMemberLook in your style.css for this block at the beginning of the media queries:
@media only screen and (-webkit-min-device-pixel-ratio: 1.5), only screen and (-moz-min-device-pixel-ratio: 1.5), only screen and (-o-min-device-pixel-ratio: 3/2), only screen and (min-device-pixel-ratio: 1.5) { .header-image .site-header .wrap { background: url(images/[email protected]) no-repeat left; background-size: 320px 164px; } }
Either replace that logo file with a larger version of your logo and adjust the size accordingly, or remove that section and it will use the regular logo. It may look funky on retina devices. HTH
I do the best I can with what I’ve got. (say hey on twitter)
September 19, 2013 at 10:16 am #63379shellshockMemberHi Robin - you are a star thanks for that - worked a treat : )
having problems with the homepage footer on mobile too - the content (a
- list) is not displaying properly but only on the home page - internal pages are fine - have you any clues on what that might be?
September 19, 2013 at 10:26 am #63382RobinMemberGlad that helped with the logo!
Without seeing it, I can't make a good guess. But look for .home selectors in your stylesheet--assume you are using Chrome's developer tools or Firebug? Check the footer list on both pages and see what different classes are being applied. Good luck!
I do the best I can with what I’ve got. (say hey on twitter)
September 19, 2013 at 10:34 am #63384shellshockMemberHi Robin
This is my test site:
http://www.shellshockstudio.co.uk/if you can see the home page on a mobile (I only have apple) you can see that some of the widgets are not rendering well - I think it is the classes on the home top widget that is throwing the footers below out - trying to wrangle and fix but any input would be greatly received as I am a real code newbie : )
September 19, 2013 at 10:46 am #63387RobinMemberI think if you go into your media query, maybe at the 767 level, and add this:
.home-top .widget, .home-middle .widget { width: 100%; }
That should start to sort you out. From what I see on my phone and computer the issues are in those two areas, not the footer-widgets.
There are probably better ways to do it, but I normally sort out mobile issues by making the browser on my computer super skinny and using the develop tools there, then applying the fix and rechecking the mobile on an actual device. I know Apple has some way of using developer tools on the phone but I haven't needed them yet.
I do the best I can with what I’ve got. (say hey on twitter)
September 20, 2013 at 5:01 am #63502shellshockMemberthanks for your help Robin - seems to be a problem with the margins - but I am slowly getting there : )
February 20, 2014 at 9:49 am #91401amplifiedsteveMemberChiming in here to say, thanks. I was having the same issue on mobile / logo but this worked a treat.
Would make sense if this would have automatically, so we dont have to touch the CSS. If you set the header / logo image in the CMS, it should reflect on all devices. Just my 2 cents 🙂
Thanks
Steve Mullen – owner Brite Social – find me on Twitter and G+
Digital marketing consultant, WordPress builder with focus on leisure, destination and entertainment. -
AuthorPosts
- The forum ‘General Discussion’ is closed to new topics and replies.