在 WordPress 中根据访问设备使用不同的主题 - 文章教程

在 WordPress 中根据访问设备使用不同的主题

发布于 2019-07-20 字数 1666 浏览 1315 评论 0

现在的网页都使用了响应式布局,对于不同的设备,使用媒体查询自动适配设备,但是这对代码的编写较为复杂,有些甚至需要使用脚本来完成的功能,那么我们完全可以使用两个主题模版,来分别在移动端和 PC 端显示。

在 WordPress 中根据访问设备使用不同的主题

在WordPress我们也有相关的方法来实现这样的功能,请看下面的代码:

//根據訪問設備切換wordpress主題
function ws_switch_theme($theme){
    global $is_IE;
    if($is_IE){
        preg_match('/MSIE\s(\d)\.0;/', $_SERVER['HTTP_USER_AGENT'], $matches);
        $IEversion = $matches[1];
        if($IEversion=6){
            $theme='twentyten';
        }
        if($IEversion=7){
            $theme='twentyeleven';
        }
        if($IEversion=8){
            $theme='twentytwelve';
        }
    }
    if(wp_is_mobile()) {
        $theme='twentytwelve';
    }
    return $theme;
}
add_filter( 'template', 'ws_switch_theme' );
add_filter( 'stylesheet', 'ws_switch_theme' );

你可以根据上面的代码自行修改,在何种设备访问时加载什么主题。注意主题名字一定是主题文件夹名字,而不是后台管理界面你看到的主题名字。

主题这个代码也不能直接扔进 functions.php 文件中而是要做成一个插件上传启用。

在这里我用了wp_is_mobile()这个 WordPress自带函数来检测移动设备,不过这个很不准确,有很大可能不能正确判断移动设备。

不仅仅检测移动设备,而且检测桌面浏览器版本。而且你也可再发挥下,稍稍改下代码,就能实现让用户自行选择使用桌面网站还是移动网站并记住选择。

如果你对这篇文章有疑问,欢迎到本站 社区 发帖提问或使用手Q扫描下方二维码加群参与讨论,获取更多帮助。

扫码加入群聊

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

目前还没有任何评论,快来抢沙发吧!

关于作者

JSmiles

生命进入颠沛而奔忙的本质状态,并将以不断告别和相遇的陈旧方式继续下去。

2583 文章
29 评论
84935 人气
更多

推荐作者

Jay

文章 0 评论 0

guowei007

文章 0 评论 0

2668157715

文章 0 评论 0

HY阳

文章 0 评论 0

想挽留

文章 30 评论 3