Question

我正在开发一个WordPress主题，它使用自定义Walker类来生成主导航菜单。主菜单有很多照片，你可以像UberMenu一样想到它。

我显然不想在移动设备上加载所有这些图片，而只是想要一个基本的文本菜单。

我想根据UA和/或用户屏幕大小加载正确的菜单。在将所有图像加载到浏览器之前，是否可以有条件地加载我想要使用的菜单（使用javascript？）。我不想加载这两个菜单然后根据屏幕大小隐藏一个菜单，因为浏览器仍然需要在后台加载所有图像。

我在考虑将wp_nav_menu()函数放在一个单独的PHP文件中，然后根据屏幕大小加载该PHP，但我不确定这是否安全和/或有效或者是正确的方法做这个。如果它有帮助我正在使用Modernizr。

赞赏任何想法

Answer 1

我认为检测用户代理并确定要服务的内容最好在服务器端完成，但这是一个充满争议的争论，并且在任何一方都有优势。

要使用PHP，使用mobile detect library的代码可以完成工作：

<?php
require_once 'Mobile_Detect.php';
$detect = new Mobile_Detect;
if ( $detect->isMobile() || $detect->isTablet() ) {
    // mobile code
} else {
    // desktop code
}
?>

要使用前端代码执行此操作，您可以使用full responsive，涉及CSS和媒体查询，或将其用于简单的条件逻辑：

if ( Modernizr.touch ) {
    // mobile code
} else {
    // desktop code
}

基于UA条件加载动态PHP内容

1 个答案: