use desktop browser to test and view moodle mobile site

use desktop browser to test and view moodle mobile site

by Ben Reb -
Number of replies: 9

Greetings,

Moodle 2.5, Theme MyMobile

I apologize if this is answered elsewhere.

I want to test the mobile version of my moodle site on my desktop browser (FF, Chrome, etc...). I tried adding .../mymobile_settings=true to the end of my site's URL (as seen on my smartphone), but this doesn't work.

How can I view/test the MyMobile version of my site in my desktop browser?

Thanks,

BR

Average of ratings: -
In reply to Ben Reb

Re: use desktop browser to test and view moodle mobile site

by Ian Simpson -

Hello,

One quick way is to re-size your browser to the approximate pixel dimensions of  of your phone. 

 

And here is the url of a set of mobile phone emulators which you might like to try.

Its always a good idea to ask friends to look at your site on their devices too.

Kind regards, and good luck!

Ian

In reply to Ian Simpson

Re: use desktop browser to test and view moodle mobile site

by Ben Reb -

Hi Ian,

Thanks for your answer, not quite what I was looking for. smile

I'm very familiar with mobile phone emulators (I use Opera's) and I can also view my site from my smartphone. BUT what I'm looking to do is use a browser's web dev tool...like FF's Firebug...you know hit F12 in a browser... and view/tweak the mobile moodle code.

So what I'm looking for is a way to open the mobile version of my site in the FF web browser....like when you type //m.yahoo.com in my desktop browser...you get the mobile version of Yahoo in your desktop and then one could view this mobile site with web dev tools.

So how do I access the mobile version of MyMobile moodle site with a desktop browser? Is there a specific URL I can use or can I trick the code to think it's in a mobile device?

Thanks,

B

 

In reply to Ben Reb

Re: use desktop browser to test and view moodle mobile site

by Willy Lee -

This depends on how you are delivering a mobile theme.

If you are in 2.5 and using bootstrap or a child theme of bootstrap, you should be able to resize your browser and get a similar look.

If you are using device detection, you need to tell your browser to pretend to be to be another browser. 

In Chrome, you can use the gear icon in the bottom right of the developer pane.

http://googlesystem.blogspot.com/2011/12/changing-user-agent-new-google-chrome.html

In Safari, it's in the Develop menu. If you haven't turned on the Develop menu, there is a checkbox in the advanced tab of the preferences pane.

In reply to Willy Lee

Re: use desktop browser to test and view moodle mobile site

by Ben Reb -

Awesome! Thanks so much Willy, I had forgotten about Chrome's UA Spoofer, I can definitely use that, though it would be nice to be able to use FF's dev pane since that's what I'm used to.

I would love to be able to make mobile appear just by resizing my browser. This is bootstrap? What do you mean by bootstrap? Is this an actual theme name, or is the MyMobile theme considered the bootstrap? In Themes > Theme selector, I don't see a bootstrap. smile

Here's what I'm using... What I have will not change based on resizing my browser. Where do I find this?

 

And it would be nice to know more about what you referred to re: device detection. So there's no way to 'force' my browser to use the mobile version by typing m.mysite.com?

 

Thanks,

 

B

In reply to Ben Reb

Re: use desktop browser to test and view moodle mobile site

by Willy Lee -

Bootstrap is a responsive design framework. So it uses CSS media queries to deliver flexible layouts to different devices and screen sizes.

Moodle 2.5's Clean theme is based on Bootstrap. (I misremembered this when writing the previous message.) So Clean should resize nicely based on what screen size it is presented with.

Device detection works by delivering different themes to different browsers based on their user agent string.

If you wanted to use a url to get to a different theme, you have to set this up in config.php and then pass it a query parameter in the URL. It's described at http://docs.moodle.org/22/en/Theme_settings#Session_themes

Average of ratings: Useful (1)
In reply to Willy Lee

Re: use desktop browser to test and view moodle mobile site

by Ben Reb -

Thanks Willy,

Great, I'll check out Clean theme!

Many Thanks!

 

In reply to Ben Reb

Re: use desktop browser to test and view moodle mobile site

by Sandya Rani -

your website gives the best and the most interesting information.