Welcome to Omgili,
Omgili ( Oh My God I Love It ;) is a search engine for discussions. With Omgili you can find answers and solutions, debates, discussions, personal experiences, opinions and more... To learn more about Omgili click here.
This is a complete preview of the discussion as it was indexed by Omgili crawlers. Use this preview if the original discussion is unavailable.
Click here to view the original discussion.
 |
|
 |
|
phpBB • View topic - Making phpBB3 Mobile Compatible
I've been working on a way of making phpBB3 completely mobile compatible, regardless of the template or theme.
Because the developers were ingenious enough to implement proper CSS formatting, this is fairly simple.
My approach will be to use style.php (which is the #1 resource hog on the server, by the way - it'd be nice if you guys fixed this before 3.0) to determine if the HTTP_HEADER matches a mobile client - and if it does, do not return any stylesheet.
This function will detect most of the possible signs of a mobile client - and will return true (is a mobile) or false (not a mobile) based on this logic.
You can wrap your style.php in a conditional statement based on the result of this function to make your phpBB3 board compatible with mobile devices.
Code: Select all function detect_mobile_device(){
// check if the user agent value claims to be windows but not windows mobile
if(stristr($_SERVER['HTTP_USER_AGENT'],'windows')&&!stristr($_SERVER['HTTP_USER_AGENT'],'windows ce')){
return false;
}
// check if the user agent gives away any tell tale signs it's a mobile browser
if(eregi('up.browser|up.link|windows ce|iemobile|mini|mmp|symbian|midp|wap|phone|pocket|mobile|pda|psp',$_SERVER['HTTP_USER_AGENT'])){
return true;
}
// check the http accept header to see if wap.wml or wap.xhtml support is claimed
if(stristr($_SERVER['HTTP_ACCEPT'],'text/vnd.wap.wml')||stristr($_SERVER['HTTP_ACCEPT'],'application/vnd.wap.xhtml+xml')){
return true;
}
// check if there are any tell tales signs it's a mobile device from the _server headers
if(isset($_SERVER['HTTP_X_WAP_PROFILE'])||isset($_SERVER['HTTP_PROFILE'])||isset($_SERVER['X-OperaMini-Features'])||isset($_SERVER['UA-pixels'])){
return true;
}
// build an array with the first four characters from the most common mobile user agents
$a = array('acs-','alav','alca','amoi','audi','aste','avan','benq','bird','blac','blaz','brew','cell','cldc','cmd-','dang','doco','eric','hipt','inno','ipaq','java','jigs','kddi','keji','leno','lg-c','lg-d','lg-g','lge-','maui','maxo','midp','mits','mmef','mobi','mot-','moto','mwbp','nec-','newt','noki','opwv','palm','pana','pant','pdxg','phil','play','pluc','port','prox','qtek','qwap','sage','sams','sany','sch-','sec-','send','seri','sgh-','shar','sie-','siem','smal','smar','sony','sph-','symb','t-mo','teli','tim-','tosh','tsm-','upg1','upsi','vk-v','voda','w3c ','wap-','wapa','wapi','wapp','wapr','webc','winw','winw','xda','xda-');
// check if the first four characters of the current user agent are set as a key in the array
if(isset($a[substr($_SERVER['HTTP_USER_AGENT'],0,4)])){
return true;
}
}
This is obviously not the GREATEST solution, and special devices (like the every failing Apple iPhone) will likely require a special theme.
Rather than using the CSS to style a beautiful page on a really tiny screen, we're going to let the mobile handle it as raw content.
Images and embedded objects will still display.
Let me know what you think!
|
|
 |
|
 |
|
|
|
|
Nice code, how about a link back to the original author's page though
http://www.andymoore.info/php-to-detect-mobile-phones/
That code is free to use on non-commercial sites with a commercial site license costing only £10 per site or £50 for a server-wide license.
|
|
|
|
|
|
|
|
|
This is just one solution, you can utilize any number of mobile-detecting functions.
Just need to wrap the appropriate code up in style.php.
What has everyone else used to make their forums compatible with mobile devices?
|
|
|
|
|
|
|
|
|
One solution we have started implementing is as simple as making a separate template without all the bells and whistles to serve as our mobile phone users.
|
|
|
|
|
|
|
|
|
I use a Windows Mobile Smartphone (an original Motorola Q) and there are a couple of big problems.
First, the block quotations appear all messed up.
There are large black left Quote: s overlaying the text in the quotation.
This basically makes any Quote: d text impossible to read.
Second, the Edit, Report and Quote: buttons aren't selectable in the Smartphone browser (I haven't tried on a Pocket PC browser with a touch screen).
This obviously means that I can't Quote: a post, edit one of mine or report somebody's post while mobile.
Are these problems native to phpBB3 or just evident here at phpBB.com?
Either way, can they be fixed?
On the plus side, it now appears that I can post from my device.
In phpBB2, you couldn't preview or post a comment;
Pressing the Preview or Submit buttons would just return you to the comment edit window.
Steve Silicon Valley Pocket PC
http://www.svpocketpc.com
|
|
|
|
|
|
|
|
|
Quote: : This is just one solution, you can utilize any number of mobile-detecting functions.
Just need to wrap the appropriate code up in style.php.
What has everyone else used to make their forums compatible with mobile devices?
What happens if you just use the built-in CSS Handheld media support to turn off styles?
Steve Silicon Valley Pocket PC
http://www.svpocketpc.com
|
|
|
|
|
|
|
|
|
Can anyone recommend alternative phpBB3 WAP mod?
I would appreciate your response.
REgards
Careersng Career Development for Nigerians ...A free knowledge Portal!
http://www.careersng.com/forum
|
|
|
|
|
|
|
|
|
You may want to check the MODs in Development Forum and MOD Database , but I'm pretty sure there aren't any.
If all else fails, try asking in MOD requests .
Knowledge Base § Documentation § Support Request Template
Customise Your phpBB Install § Report A Bug § Download phpBB
Looking for private support or custom PHP/phpBB-related work?
PM me for knowledgeable service at a very reasonable rate.
|
|
|
|
|
|
|
|
|
Quote: : What happens if you just use the built-in CSS Handheld media support to turn off styles?
Steve
This is what it looks like by default:
crunchlabz | wappalyzer firefox add-on
|
|
|
|
|
|
|
|
|
Sorry for the N00B question, what and where do I drop this file?
I reallly would like to have a wap for my forum.
Thank you in advance,
RickyG Visit BrewGuy!
Hosting startng @ 99 cents!
Ex-Wife for sale!
|
|
|
|
|
|
|
|
|
Quote: : What has everyone else used to make their forums compatible with mobile devices?
Here's what I use:
1.
I added the following PHP function: Code: Select all function GetDeviceInfo(){
global $dataBase, $deviceInfo;
// $agent = htmlentities( @$_SERVER[ 'HTTP_USER_AGENT' ], ENT_Quote: S );
// $agent = pg_escape_string( @$_SERVER[ 'HTTP_USER_AGENT' ] );
$agent = addslashes( @$_SERVER[ 'HTTP_USER_AGENT' ] );
$query = pg_Query( $dataBase,
"SELECT * FROM \"UserAgent\" WHERE '$agent' ~ pattern LIMIT 1" );
if ( pg_Num_Rows( $query ) >
0 ){
$deviceInfo = pg_Fetch_Array( $query );
$deviceInfo[ 'device_name' ] = ereg_replace( $deviceInfo[ 'pattern' ],
$deviceInfo[ 'device_text' ],
$agent );
}
if ( ereg( '[ ;]([0-9]{2,4})x([0-9]{2,4})([ ;x)]|$)', $agent, $resolutions ) >
0 ){
$deviceInfo[ 'horz_resolution' ] = $resolutions[ 1 ];
$deviceInfo[ 'vert_resolution' ] = $resolutions[ 2 ];
return TRUE;
}
return FALSE;
}
2.
I created a SQL table called "UserAgent", defined thusly: Code: Select all CREATE TABLE "UserAgent"(
pattern VARCHAR PRIMARY KEY,
is_handheld BOOLEAN,
horz_resolution INTEGER,
vert_resolution INTEGER,
device_text VARCHAR
);
3.
I imported the following lines into the "UserAgent" table: Code: Select all ^Blackberry([^ ]*).*$||||Blackberry \\1
^iPhone.*$|t|||Apple iPhone
^LGE?-([^ ]*).*$||||LG Electronics \\1
^MOT-([^ ]*).*$||||Motorola \\1
^Nokia([^ ]*).*$||||Nokia \\1
^SonyEricsson([^ ]*).*$||||Sony Ericsson \\1
^UPG1 UP/4.0 .* Blazer 1.0.*$|t|162|176|Palm/Samsung I500
^.*PalmSource/[^-]*-([^;]*).*$||||Palm \\1
^.*PalmSource;.* (Tungsten)?.*$||||Palm \\1
^.*Windows CE;.* PPC.*$||||Pocket PC
^.*Windows CE;.* Smartphone.*$||||Smartphone
^.*Linux armv5.* Maemo browser .* N770/SU-18$|t|800|480|Nokia 770 Web Tablet
Whereever in the PHP code I need to determine whether the browser is on a handheld device, I call the GetDeviceInfo function.
I also have the following lines in my standard "Base.css" file: Code: Select all .non-handheld {
display: inline;
}
.handheld-only {
display: none;
}
Then, a separate "handheld.css" file: Code: Select all .non-handheld {
display: none;
}
.handheld-only {
display: inline;
}
Then, in my HTML <head>
Block: Code: Select all <link rel='stylesheet' type='text/css' href='/css/Base.css' />
<link rel='stylesheet' media='handheld' type='text/css' href='/css/Handheld.css' />
This allows me to qualify HTML elements with ".non-handheld" or ".handheld-only" tags as appropriate.
The advantage of the above techniques are that you don't have to keep changing the PHP code when a new device comes out.
When a user of a new device complains (and provides the date/time of when he attempted to access the site), you just look in your apache web server logs for the "User Agent" value, and then add an entry to the "UserAgent" table above.
However, you do have to understand regular expressions in order to create entries in the "UserAgent" table data.
Oh, and the price is free.
Last edited by dkgibson on Wed Jan 23, 2008 7:35 pm, edited 4 times in total.
I don't answer private messages on topics of public interest, because it defeats the whole purpose of a message board.
|
|
|
|
|
|
|
|
|
Quote: : 1. I added the following PHP function: Code: Select all function GetDeviceInfo(){
global $dataBase, $deviceInfo;
$agent = @$_SERVER[ 'HTTP_USER_AGENT' ];
$query = pg_Query( $dataBase,
"SELECT * FROM \"UserAgent\" WHERE '$agent' ~ pattern LIMIT 1" );
if ( pg_Num_Rows( $query ) >
0 ){
$deviceInfo = pg_Fetch_Array( $query );
$deviceInfo[ 'device_name' ] = ereg_replace( $deviceInfo[ 'pattern' ],
$deviceInfo[ 'device_text' ],
$agent );
}
if ( ereg( '[ ;]([0-9]{2,4})x([0-9]{2,4})([ ;x)]|$)', $agent, $resolutions ) >
0 ){
$deviceInfo[ 'horz_resolution' ] = $resolutions[ 1 ];
$deviceInfo[ 'vert_resolution' ] = $resolutions[ 2 ];
return TRUE;
}
return FALSE;
}
I hope you realise that you are performing no input sanitising and have opened yourself to the possibility of SQL injection.
Chris Smith • Blog • XMO • Ohloh • Area51 • Wiki • No support via PM/IM
Available for hire , installations, upgrades, custom work, etc.
PM me for information.
|
|
|
|
|
|
|
|
|
Quote: : I hope you realise that you are performing no input sanitising and have opened yourself to the possibility of SQL injection.
No, I didn't, but I do now!
Thank you very much ;
I had thought that $_SERVER variables were sanitized, but a web search shows that this is a common misconception/problem.
I've corrected by original code above, in case someone doesn't read down this far, but apparently any of the following will work:
Code: Select all $agent = htmlentities( @$_SERVER[ 'HTTP_USER_AGENT' ], ENT_Quote: S );
$agent = addslashes( @$_SERVER[ 'HTTP_USER_AGENT' ] );
$agent = pg_escape_string( @$_SERVER[ 'HTTP_USER_AGENT' ] );
If there are better ways, I'd appreciate comment.
I don't answer private messages on topics of public interest, because it defeats the whole purpose of a message board.
|
|
|
|
|
|
|
|
|
Personally, I find that mysql_real_escape_string() works wonders, but is specific to mySQL.
|
|
|
|
|
|
|
|