WordPress.org

Support

Support » Themes and Templates » [Theme: Twenty Twelve] Removing fit-to-screen functionality

[Theme: Twenty Twelve] Removing fit-to-screen functionality

  • Hi there!

    My question is quite simple, I hope the answer is too. 🙂 I am using the Twenty Twelve theme on my WordPress installation, but when I visit my website on my phone, it automaticaly resizes the theme to fit it into the screen. I know how awesome this functionality is, but I would like to remove it. So, my question is basically: how do I remove this function from the Twenty Twelve theme, so that I can see the ‘normal’ version of the theme when I visit my website on my mobile device?

    Hope you guys can help me out with this.

    Cheers

Viewing 12 replies - 1 through 12 (of 12 total)
  • Hi svscherpenseel,

    I’m also trying to achieve this. Did you get anywhere with this?

    Thanks

    Hi Qasim,

    I have still no luck achieving this, unfortunately. I hope anyone can help us out.

    Moderator Andrew Nevins

    @anevins

    Forum moderator

    Don’t use Twenty Twelve if you don’t want a mobile-compliant theme.

    paulwpxp

    @paulwp

    Font hero

    It’s near impossible.

    TwentyTwelve does not only has a so called responsive layout, it’s also build on the mobile first principle, so if you want to change it to be a fixed width layout, it’s the same thing as rebuilding the CSS from the ground up.

    That amount of work is not worth doing, it’s far better to use a fixed width layout one like Twentyten.

    That’s too bad, since I already build a theme which is based on Twenty Twelve. I’ll take a look at the CSS and see what I can do. I’ll post the CSS file if I can figure it out.

    Thanks for the replies guys. 🙂

    @svscherpenseel agreed! At the very least it would be awesome to be able to temporarily disable it so that one can find a prettier solution. 🙂

    Please let us know if you find anything!

    Here is the solution:

    /* =Media queries
    -------------------------------------------------------------- */
    
    /* Minimum width of 600 pixels. */
    @media screen and (min-width: 50px) {

    Just change the minimum width to 50px. Only people viewing your website on their Tamagatchis will notice, 😉

    It triggers the jquery mobile functions with the @media screen inquiries. Interesting.

    This worked for me, take a look.

    I commented this out in the header file of my child theme and it magically worked:

    <!--meta name="viewport" content="width=device-width" /-->

    Keep in mind, I had developed the twentytwelve child theme with fixed widths so it all magically appears like the desktop site on tablets and phones now that I have commented that out.

    I put backticks on that code don’t know why it didn’t show up as code, sorry

    paulwpxp

    @paulwp

    Font hero

    Try this, not widely tested though.

    1. Copy over the whole block of this section from parent and put into child stylesheet just below @import line as usual.

      @media screen and (min-width: 600px) {
      	/* everything here as is */
      }

    2. Change (min-width: 600px) to (min-width: 300px)
    3. Inside it, change max-width to just width on .site

    @ SNOWKRASH

    Thank You So Much for your Help! It works! I been looking for this solution for almost 3 months now. Thank you and I found your answer.

    God Bless!

Viewing 12 replies - 1 through 12 (of 12 total)
  • The topic ‘[Theme: Twenty Twelve] Removing fit-to-screen functionality’ is closed to new replies.