创建非常基本的插件时会遇到麻烦

时间:2017-05-24 作者:stumpjumper64

我正在努力创建和测试我的第一个基本WP插件,但有些困难。我还运行一个WAMP服务器。

下面是使用的脚本。

html是通过WP的页面编辑窗口添加到页面的唯一脚本。php来自保存在Plugin/test\\u Plugin目录中的文件(其内容也可以通过WP中的插件编辑窗口查看)。javascript保存在与php文件相同的test\\u插件目录中的文件中。

旁注:

插件已在WP插件主窗口中“激活”。相同的(除了文件存储位置、名称、脚本名称等)之前已插入到主题的函数中。php文件以及可用的相关js文件已经演示了所需的功能。

我做错了什么??

html

<button id="unique_button" type="button">Click Me!</button>
--

test\\u插件。php

<?php
    /*
    Plugin Name: test_plugin
    */

 function test_plugin() {
    wp_enqueue_script( \'change_button\', get_template_directory_uri() .  \'change_button.js\', array( \'jquery\' ), \'1.0.0\', 1 );
}

add_action( \'wp_enqueue_scripts\', \'test_plugin\' );

?>
--

change\\u按钮。js公司

jQuery( function ( $ ) {
    $("#unique_button").click(function() {
        $(this).fadeOut(1000);
    })
});

1 个回复
最合适的回答,由SO网友:Dave Romsey 整理而成

将JavaScript或CSS从插件目录排队时,请使用plugin_dir_url( __FILE__ ).

请注意plugin_dir_url() 返回带有尾部斜杠的URL,与get_template_directory_uri()get_stylesheet_directory_uri() 不返回带有尾部斜杠的URL。get_template_directory_uri()get_stylesheet_directory_uri() 分别在主题和子主题中更常用。

以下是的更新版本test_plugin(). 它起作用了。

add_action( \'wp_enqueue_scripts\', \'test_plugin\' );
function test_plugin() {
    wp_enqueue_script( \'change_button\', plugin_dir_url( __FILE__ ) .  \'change_button.js\', array( \'jquery\' ), \'1.0.0\', 1 );
}
JavaScript还需要一个小补丁。#unique_button 应在引号中。最后,这是使用的最佳实践.on() 而不是.click().

change_button.js:

jQuery( function ( $ ) {
    $( "#unique_button" ).on( "click", function( e ) {
            $(this).fadeOut(1000);
    });
});

结束