Mobile Theme when Customized

Home › Forums › Automattic › On a Whim › Mobile Theme when Customized

Tagged: 

Viewing 7 posts - 1 through 7 (of 7 total)
  • Author
    Posts
  • March 25, 2014 at 3:33 pm #110739 Resolve

    Lori

    Hi again! :-)
    I have customized my header, which I really love, but it looks awful on the mobile theme. So I went back and re-did it, making sure to not check the box that says, “Include this css in the mobile theme,” but it is still including it. Any ideas?

    The blog I need help with is creatingbeautyinthekitchen.wordpress.com
    March 26, 2014 at 2:18 pm #148883

    Kathryn P.
    Happiness Engineer

    So I went back and re-did it, making sure to not check the box that says, “Include this css in the mobile theme,” but it is still including it.

    That box is only applicable when you’ve activated the special mobile theme under Appearance > Mobile. Since On a Whim is already responsive (mobile-ready) and you haven’t activated the mobile theme, the checkbox has no effect.

    To restrict CSS to certain screen sizes only, you need to place it within something called a media query.

    You can learn more about using media queries that target certain screen sizes here:

    http://css-tricks.com/snippets/css/media-queries-for-standard-devices/

    http://webdesignerwall.com/tutorials/responsive-design-with-css3-media-queries

    Media queries are a simple concept but powerful in practice, and can take some experimentation and testing to get right.

    You could try experimenting with putting your header changes within a media query that targets larger screens.

    Let me know how it goes!

    March 26, 2014 at 7:30 pm #148909

    Lori

    Thank you for helping me once again Kathryn! I will check those out when I have a chance!

    April 14, 2014 at 7:29 pm #150000

    Kathryn P.
    Happiness Engineer

    Just checking in to see if you’re good to go with this or do you need further help?

    April 16, 2014 at 4:10 pm #150145

    Lori

    Hi Kathryn! I haven’t had a chance to try to play around with it, so unfortunately the mobile on safari still doesn’t look good. Feel free to close this thread though. I remember where it is, so I can look back and check those two things out that you recommended.

    Thank you so much for all your help!!

    April 16, 2014 at 4:12 pm #150146

    Lori

    Ok, quick question. I just looked up that Media Queries one…..would I just add that css to my css on my theme?

    April 16, 2014 at 7:13 pm #150151

    Kathryn P.
    Happiness Engineer

    Thank you so much for all your help!!

    My pleasure!

    I just looked up that Media Queries one…..would I just add that css to my css on my theme?

    Yes, you’d add your media queries to your custom CSS, under Appearance > Customize > CSS.

    I’ll close this thread but feel free to start a new one if you need further help.

  • Author
    Posts
Viewing 7 posts - 1 through 7 (of 7 total)

The topic ‘Mobile Theme when Customized’ is closed to new replies.