Question

我正在从头开始构建 WP 主题，并且我已将 maymouse.js 的 tye js 和 css 文件添加到我的主题 css 和 js 目录中。我已经使用

将 fuctions.php 文件中的两个元素排入队列

function cursor_javascript() {
wp_enqueue_script( 'mousemagic-js', get_template_directory_uri() . '/js/magic_mouse.js' );
}
add_action( 'wp_enqueue_scripts', 'cursor_javascript' );

function cursor_stylesheets() {
    wp_enqueue_style( 'mousemagic-css', get_template_directory_uri() . '/css/magic-mouse.css' );
}
add_action( 'wp_enqueue_scripts', 'cursor_stylesheets' );

我试图让光标显示在所有页面上，但我没有让它呈现出来。当我在页面上使用检查时，我可以看到正在加载的元素。如何在不使用任何插件的情况下将函数全局添加到每个页面？

提前致谢！！！

Answer 1

加载后需要初始化magicmouse。

在您的主题目录中创建一个新脚本，例如magicmouse.local.js 并在文件中放置初始化调用。

例如这是magicmouse.local.js的内容：

options = {
  "cursorOuter": "circle-basic",
  "hoverEffect": "circle-move",
  "hoverItemMove": false,
  "defaultCursor": false,
  "outerWidth": 30,
  "outerHeight": 30
}
magicMouse(options);

然后用 wp_enqueue_script

加载这个脚本

例如这是更新后的函数

function cursor_javascript() {
wp_enqueue_script( 'mousemagic-js', get_template_directory_uri() . '/js/magic_mouse.js' );
wp_enqueue_script( 'mousemagic-js-local', get_template_directory_uri() . '/js/magicmouse.local.js' );
}
add_action( 'wp_enqueue_scripts', 'cursor_javascript' );

Answer 2

感谢@Andrea Oliviato 的帮助！

问题已解决。

问题在于我没有正确封装本地 js 脚本。我使用了以下内容；

jQuery(document).ready(function(){
  options = {
    "cursorOuter": "circle-basic",
    "hoverEffect": "circle-move",
    "hoverItemMove": false,
    "defaultCursor": false,
    "outerWidth": 30,
    "outerHeight": 30
    }
  magicMouse(options);
})

光标功能运行良好，谢谢！

尝试将 Magicmouse.js 添加到自定义 wordpress 主题 - 无法加载

2 个答案: