Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

PHP

Ryan Smee
Ryan Smee
3,392 Points

Best libraries or techniques for Responsive Web design using php

I am working with some people on a large PHP web application using Yii framework. Recently we have focused our attention to making the app more usable across different devices. I am very comfortable with css Media Queries and jquery etc and so focused my attention to all of these first.

Now that it is looking good across most devices my next challenge is to only serve up the necessary code needed on each page. As this is a huge app it has lots of functionality that cannot/willnot be used on mobile devices.

So I am looking for the best way to sniff out what size device it is and then serve the php accordingly. Any suggestions?

1 Answer

Ricky Catron
Ricky Catron
13,023 Points

What you could do is build several pages to be used as an API for JavaScript.

Example: If you wanted to load 10 pictures for desktop and 5 for mobile you would have 3 pages. One which the user will visit and 2 API pages one which displays 10 pictures and one with 5.

Then based on the screensize request one of the pages with JavaScript.

PHP is a server-side language and cannot (without some fancy hack) detect server size on its own.

Goodluck! --Ricky

Ryan Smee
Ryan Smee
3,392 Points

Cheers for the speedy response - I fear I may be going down the fancy hack root. As i say, we now have our pages looking the way we want and any site functionality either 100% works and is used on mobiles or isn't for mobile at all. For example we have video annotations that just won't work on ios because the videos play in full screen. Instead we just want to avoid serving this large widget to ios devices.

I have found this and it looks quite good: https://github.com/serbanghita/Mobile-Detect

Ricky Catron
Ricky Catron
13,023 Points

The build passes, it looks well maintained, I say go for it! I fear it could mess with page load time pretty bad but that is just a guess. I would check that out, if it isn't a problem or simply doesn't matter I say use it!

Goodluck! --Ricky

Ryan Smee
Ryan Smee
3,392 Points

Yeah I have the same worry, but only time will tell. I need to really have a proper look through to see how it works under the surface and maybe strip out anything that i don't need where possible. I am also toying with the idea of running it ones, then storing the result to the session. But i will have to see.

Cheers for your help!