WordPress判断PC端和移动端并显示不同内容

2022年12月17日18:00:27 发表评论

判断用户PC电脑端和手机移动端,不同客户端显示不同的内容是WordPress必不可少的功能,通过php通过http_user_agent即可判断用户的客户端,新手站长网分享PC电脑端和移动手机端显示不同内容的方法:

WordPress判断PC端和移动端并显示不同内容

一、在functions.php中加入如下代码

找到你的WordPress主题中的functions.php文件,在functions.php中插入以下代码:

  1. // 判断PC端  
  2. function is_pc() {  
  3.         $user_agent = $_SERVER['HTTP_USER_AGENT'];  
  4.         $mobile_browser = Array(  
  5.                 "mqqbrowser"//手机QQ浏览器  
  6.                 "opera mobi"//手机opera  
  7.                 "juc","iuc",//uc浏览器  
  8.                 "fennec","ios","applewebKit/420","applewebkit/525","applewebkit/532","ipad","iphone","ipaq","ipod",  
  9.                 "iemobile""windows ce",//windows phone  
  10.                 "240x320","480x640","acer","android","anywhereyougo.com","asus","audio","blackberry","blazer","coolpad" ,"dopod""etouch""hitachi","htc","huawei""jbrowser""lenovo","lg","lg-","lge-","lge""mobi","moto","nokia","phone","samsung","sony","symbian","tablet","tianyu","wap","xda","xde","zte"  
  11.         );  
  12.         $is_mobile = ture;  
  13.         foreach ($mobile_browser as $device) {  
  14.                 if (stristr($user_agent$device)) {  
  15.                         $is_mobile = false;  
  16.                         break;  
  17.                 }  
  18.         }  
  19.         return $is_mobile;  
  20. }  
  21.    
  22. // 判断手机端  
  23. function is_mobile() {  
  24.         $user_agent = $_SERVER['HTTP_USER_AGENT'];  
  25.         $mobile_browser = Array(  
  26.                 "mqqbrowser"//手机QQ浏览器  
  27.                 "opera mobi"//手机opera  
  28.                 "juc","iuc",//uc浏览器  
  29.                 "fennec","ios","applewebKit/420","applewebkit/525","applewebkit/532","ipad","iphone","ipaq","ipod",  
  30.                 "iemobile""windows ce",//windows phone  
  31.                 "240x320","480x640","acer","android","anywhereyougo.com","asus","audio","blackberry","blazer","coolpad" ,"dopod""etouch""hitachi","htc","huawei""jbrowser""lenovo","lg","lg-","lge-","lge""mobi","moto","nokia","phone","samsung","sony","symbian","tablet","tianyu","wap","xda","xde","zte"  
  32.         );  
  33.         $is_mobile = false;  
  34.         foreach ($mobile_browser as $device) {  
  35.                 if (stristr($user_agent$device)) {  
  36.                         $is_mobile = ture;  
  37.                         break;  
  38.                 }  
  39.         }  
  40.         return $is_mobile;  
  41. }  

二、WordPress模板中调用

在WP模板中调用,如index.php、footer.php、single.php等,调用方式:

1、在PC电脑端显示,移动端不显示

  1. <?php if (is_pc() ): ?>  
  2.     <div>  
  3.     <p>我在PC电脑端显示</p>  
  4.     </div>  
  5. <?php endif ;?>  

2、在移动端显示,PC端不显示

  1. <?php if (is_mobile() ): ?>  
  2.     <div>  
  3.     <p>我在移动端显示,不在PC端显示</p>  
  4.     </div>  
  5. <?php endif ;?>  

综上,第一步在主题下的functions.php文件中插入代码,然后再WordPress主题模板中调用即可。

写在最后:

该代码的主要解决的问题自动判断用户的客户端,然后站长根据不同的客户端来展示不同的内容。

使用is_pc()这段代码,该代码会自动判断访客客户端是否是PC,如果是PC则显示,不是PC则不显示;

使用is_mobile()这段代码,该代码会自动判断访客客户端是否是移动端,如果是移动端则显示,不是移动端则不显示;

Tips:

掘金网建议新手小白们不用太纠结有关技术层面的东西,这些技术自己如果实在无力拿下的话,完全可以付费来给你搞定的,掘金网目前就提供这样的付费技术支持服务《去付费》,花钱不多可以买个保障和安全,有需要的可以联系掘金网。

历史上的今天:

掘金网
  • 版权声明:本站原创文章,转载请保留出处和链接!
  • 本文链接:http://jjsoho.com/pcdydd/ 网赚有风险,投资需谨慎!