Community Forums › Forums › Archived Forums › Design Tips and Tricks › Site looks different on different resolutions
Tagged: mobile, Prose, screen resolution
- This topic has 11 replies, 2 voices, and was last updated 10 years, 10 months ago by clarkscondensed.
-
AuthorPosts
-
June 15, 2013 at 8:04 am #46074clarkscondensedMember
So I just got finished designing my site and realized it looks totally different depending on what device I am using. On my laptop it looks fine, but on our desktop everything is spread out and then on smaller screens, most of the material is cut off. Is there anyway to remedy this? It looks especially bad when I look at it on my phone - can it at least be made mobile friendly? I am using Prose.
http://www.clarkscondensed.comJune 15, 2013 at 8:07 am #46075Brad DaltonParticipantI think you'll find when Genesis 2.0 is released and you add support for HTML 5 to your child theme that it will look better on mobile devices.
I recently updated my site and it resizes very well on smaller screens
June 15, 2013 at 8:23 am #46082clarkscondensedMemberOh that is very good to hear, is there any anticipated release date? Until then, is there an optimal resolution I should design my blog for? How do I go about adding support for HTML 5 to my theme?
June 15, 2013 at 9:51 am #46099Brad DaltonParticipantShould be shortly after WordPress 3.6 is released which is running a month behind.
Here's a list of the best resources for Genesis 2.0 and HTML 5 http://www.studiopress.com/news/genesis-2-0-resources.htm
Once you update to Genesis 2.0, you can then add HTML 5 support to your child themes functions.php file which is simply one line of PHP code.
You will notice your site gets messed up after doing this so you will need to change the CSS selectors to the new HTML markup.
You can do that manually or using a tool which you'll find in that list of resources.
Any loop hooks you are using in your child theme will also need to be changed to the new hooks
June 15, 2013 at 9:55 am #46101clarkscondensedMemberGreat, thank you!
June 15, 2013 at 10:50 am #46107clarkscondensedMemberIs it possible that I somehow messed up Prose so it isn't mobile-y responsive anymore -- because I was under the impression that it was supposed to be, and that it would adjust to the screen size it was being viewed with. Or am I misunderstanding what it means for the theme to be responsive?
June 15, 2013 at 11:44 am #46123Brad DaltonParticipantLooks responsive to me except for the header.
I did notice you use different sized archive thumbnails and your content limit on archives like you blog page is not inline with the bottom of your featured image.
Takes time to get a site right.
June 15, 2013 at 11:46 am #46124clarkscondensedMemberYes, after I posted my last comment, I went and changed the content area and sidebar to percentages instead of pixels, and that seemed to fix the problem. I'm trying to use this tutorial http://designsbynickthegeek.com/plugins/genesis-responsive-header#comment-4253 to fix the header situation, so hopefully that will be resolved soon as well.
How would I fix that problem you mentioned? I'm not totally sure exactly what you mean.
June 15, 2013 at 11:50 am #46125Brad DaltonParticipantGo to Genesis > Theme Settings > Content Archives and change the content limit.
When you add featured images to each post, crop them first so they're all the same size.
I think you'll find your header will be responsive after updating to HTML 5
June 15, 2013 at 11:51 am #46126clarkscondensedMemberOkay cool. Thank you.
And how do you update to HTML 5 -- or is that what will happen with Genesis 2.0?
Thank you so much for all your help, there's definitely a learning curve with all of this!
June 15, 2013 at 12:34 pm #46134Brad DaltonParticipantJune 15, 2013 at 12:47 pm #46136clarkscondensedMemberOh I didn't even read that part of your response earlier. Would you recommend waiting for Genesis 2.0 to be officially released, or use the beta version?
-
AuthorPosts
- The forum ‘Design Tips and Tricks’ is closed to new topics and replies.