如何更改基於操作系統的網頁內容

Question

我正在爲移動應用程序設計一個wordpress網站。 對於遊客，我想基於操作系統，如下面的頁面上顯示文本，圖像 -

https://www.sapphireone.com/accounting-software/accounts/
在這個頁面中，在「帳戶結構部分」存在改變爲基礎的操作系統，即在一個圖像mac和windows。

我想爲android和iPhone做類似的事情。我正在使用下面的代碼，但它不工作。對於function.php

function find_andoird() { 
$ua = $_SERVER[‘HTTPS_USER_AGENT’]; 

/* ==== Detect the OS ==== */ 

// Android 
    $android  = strpos($ua, 'Android') ? true : false; 

// iPhone 
    $iphone  = strpos($ua, 'iPhone') ? true : false; 

    return $android; 

} 

// 代碼

//代碼模板文件

if(find_andoird() == true) { 

<p><strong>Android View</strong></p> 
<p> 
<img src=「accounting-android.png」 style="float:left;width:400px;height:600px;"> 
The android view is displayed here. 
</p> 
} 

else { 

<p><strong>iPhone View</strong></p> 
<p> 
<img src=「accounting-iphone.png」 style="float:left;width:400px;height:600px;"> 
The iphone view is displayed here. 
</p> 
} 

} 

我能得到一些幫助，請。謝謝

Answer 1

此功能可能會有所幫助。

<?php 

$user_agent  = $_SERVER['HTTP_USER_AGENT']; 

function getOS() { 

    global $user_agent; 

    $os_platform = "Unknown OS Platform"; 

    $os_array  = array(
          '/windows nt 6.2/i'  => 'Windows 8', 
          '/windows nt 6.1/i'  => 'Windows 7', 
          '/windows nt 6.0/i'  => 'Windows Vista', 
          '/windows nt 5.2/i'  => 'Windows Server 2003/XP x64', 
          '/windows nt 5.1/i'  => 'Windows XP', 
          '/windows xp/i'   => 'Windows XP', 
          '/windows nt 5.0/i'  => 'Windows 2000', 
          '/windows me/i'   => 'Windows ME', 
          '/win98/i'    => 'Windows 98', 
          '/win95/i'    => 'Windows 95', 
          '/win16/i'    => 'Windows 3.11', 
          '/macintosh|mac os x/i' => 'Mac OS X', 
          '/mac_powerpc/i'  => 'Mac OS 9', 
          '/linux/i'    => 'Linux', 
          '/ubuntu/i'    => 'Ubuntu', 
          '/iphone/i'    => 'iPhone', 
          '/ipod/i'    => 'iPod', 
          '/ipad/i'    => 'iPad', 
          '/android/i'   => 'Android', 
          '/blackberry/i'   => 'BlackBerry', 
          '/webos/i'    => 'Mobile' 
         ); 

    foreach ($os_array as $regex => $value) { 

     if (preg_match($regex, $user_agent)) { 
      $os_platform = $value; 
     } 

    } 

    return $os_platform; 

} 

function getBrowser() { 

    global $user_agent; 

    $browser  = "Unknown Browser"; 

    $browser_array = array(
          '/msie/i'  => 'Internet Explorer', 
          '/firefox/i' => 'Firefox', 
          '/safari/i'  => 'Safari', 
          '/chrome/i'  => 'Chrome', 
          '/opera/i'  => 'Opera', 
          '/netscape/i' => 'Netscape', 
          '/maxthon/i' => 'Maxthon', 
          '/konqueror/i' => 'Konqueror', 
          '/mobile/i'  => 'Handheld Browser' 
         ); 

    foreach ($browser_array as $regex => $value) { 

     if (preg_match($regex, $user_agent)) { 
      $browser = $value; 
     } 

    } 

    return $browser; 

} 


$user_os  = getOS(); 
$user_browser = getBrowser(); 

$device_details = "<strong>Browser: </strong>".$user_browser."<br /><strong>Operating System: </strong>".$user_os.""; 

print_r($device_details); 

echo("<br /><br /><br />".$_SERVER['HTTP_USER_AGENT'].""); 

?> 

Answer 2

有一個Modernizr的擴展名爲detectizr（https://cdnjs.com/libraries/detectizr，你必須把Modernizr的第一個）。它將把你標記的操作系統，版本，瀏覽器，設備......然後你就可以使用CSS來顯示。例如：

/* Hide image with class-a by default */ 
img.class-a { 
    display: block; 
} 

/* showing it in windows 10 only */ 
.windows.windows10 img.class-a { 
    display: block; 
}