Question

不是代码问题，我只是不知道在这种特定情况下事情是如何运作的。

我正在使用Wordpress主题，它应该通过javascript动态加载部分php代码。它实际上与UA Sniffing结合使用，因为如果设备是移动的，那么无论如何都应该使用移动模板，但这不是重点。

如果screen.width是＆lt; 1080px应该加载我的Wordpress主题的移动版本菜单。
否则，如果screen.width更大，则应加载桌面菜单版本
基于CSS Media查询的解决方案是不可接受的，因为桌面版本太重了。

所以我决定通过enquire.js动态加载内容 WP-homepage-template.php的第一部分是：

enquire.register("screen and (max-width:1080px)", {
<script type="text/javascript">
    match : function() {
        $("body").load(
          "/path/headernav-phone.php"
        );

    unmatch : function() {
            $("body").load(
          "/path/headernav-desktop.php"
        );
    }
}

因此，当屏幕大小达到1080px时，Wordpress应该加载headernav-phone.php 它只包含一个wp_nav_menu（MOBILE）调用。如果屏幕尺寸较大，Wordpress会加载headernav-desktop.php，其中包括wp_nav_menu（DESKTOP）。

这不起作用：

致命错误：在第14行的/XX/YYY/ZZZ/webseiten/XXX.YY/wp-content/themes/MyTheme/templates/headernav-phone.php中调用未定义的函数wp_nav_menu（）

看起来我的代码在CMS之前运行，并且它破坏了自己的功能。

Answer 1

IMO，逻辑是有缺陷的。
一个，there's no way to detect the screen width with PHP。

其次，如果您要生成PHP - ＆gt; JS文件（my-script.js.php），you'd have to load WordPress engine two times。
_{此链接中的答案是 super-pro 。您会找到使用wp-load.php和WP_USE_THEMES的简单方法。}

第三，您尝试加载主题模板的方式需要“加载两次”方法。或solving it with AJAX和wp_localize_script。

如果我正确理解了问题，我认为最好的选择是相应地使用WordPress user-agent detection和enqueue your scripts and styles。研究core function以适应您的需求。

<强> [更新]

仍然不确定是否真的需要所有这些复杂性。这样的东西会在通用的header.php吗？

中起作用

if( wp_is_mobile() )
    wp_nav_menu(MOBILE);
else
    wp_nav_menu(DESKTOP);

但是，如果你真的需要动态发生这种变化，那么AJAX就是你的选择。

Wordpress＆amp; Enquire.js - 条件加载哲学

1 个答案: