Title: Small screen template not working
Last modified: August 21, 2016

---

# Small screen template not working

 *  Resolved [fireaaway](https://wordpress.org/support/users/fireaaway/)
 * (@fireaaway)
 * [12 years, 6 months ago](https://wordpress.org/support/topic/small-screen-template-not-working/)
 * I’m having some issues with the small screen template – I can’t get it to work.
 * I’m using this in my index.php to call the tiles:
    <?php if ( function_exists(‘
   the_loop_wp_tiles’ ) ) the_wp_tiles(); ?>
 * My standard template looks like this:
 *  . . .
    . . .
 * My small screen template is currently set to:
 *  .
    . . . . .
 * I’ve tried changing the small_screen_width but nothing happens when I check on
   my phone or resize the browser window, it still shows the 6 tiles in 3 columns/
   2 rows. Am I doing something wrong?
 * Also – is it possible to use two different small screen templates depending on
   the device screen size? I.e if the device screen is <480px, a 1 column template
   would be great, but if the device is >600px a 2 column template would look better.
   Any way to do that?
 * [http://wordpress.org/plugins/wp-tiles/](http://wordpress.org/plugins/wp-tiles/)

Viewing 6 replies - 1 through 6 (of 6 total)

 *  Plugin Author [Mike Martel](https://wordpress.org/support/users/mike_cowobo/)
 * (@mike_cowobo)
 * [12 years, 5 months ago](https://wordpress.org/support/topic/small-screen-template-not-working/#post-4310619)
 * Hi there! Can you add a link to your website so I can see what is going on? One
   thing to keep in mind is that the template size is chosen based on container 
   width, not on device size. Ie. if your content container is 400px wide, but your
   screen 1600px, you will still get the small screen template. The container is
   the first element above WP Tiles with position relative or absolute.
 * Cheers,
    Mike
 *  Thread Starter [fireaaway](https://wordpress.org/support/users/fireaaway/)
 * (@fireaaway)
 * [12 years, 5 months ago](https://wordpress.org/support/topic/small-screen-template-not-working/#post-4310622)
 * Sure, here’s the website (WIP)
 * [http://66.7.200.105/~linavebe/wordpress/](http://66.7.200.105/~linavebe/wordpress/)
 *  Thread Starter [fireaaway](https://wordpress.org/support/users/fireaaway/)
 * (@fireaaway)
 * [12 years, 5 months ago](https://wordpress.org/support/topic/small-screen-template-not-working/#post-4310623)
 * I got it to work after changing my meta tag from <meta name=”viewport” content
   =”width=device-width, initial-scale=1″> to <meta name=”viewport” content=”width
   =device-width”>. Not sure if that was the problem, but it’s working for now. 
   🙂
 *  Thread Starter [fireaaway](https://wordpress.org/support/users/fireaaway/)
 * (@fireaaway)
 * [12 years, 5 months ago](https://wordpress.org/support/topic/small-screen-template-not-working/#post-4310624)
 * Still not acting quite the way I want it on a mobile device though. It seems 
   to be stuck at a two column-template no matter what the screen size is. Might
   me my code that’s messy somehow though.
 *  Plugin Author [Mike Martel](https://wordpress.org/support/users/mike_cowobo/)
 * (@mike_cowobo)
 * [12 years, 5 months ago](https://wordpress.org/support/topic/small-screen-template-not-working/#post-4310629)
 * Hi! First of all: your site looks very nice! Love the way the tiles sit in the
   page.
 * Then, looking at current version: the small screen width seems to be set to 0–
   ie. disabled. So it will never change to the small screen template. Set the small
   screen width to your breakpoint size.
 * Secondly, the container that the tiles sit in has a fixed width.
    This is an 
   example of what happens in the css:
 *     ```
       @media only screen and (max-width: 720px) and (min-width: 300px) {
           #content-wrap {
               width: 700px;
           }
       }
       ```
   
 * So, whenever the screen (or window) is narrower than 721px, but wider than 299px,
   the width of the content wrapper is set to 700px. This is wider than the window
   itself in most cases. Try using a max-width for this sort of stuff instead: then,
   the container tries to fill its parent container (probably the window) as much
   as it can, until it hits the maximum width. Result: the container will scale 
   with the window, and at the appropriate time, the small screen template will 
   be used.
 * Good luck!
    Mike
 *  Thread Starter [fireaaway](https://wordpress.org/support/users/fireaaway/)
 * (@fireaaway)
 * [12 years, 5 months ago](https://wordpress.org/support/topic/small-screen-template-not-working/#post-4310630)
 * Thanks! 🙂
 * I had the small template width set to a bunch of different values to try it out
   and see what changed, but then disabled it when I was trying out something else.
   I did get it to work, sort of, just not in the way I wanted it. I realize it’s
   a fixed width issue and I’ll keep playing around with it until it works – thanks
   for your response and your great plugin!

Viewing 6 replies - 1 through 6 (of 6 total)

The topic ‘Small screen template not working’ is closed to new replies.

 * ![](https://s.w.org/plugins/geopattern-icon/wp-tiles_8f8e84.svg)
 * [WP Tiles](https://wordpress.org/plugins/wp-tiles/)
 * [Frequently Asked Questions](https://wordpress.org/plugins/wp-tiles/#faq)
 * [Support Threads](https://wordpress.org/support/plugin/wp-tiles/)
 * [Active Topics](https://wordpress.org/support/plugin/wp-tiles/active/)
 * [Unresolved Topics](https://wordpress.org/support/plugin/wp-tiles/unresolved/)
 * [Reviews](https://wordpress.org/support/plugin/wp-tiles/reviews/)

 * 6 replies
 * 2 participants
 * Last reply from: [fireaaway](https://wordpress.org/support/users/fireaaway/)
 * Last activity: [12 years, 5 months ago](https://wordpress.org/support/topic/small-screen-template-not-working/#post-4310630)
 * Status: resolved