Question

我试图在标题上的移动设备上加载一个简单的javascript代码。

我已经尝试过插件和代码，但似乎不在我的掌控之中并且需要帮助：D

侨！

Answer 1

function custom_load_scripts() { 
   // Load if not mobile 
   if ( ! wp_is_mobile() ) { 
      // Example script 
      wp_enqueue_script( 'script-name',get_template_directory_uri() . '/js/example.js', array (), '1.0.0', true ); 
      } 
}

add_action( 'wp_enqueue_scripts', 'custom_load_scripts' );

Answer 2

您不应将JS（或CSS）文件直接添加到header.php或footer.php文件中。

您可以做的是将队列和样式排入队列和样式，使用wp_enqueue_scripts钩子。

在该钩子上的函数内部，您将使用wp_enqueue_script()函数添加脚本。将第5个参数设置为true会将代码放在标题中。

您将注意到第三个参数是一个数组，它是您的代码所依赖的脚本数组，例如，如果您的代码依赖于jQuery，您可以将其更改为{{1} }

最后，WordPress具有检测相对较好的移动设备的功能，方便地称为wp_is_mobile()。

因此我们可以在排队脚本之前检查是否返回array( 'jquery' )。

将此代码放在true文件中，当然是在用您的脚本的URL替换URL后。

functions.php

Answer 3

其他答案建议在排队脚本时使用WordPress函数wp_is_mobile()。这样做要非常小心。如果您使用缓存插件或主机缓存PHP请求，这可能会使此方法无效。

相反，我建议加载JavaScript文件并根据使用JavaScript的设备屏幕尺寸测试浏览器是否可移动。

这是一个例子（使用jQuery）：

$( document ).ready(function() {      
    var isMobile = window.matchMedia("only screen and (max-width: 760px)");

    if (isMobile.matches) {
        //Add your script that should run on mobile here
    }
 });

如何在wordpress上仅为移动设备加载脚本

3 个答案: