• Resolved mattwelch

    (@mattwelch)


    I have gotten the basics of a mobile theme up and running, and have used a browser-detector plugin to successfully switch to that theme when my site is hit by a mobile browser. I’ve gotten blog posts looking really nice, and have the home page looking solid as well.

    The problem is individual pages. If a mobile user comes to a page on my site, “/products”, for instance, they get the full, desktop version of that page. This is no surprise, as the page.php of my mobile theme renders exactly that.

    What I’d like is for the user to see a completely different, designed-for-mobile version of that page. I’m not interesting in massaging the desktop-oriented page to make it fit. I want a mobile-specific page.

    Any thoughts on how I can seamlessly (and without redirecting, if possible) present different pages to mobile and desktop browsers, with the same page url?

    Thanks.
    Matt

Viewing 9 replies - 1 through 9 (of 9 total)
  • wouldn’t your mobile theme just require a page.php made for mobile browsers?

    Thread Starter mattwelch

    (@mattwelch)

    My understanding, as a relative newcomer to WP, is that I have access to things like title, date, content, author, etc from a page. I could try and massage the desktop-oriented page using page.php in my mobile theme, but what I want to do is basically grab a whole DIFFERENT page (or at least content), and show that. There’s just no way I can make a desktop-oriented page look as good as I’d like on a mobile browser.

    Hmm… I’m not sure I fully understand. Grabbing different content would be difficult for sure….

    I have a whole separate theme with the basics like
    header.php
    index.php
    page.php
    single.php
    footer.php

    using standard WP template tags, etc….

    All packaged up, designed for a mobile device. I could activate it like a normal theme, and it works…. looks darn silly on a desktop though.

    But I use a switcher plugin like you talk about to call that theme for mobile devices. So its a separate inactive theme in my theme directory only called for mobiles

    Is that how yours is set up?

    I used to redirect to a mobile subdomain using a plugin, and had a website setup, just calling in portions of WP with includes, etc…but that got unwieldy and silly

    EDIT…. I obviously also have a style.css stylesheet in there, oops

    The good Reverend has a point.

    Another approach is to use a mobile stylesheet for your page template, if you’re handy at CSS. After coding your CSS, you would add this type of thing to your Page Template (or possibly Header template, depending on your theme):

    <link rel="stylesheet" href="http://mattwelch.com/mobile.css" type="text/css" media="handheld" />

    Non-mobile browsers will ignore it (note “handheld” in there), so this would be pretty clean.

    Cheers, Dave

    Thread Starter mattwelch

    (@mattwelch)

    Reverend, my setup is exactly as yours. The problem is that I basically want different content for the pages in a mobile browser than one would get in a desktop browser.

    Dave, CSS would be a good alternative, if a) I were proficient at it, b) I didn’t want almost completely different content than I have now.

    I have a product page that is quite detailed and full of screenshots, etc. I can’t imagine ANY CSS that would get that down to where I need it (including removing and resizing photos, culling and rearranging text, and other such things). That’s why I’d like to basically create a whole different “page” and have that show up when a mobile user goes to the “master” page’s url.

    Thanks for all the input.

    Ah, now I see what you are after. Didn’t grasp the concept. I’ll have to bow out on this one…..

    My products page only uses one image per product. So I use a product custom post type. One post per product. One image per product, so I use the featured image for it

    Then my products page is a page template displaying the products in grid view. For my mobile sheet I display them in list view and am able to call different sized featured images.

    But I’m honestly not sure what to do for your situation…. I’m pretty new to doing mobile stuff at all……

    Oh, yeah, I didn’t get that at all, either. I have no idea how to do that, although I can in MODx. 🙂 I’ll bow out of that – I avoid ecommerce with WP.

    Good luck.

    Thread Starter mattwelch

    (@mattwelch)

    Came up with a way to do this. I installed mobble and exec_php. With exec_php, I can run php on my pages. So I can use php’s if/endif to define sections for mobile and desktop. And I use mobble to find out whether the browser is a mobile or desktop browser. Works pretty well.

    Matt –

    Can you post an example of your code that you are using to hide the different parts? Maybe post your if else code or elaborate a bit more on the process that you are using?

    Would really appreciate it.

    Thanks.

Viewing 9 replies - 1 through 9 (of 9 total)
  • The topic ‘Presenting different pages to mobile users’ is closed to new replies.