switch to desktop version

[pollux51]

Hi everyone,

I've been busy building a blog site using the Foodie Pro theme.
I think the setup and layout of the responsive version looks great, but I was recently talking to two of my clients. One was complaining about being forced to view the responsive site on his phone when he just wanted to see the mini version of the desktop site. The other liked the fact that a responsive site made things more readable and clear than having to zoom in on the site though her smartphone.

My question is, does anybody know some code, or a plugin that can provide the mobile version with the option to switch to the desktop site?

Thanks!

[Badlywired]

This is interesting, as a similar issue came up on a Linked in WordPress group. The consensus was that clicking and zooming around a desktop site is only preferred by very few and probably isn't worth the effort.

As this is fairly rare requirement, I doubt that any one has specifically coded a solution as a plugin.

It should, in theory be possible with a little bit of coding.

The outline would be to set a session cookie to determine preference and then switch the viewport, genesis makes this fairly easy. The following isn't complete code to any extend but covers what I am thinking about. It probably would only take an hour or two to get a working solution.

//* Add custom Viewport meta tag for mobile browsers
add_action( 'genesis_meta', 'sp_viewport_meta_tag' );
function sp_viewport_meta_tag() {

   if    (desktop_required() ) {
        //  fixed viewport: note width must be set to your themes desktop width  thismight be 1024 or another number
         echo    '<meta name="viewport" content="width=924, maximum-scale=1">';
         } else {
        // responsive viewport
	echo '<meta name="viewport" content="width=device-width, initial-scale=1.0"/>';
}

function desktop_required() {
     // some code here to examine a cookie or option to return true if desktop layout is demanded
}

add_action( 'genesis_after_footer'  'do_some_link_stuff');
function  do_some_link_stuff() {
    // code to display mark up for a link that has logic that displays  depending on desktop_required())
    //  and is also hidden in css over  a width of say 480px
    echo '<div class='hide-on-desktop'>';
       if (desktop_required()) {
               //  link - show mobile format  - this link if clicked will have to do something like set a cookie or option
      } else {
              //  link - show desktop format - this link if clicked will have to do something like set a cookie or option
     }
    echo '</div>';

}

---

My techy blog WordPress and stuff badlywired.com

[Author]

Posts