基于中的代码https://codepen.io/mso122591/pen/qVZYNN, 在帖子或页面上放置按钮：

<button>Join booth</button>

请注意id="myBtn" 已从中删除<button> 标记，因为jQuery脚本通过其标记而不是id来定位按钮。

现在，我们将使用wp_footer 操作挂钩，将jQuery脚本内联插入页脚。将此代码放入functions.php 您的主题（最好是儿童主题）：

function wpse_insert_script() {
    echo \'<script>
jQuery(document).ready(function($){
  $("button").click(function(){
    $("button").hide();
    $("button").show(8000)
  });
});
</script>\';
}
add_action(\'wp_footer\', \'wpse_insert_script\');

请注意，首先$ 在我们最初的剧本中，这个角色被替换为jQuery （区分大小写）。这是必要的，因为WordPress以无冲突模式运行jQuery。首次出现function() 已替换为function($), 宣布$ 作为别名的字符jQuery, 因此可以在脚本的以下行中使用它。

jQuery在WP中默认处于活动状态，无需启用它。

有两种方法可以在WP中包含您自己的jQuery：

将您自己包含jQuery（首选方法）的文件排队wp_head 或wp_footer 动作挂钩，将脚本包含在jQuery中我只想解释如何将脚本排入WP中。

但首先，如果您想包含自己的文件，最好激活一个子主题。为什么？因为子主题中的更改不会被更新覆盖。有关子主题的更多信息，请参见：https://codex.wordpress.org/Child_Themes

几乎每个专业主题都包含子主题，只需将其上载到主题目录并在WP中激活即可。

下面是带有警报的简单jQuery文件的内容。

jQuery(document).ready(function ($) {
    alert("I am an alert box!");
}

如您所见$ 包含在函数中，无需将其替换为jQuery. &保存；将文件上载到子主题目录。

下一步：您需要告诉WP包含此文件。打开functions.php 在您的孩子主题中。添加以下功能：

add_action( \'wp_enqueue_scripts\', \'michael_enqueue_my_script\');
function michael_enqueue_my_script() {
    wp_register_script( \'my_test_script\', get_stylesheet_directory_uri() . \'/your-file-name.js\', array(\'jquery\'), \'0.0.1\', true );
    wp_enqueue_script( \'my_test_script\' );
}

我包括了michael 在函数名中，因为必须小心，所以不能创建重复的全局函数名。

当您将这样的文件排队时，很容易添加条件逻辑。以下示例仅在主页上加载您的文件：

add_action( \'wp_enqueue_scripts\', \'michael_enqueue_my_script\');
function michael_enqueue_my_script() {
    wp_register_script( \'my_test_script\', get_stylesheet_directory_uri() . \'/your-file-name.js\', array(\'jquery\'), \'0.0.1\', true );
    if( is_home() ) {
        wp_enqueue_script( \'my_test_script\' );
    }
}

谨致问候，

比约恩