如何在Wordpress上正确包含jquery-ui效果

我一直试图在我的wordpress主题中包括jquery ui效果（更具体地说是摇动效果）。到目前为止，我只能包含jQuery脚本，但是我真的不知道将ui脚本放置在何处以及如何使其入队。

这是我的代码。它显然不起作用：

    <?php wp_enqueue_script("jquery"); ?>
<?php wp_enqueue_script("jquery-ui-core"); ?>
<?php wp_head(); ?>
<link rel="stylesheet" type="text/css" href="<?php bloginfo('stylesheet_url'); ?>" />
<script type="text/javascript">
    var $j = jQuery.noConflict();
    $j(document).ready(function() {
        $j("#manita-imagen").mouseover(function(){
            //$j(this).animate({ opacity: "hide" })
            // alert('asd');
            $j(this).effect("shake", { times:3 }, 300);
        });
    });

 </script>

谢谢你的帮助！

尽管WordPress确实包含jQuery UI库，但它不包含UI / Effects库。该库是独立的。您需要包括effects.core.js文件的副本，并将其单独排队。

请注意，在排队时，应将其命名为jquery-effects-core，以保持一致性。

您可以像这样包含它：

wp_enqueue_script("jquery-effects-core",'http://example.com/whatever/effects.core.js', array('jquery'), '1.8.8');

编辑：此答案是在WordPress 3.3之前编写的，而WordPress 3.3现在包括各种效果库作为核心的一部分。您只需将现在需要使用的效果库片段放入队列即可。

这些文件的段列表可以在wp-includes / script-loader.php中找到，但是核心的段是jquery-effects-core。

wp_enqueue_script("jquery-effects-core");

@dabito，

您没有正确加载脚本...不要wp_enqueue_script()在主题模板文件中调用（看起来像header.php）。您需要从单独的挂钩调用此函数。

在主题functions.php文件中，放置以下代码：

function my_add_frontend_scripts() {
        wp_enqueue_script('jquery');
        wp_enqueue_script('jquery-ui-core');
}
add_action('wp_enqueue_scripts', 'my_add_frontend_scripts');

如果两个脚本都已正确注册，则应该可以正常加载它们（通过<script />在标头中添加适当的标签。然后其他JavaScript代码应该可以正常工作）。

如果要将脚本添加到事物的管理端，请添加操作admin_enqueue_scripts。

您也可以直接从Google入队整个jQuery UI。这是我的方法：

wp_enqueue_script('jquery-ui', 'http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.6/jquery-ui.min.js', array('jquery'), '1.8.6');

而且由于jQuery被列为jQuery UI的依赖项，因此您无需手动将其加入队列。WordPress会自动为您完成。

该jQuery库似乎没有默认加载（此处为完整列表），因此您可能需要在入队之前注册脚本。

只是一些技巧。当您将脚本排入队列时，它会排入整个站点，包括管理面板。如果您不希望该脚本出现在管理面板中，则只能在前端将它们包括在网站中。

function my_add_frontend_scripts() {
    wp_enqueue_script('jquery');
    wp_enqueue_script('jquery-ui-core');
}

add_action( 'wp_enqueue_scripts', 'my_add_frontend_scripts');

这里的所有答案虽然有效，但在技术上都是错误的。

包含jquery-ui和其他库的正确方法是将它们包含为您自己脚本的依赖项。

这很重要，因为性能工具可能会检查这些依赖性，以更改脚本的加载顺序以优化站点。

因此，如果要使用jquery和jquery-ui，请创建自己的.js脚本文件并按如下顺序对其进行排队，并列出相关性-无需为所使用的每个库使用单独的enqueue命令：

wp_enqueue_script('your-script-handle', 
 plugins_url('your-script-file.js', __FILE__), 
 array('jquery', 'jquery-effects-core', 'jquery-ui-core')
);

您可以在此处找到所有要添加为依赖项的脚本的列表：https : //developer.wordpress.org/reference/functions/wp_enqueue_script/