Webmastersite.net
Register Log In

Mobile Version - How to

Comments on Mobile Version - How to

Jenny
Forum Regular

Usergroup: Customer
Joined: May 11, 2003

Total Topics: 64
Total Comments: 199
Jenny
Posted Mar 03, 2011 - 8:52 AM:

Hi everyone,

I am planning on adding a mobile version along with the next update of my link directory.

My first thought was to just add a second, more minimalistic stylesheet that is used instead of the regular one as soon as someone visits the site with a mobile device and offering a "view full site" link to let them switch back.
But after reading tons of articles on this topic one may come to the conclusion that this option is counter-productive since all the content (including images) that is being hidden for mobile visitors is being downloaded nonetheless, so what's the point.

The second possibility I found was to setup a "2nd" page under a subdomain. But how do you pull that off with WSN Links with just one install of the script?

Or do you have other suggestions and opinions? I'd love to hear them.

Thanks.

- Jenny
Paul
developer

Usergroup: Administrator
Joined: Dec 20, 2001
Location: Diamond Springs, California

Total Topics: 61
Total Comments: 7868
Paul
Posted Mar 06, 2011 - 5:16 AM:

Well it won't download the images that aren't in the new stylesheet, only the ones in the templates. You could do it as an additional template set, in the mobile template set you can remove the extraneous images.

Automatically selected that template set for mobile visitors is another issue though. I thought there was a mechanism already to change template set based on user agent, but it appears not. I may get around to it eventually or I could do that now for $30.
Jenny
Forum Regular

Usergroup: Customer
Joined: May 11, 2003

Total Topics: 64
Total Comments: 199
Jenny
Posted Mar 06, 2011 - 6:29 AM:

I've actually just managed to do it. I have a completely image-free layout, the only graphics are thumbshots being pulled in from ShrinkTheWeb. I'm using the default style sheet and then with the following code I add another stylesheet for small devices which will overwrite some of the default settings:

<link rel="stylesheet" href="{DIRURL}/templates/styles/mobile.css" media="handheld, only screen and (max-device-width:480px)"/>


I only tested in on my iPhone so far and I will do some more tweaking, but for my very first try I'm quite happy with it.

BTW: I think you should update the screenshot of my site in your showcase. It must be a couple of years old wink And I've created a design for http://fan-sites.org/hosted-sites/, which is using WSN Links as well. I think it makes for a quite nice example as well.
Search thread for
Download thread as
  • 0/5
  • 1
  • 2
  • 3
  • 4
  • 5



Sorry, you don't have permission to post posts. Log in, or register if you haven't yet.