IWP & Mobiles

[jaboda]

Hi,

I have a FileMaker database which is used via FMPro and IWP.

I want to create some mobile-optimised layouts for users accessing the site on a mobile phone via IWP.

http://detectmobilebrowser.com has some JS which I could put into the login page to detect a mobile, but there's no way to pass this to IWP.

Does anyone have any ideas?

FileMaker Go is not suitable in this situation.

Thanks in advance

[jaboda]

I've found some more information out about this.

I haven't tried it yet but it should be possible to go to a layout on startup which has two buttons - one for desktop and another for mobile. JavaScript running in a Web Viewer would then 'click' the appropriate button (using this code). Info on how to do that can be found on this post.

Unfortunately this isn't enough as most mobile browsers will still assume it's a desktop site and 800-900 pixels wide, even if the layout is only 320 pixels wide.

There is a 'viewport' meta tag which is used by mobile browsers, and is missing from IWP created pages.

An introduction to this meta tag can be found at android.com and apple.com.

A good viewport to start with is <meta name="viewport" content="width=device-width">.

It is possible to add it by putting the following line at the end of fmi_iwp.js (contained in the IWP package):

document.write ('<meta name="viewport" content="width=device-width">');

It's also worth testing iwp_home.html and iwp_auth.html and probably adding the viewport meta tag to those too.

Let me know what you think, and if this is a practical solution.

[aparrish]

I tried the solution and it worked. Well done and thank you! 

[JDW]

...it should be possible to go to a layout on startup which has two buttons - one for desktop and another for mobile. JavaScript running in a Web Viewer would then 'click' the appropriate button (using this code). Info on how to do that can be found on this post.

Unfortunately this isn't enough as most mobile browsers will still assume it's a desktop site and 800-900 pixels wide, even if the layout is only 320 pixels wide.There is a 'viewport' meta tag which is used by mobile browsers, and is missing from IWP created pages. An introduction to this meta tag can be found at android.com and apple.com.

A good viewport to start with is <meta name="viewport" content="width=device-width">.

It is possible to add it by putting the following line at the end of fmi_iwp.js (contained in the IWP package):

document.write ('<meta name="viewport" content="width=device-width">');

It's also worth testing iwp_home.html and iwp_auth.html and probably adding the viewport meta tag to those too.

All the links given in the above post are dead (they merely link back to this thread).  Can the original poster please resurrect them for us?

I also don't understand the use of a Web Viewer (the feature you add to a database from within FMP), seeing a Web Viewer merely is a porthole to the web from within your database.  For example, you could display a Google Map through it, conduct a Google Search, access Wikipedia, etc.  But that has to do with viewing WEB CONTENT from WITHIN your database.  I don't see how it fixes problems with your database.

The problem I am having is regarding how tiny my FMP IWP database content looks in Mobile Safari on iOS8.x devices.  (My FMP11 database is hosted on a shared server.)  Database content displays very tiny in Portrait view on an iPhone but horrifically and unusably small in Landscape view.  I guessed that the addition of a ViewPort might solve the problem, but I don't know how to achieve that even after reading this thread.  And again, I don't understand how you gentlemen are solving FMP IWP database in-browser display problems with the "Web Viewer" feature.  Any detailed information you can provide would be greatly appreciated.

Thank you.

Edited June 17, 2015 by James Wages