自定义短代码库忽略入队 CSS 和 JS 文件

Question

我正在尝试通过短代码引入我自己的图片库，以便将其添加到 Elementor 小部件中。目前，我已完成所有工作，但没有为该画廊显示任何样式或图像。 css 文件和 js 文件都在浏览器中加载。图库的所有 HTML 也在加载，但是我没有看到任何样式或图像出现。

这是简码：

add_shortcode( 'selected_works_gallery', function () {
    ob_start();?>

    <div id = "selected_works_gallery" data-nanogallery2 = '{ "thumbnailWidth": "auto", "thumbnailHeight": 200}'>
        <?php foreach (get_field('selected_works') as $image): ?>
        
        <a href="<?php echo $image['sizes']['medium']?>" data-ngthumb="<?php echo $image['sizes']['medium']?>">Image tagline</a>
        
        <?php endforeach; ?>
    </div>
<?php
    $out = ob_get_contents();
    ob_end_clean();
    return $out;
} );

入队：

function enqueue_custom_styles() {

    wp_enqueue_style( 'nanogallery2', esc_url_raw('https://unpkg.com/nanogallery2/dist/css/nanogallery2.min.css'), array(), null );

}

add_action( 'wp_enqueue_scripts', 'enqueue_custom_styles');

function enqueue_custom_scripts(){
    wp_enqueue_script( 'nanogallery2_js', esc_url_raw('https://unpkg.com/nanogallery2/dist/jquery.nanogallery2.min.js'), false );
}

add_action( 'wp_enqueue_scripts', 'enqueue_custom_scripts');

我唯一的猜测是：

HTML 如此深埋在 div 中，以至于排队的文件无法 select 标签
有优先级的东西（这个真不懂，都是默认的）
WordPress 存在外部文件排队问题
我必须对 Elementor 做一些事情才能让这个画廊正常工作
NanoGallery2 不适用于此，或者我设置错误。

在此先感谢您的帮助。

Answer 1

我能够通过将 js 和 css 文件放入本地文件来实现它。 Nanogallery 需要 Jquery 才能工作，它正在加载。我只是在我自己的脚本之前排队 Jquery，画廊工作正常。

自定义短代码库忽略入队 CSS 和 JS 文件

Custom Shortcode Gallery Ignoring Enqueue'd CSS and JS files

php

wordpress

advanced-custom-fields

elementor

nanogallery