Use of a separate theme for lower than a certain screen width?

  • Not entirely sure that this is a “themes” issue per se, because it kind of is, and kind of isn’t.

    Currently, my site, The Schumin Web (https://www.schuminweb.com), is designed to fit a 1024px screen width with no horizontal scrollbars. I’m now redesigning, and the new design will be optimized for 1280px width with no horizontal scroll bars. For 1024px widths, there will be scroll bars.

    Because of how I present certain areas of the site, even if I used a “liquid” width on certain areas, it would still give a horizontal scroll bar. With my analytics showing that a quarter of my viewers use a 1024px width (i.e. the netbook crowd), it seems worthwhile to design for the smaller size as well.

    I’m a little bit wary about using CSS to make the site change based on width because the changes will impact where I put my advertising blocks. I don’t want to run afoul of Google AdSense’s program policies by either having too many ads loading per page or using CSS to hide ads that don’t fit the version that the CSS requires. What I want to do is build a separate theme optimized for people that view the site on a real computer with 1024px width. That will allow me to place Google ads as I need for this smaller width group and not run afoul of that program’s policies.

    I’ve found plugins that will run a different theme based on whether the user is on a real computer, a tablet, a cell phone, etc., but not based on screen resolution. Does anyone know of something I can put into a theme or otherwise set to divert these lower resolution users to a separate theme optimized for their width?

    Any help will be greatly appreciated.

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

  • You can always use @media queries in your stylesheet. This will query the screen resolution the user has and apply the style scripts within it.

    Check here or you may search more about to improve your site.

    Thread Starter SchuminWeb

    (@schuminweb)

    That’s exactly what I’m trying to avoid. Doing it with CSS alone I fear will cause me problems with AdSense because it involves different ad spots for different sizes. I want to be able to switch to a different theme entirely for lower resolution.

    I have found plugins that will use different themes based on screen width and on user agent, but not both of them together, and running the two plugins together causes the screen width one to override any of the user agent ones. So I feel I’m stuck. Is there something that I can put in my “screen” theme to tell it to go to a different theme if it detects that the resolution is less than a specified threshold? That’s more what I’m looking for.

Viewing 2 replies - 1 through 2 (of 2 total)
  • The topic ‘Use of a separate theme for lower than a certain screen width?’ is closed to new replies.