WordPress插件短码在小工具区域使用时JS与CSS文件未加载求助

嘿，我懂你碰到的麻烦了——短码放到文章或页面里功能完全正常，但一塞进小工具区域，对应的JS和CSS就加载不出来。这事儿的根源其实很明确：你原来的代码只盯着文章/页面的内容来检测短码，完全没考虑小工具的内容根本不在$post->post_content里呀！

问题出在哪？ #

你看原来的form_my_include函数，是通过strstr($post->post_content, 'my_form_shortcode')来判断要不要加载资源。但小工具的内容是存在单独的系统选项里的，和文章内容完全是两个存储位置，所以当短码在小工具里时，这个检测条件永远不成立，资源自然就加载不上了。

两种解决方案，任你选 #

方案一：全局检测文章+所有小工具内容

这种方法会同时检查当前页面的文章内容，以及所有文本小工具的内容，只要其中有你的短码，就加载资源。修改后的代码如下：

// 自定义JS函数：注册脚本（保持不变）
add_action( 'wp_enqueue_scripts', 'my_functions' );
function my_functions() {
    wp_register_script( 'my-script-1', plugin_dir_url( __FILE__ ) . 'js/functions.js', array( 'jquery' ), '1.0', true );
}

// 自定义CSS：注册样式（保持不变）
add_action( 'wp_enqueue_scripts', 'my_css' );
function my_css() {
    wp_register_style('my-css', plugin_dir_url( __FILE__ ) . 'css/style.css' );
}

// 修改资源加载逻辑：覆盖文章和小工具场景
add_action( 'wp_enqueue_scripts', 'form_my_include' );
function form_my_include() {
    global $post;
    $shortcode_found = false;

    // 检查当前文章/页面是否包含短码（用WordPress官方的has_shortcode更可靠）
    if ( isset( $post->post_content ) && has_shortcode( $post->post_content, 'my_shortcode' ) ) {
        $shortcode_found = true;
    }

    // 如果文章里没找到，检查所有文本小工具
    if ( !$shortcode_found ) {
        foreach ( $GLOBALS['wp_widget_factory']->widgets as $widget ) {
            if ( isset( $widget->options['widget_id'] ) ) {
                $widget_instances = get_option( 'widget_' . $widget->id_base );
                foreach ( $widget_instances as $instance ) {
                    // 检查小工具的文本内容是否包含短码
                    if ( isset( $instance['text'] ) && has_shortcode( $instance['text'], 'my_shortcode' ) ) {
                        $shortcode_found = true;
                        break 2; // 找到后直接跳出两层循环，提高效率
                    }
                }
            }
        }
    }

    // 只要找到短码，就加载对应的资源
    if ( $shortcode_found ) {
        wp_enqueue_script('my-script-1');
        wp_enqueue_style('my-css');
    }
}

// 短码函数（保持不变）
function my_shortcode_add(){
    ob_start();
    include("include/my_function.php");
    return ob_get_clean();
}
add_shortcode('my_shortcode', 'my_shortcode_add');

// 在文本小工具中启用短码（保持不变）
add_filter('widget_text', 'do_shortcode');

方案二：短码调用时直接加载资源（更简单）

这种方法更省心——不管短码出现在哪里（文章、小工具、自定义模板），只要短码被执行，就自动加载对应的资源。WordPress会自动处理重复加载的问题，不用担心多次调用短码导致资源重复加载。

只需要修改你的短码函数就行，其他代码保持不变：

function my_shortcode_add(){
    // 加载资源（wp_enqueue会自动判断是否已注册/加载）
    wp_enqueue_script('my-script-1');
    wp_enqueue_style('my-css');
    
    ob_start();
    include("include/my_function.php");
    return ob_get_clean();
}
add_shortcode('my_shortcode', 'my_shortcode_add');

为什么推荐方案二？ #

方案二的代码更简洁，而且能覆盖所有可能的短码使用场景——不管用户把短码放到哪里，只要短码被渲染，资源就会被加载。相比方案一的全局检测，它不需要遍历所有小工具，效率更高，也更符合WordPress的开发最佳实践。

内容的提问来源于stack exchange，提问作者cloude