General Community > WebsiteBaker Website Showcase

Mobile-Device Version of an existing Site

(1/1)

fischstäbchenbrenner:
fetic.com/m/
Erotic drawings


Ja - mein englisch ist unter Sau, also deutsch weiter:
Die "Weiche" ist mit Javascript auf der Startseite (www.fetic.com), das scheint recht gut zu funktionieren, obwohl es brachial ist.

Die Navigation sehr spartanisch und fingergerecht. Die Struktur ist im wesentlichen von der Desktop-Version übernommen, sonst hätte ich wirklich alles neu machen müssen.
Die Bilder sind relativ groß (und gestaucht), damit man auch gleich reinzoomen kann. Klar schlägt sich das auf die Ladezeit, aber: Die Zoombilder sind (dateigröße) nur doppelt so groß wie die kleinen, also nicht so schlimm.

Technisch: Im wesentlichen ist das immer die gleiche Seite, mit mod_rewrite wird ein parameter übergeben, dann die Inhalte aus Topics übernommen.
Die Menüseiten sind "normale" WB-Seiten, mit nur einem Include per Code-Modul.

Ich kann es (abgesehen von Emulatoren) nur auf Android 4 testen, da geht das recht gut.
Möglicherweise kann man auf iPhone nicht zoomen. (?)

nibz:
Nice menu :)...

Really handy for touch navigation.
Tested on iPhone, it is posible to zoom :)..
But zoom has a limit.. but that is no matter ..

Good job!

fischstäbchenbrenner:
Thank you very much for testing.
The zoom-limit seems to depend on the size of the pictures, they all are 960px high.

Sokhim Sim:
I found this code to link to mobile website detect so you can past this code to the top of index file. I work for me i have test it.  :-D


--- Code: ---<?php 
    
    // Stop this file being access directly
if(!defined('WB_URL')) {
    header('Location: ../index.php');
    exit(0);
}
 
$mobile_browser = '0';
 
if(preg_match('/(up.browser|up.link|mmp|symbian|smartphone|midp|wap|phone)/i', strtolower($_SERVER['HTTP_USER_AGENT']))) {
$mobile_browser++;
}
 
if((strpos(strtolower($_SERVER['HTTP_ACCEPT']),'application/vnd.wap.xhtml+xml')>0) or ((isset($_SERVER['HTTP_X_WAP_PROFILE']) or isset($_SERVER['HTTP_PROFILE'])))) {
$mobile_browser++;
} 
 
$mobile_ua = strtolower(substr($_SERVER['HTTP_USER_AGENT'],0,4));
$mobile_agents = array(
'w3c ','acs-','alav','alca','amoi','audi','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','oper','palm','pana','pant','phil','play','port','prox',
'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','wap-','wapa','wapi','wapp',
'wapr','webc','winw','winw','xda','xda-');
 
if(in_array($mobile_ua,$mobile_agents)) {
$mobile_browser++;
}
 
if (strpos(strtolower($_SERVER['ALL_HTTP']),'OperaMini')>0) {
$mobile_browser++;
}
 
if (strpos(strtolower($_SERVER['HTTP_USER_AGENT']),'windows')>0) {
$mobile_browser=0;
}
 
else {
if($mobile_browser>0) {
    header("Location:  http://www.fetic.com/m/"); 
    exit;
} 
} 
?>

--- End code ---

fischstäbchenbrenner:
The switcher is made with javascript on the startpage:


--- Code: ---<?php if(!$page_id) { ?>
<script type="text/javascript">// <![CDATA[  
var mobile = (/iphone|ipod|android|blackberry|mini|windows\sce|palm/i.test(navigator.userAgent.toLowerCase()));      
// ]]>
if( screen.width <= 600) { mobile=true; }
if (mobile) {  
        document.write('<a class="mobileheader" href="/m/">Change to handheld view</a>');
}  
</script>
<?php } ?>
--- End code ---

For a handheld there is a blue bar with the link to the reduced version.
On each page of the handheld-version there is a link to the desktop version.

People dont like it, if they are forced to use the handheld-version.

[gelöscht durch Administrator]

Navigation

[0] Message Index