Homepage › Community Forums › Adapt Theme Support › Mobile Responsive – Logo size and order of items
Tagged: mobile
Hi Wes,
Loving you theme! I noticed on my iphone that my logo is a bit big for the screen. Is there a way to fix this?
Also, I see that the menu appears above the slider. Is there a way to change the order to put the responsive slider before the menu, or even take out the main menu on the mobile version?
Thanks,
Laura
Take a look at this post for the logo – https://appfinite.com/topic/header-issue-in-mobile-view/#post-3186
For the menu customization, just create a separate thread (since this is a separate topic) and I can help you get it working.
I must be doing something wrong:
1) I tried adding to the css background-size: cover; (I put this in both the partial and full image header definitions)
2) I tried the plugin but it wouldn’t let me set the images
3) I tried to upload a smaller logo image 320 px width but can only upload the default 960 by 80 when going to the header image under appearance.
BTW, what is the correct way to upload the header image?
OK, I think I worked it out by changing the header image size to width: 320px;. That seems to work for the iphone.
Now I see that on some pages the logo isn’t showing up. Any advice? For example on my macair sarafi browser.
The header is linking to two different logo images. The one that shows up and is working fine links to this – http://www.dashinfashion.com/wp-content/uploads/2013/04/dashin-fashion-designer-kids-magazine-320-b.gif …while the pages that aren’t showing a logo links to this – http://www.dashinfashion.com/wp-content/uploads/2013/04/dashin-fashion-designer-kids-magazine.gif ….which doesn’t appear to be anything.
So you have two separate logos/links somehow. Do you remember where you added the other logo link? In your Genesis Theme Settings? Or Somewhere else?
This might have happened when I tried to use the plugin which didn’t seem to work. I erased the plugin and cleared the cache.
What is the correct way to uplaod a logo with genesis? It seems that in the header you have to upload a file that is 960 by 80. So what I did was upload an image this size. Is this the correct way?
Yes that is correct, but you can add a different size if you want. First figure out the size of the image you want to upload, then go into your functions.php file and change the header size to the exact size of your image, then upload it to WordPress (as you’ve already done).
Some users upload a smaller image in their css to show when viewed in mobile browsers. You would add something like – background-image: url(your-image-link) !important;
and
background-position: center;
….if you wanted to do that. If the logo you have works fine enough then you can just leave it as it is.
I can’t seem to even get my website back to the original where I see a logo on each page in safari. I erased the header logo again and uloaded the file again – http://www.dashinfashion.com/wp-content/uploads/2013/04/dashin-fashion-designer-kids-magazine-320-b.gif I see it in the source code but on the macair it doesn’t show up.
I think the problem is the result of the plugin. Any idea how to revert back to normal? What do you see on your side now?
Ok I check it out again, cleared the cache again. and it seems to work now.
thanks for your patience!
You’re Welcome!
BTW, you can add – “background-position: center;” to the #header in your responsive sections of the css and the logo will center on mobile devices…..You don’t have to do this, but I thought I’d post just in case.