我试图单击按钮打开Jquery模式窗口。并将此按钮插入插件内容模板（WP SHow posts）。我用的是jquerymodal。com的模式代码，因为我不需要太多过多的功能。但到目前为止，它还不起作用。

我通过googleapis将jquery和jQueryModel插件包含在我的主题函数中。像这样的php文件，只想在特定页面上使用它：

if (!is_admin()) {
wp_deregister_script(\'jquery\');
wp_register_script(\'jquery\', \'https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js\', \'jquery\', \'3.1.1\', true);
wp_enqueue_script(\'jquery\');
}

function load_javascript_file() {
    wp_register_script(\'modal\', get_template_directory_uri() . \'/js/jquery.modal.min.js\', \'jquery\', \'\', true);
}
add_action( \'init\', \'load_javascript_file\' );

function conditionally_load_javascript_file() {
    if ( is_page( \'kundenprofile\' ) ) {
      wp_enqueue_script(\'modal\');
    }
}
add_action(\'wp_enqueue_scripts\', \'conditionally_load_javascript_file\' );

并像这样在主题函数中添加了jQueryModel css。php：

function wpse39139_register_more_stylesheets() {
    wp_register_style( \'modal\', get_template_directory_uri() . \'/jquery.modal.min.css\' );
}
add_action( \'init\', \'wpse39139_register_more_stylesheets\' );

function wpse39139_conditionally_enqueue_my_stylesheet() {
    // only enqueue on product-services page slug
    if ( is_page( \'kundenprofile\' ) ) {
        wp_enqueue_style( \'modal\' );
    }
}
add_action( \'wp_enqueue_scripts\', \'wpse39139_conditionally_enqueue_my_stylesheet\' );

然后，我将模式内容添加到插件模板文件中（请参见标题中的第一个div），我想在其中使用它。这是我尝试插入模态div的完整部分：

<header class="wp-show-posts-entry-header">


    <div id="ex1" class="modal">
        <p>Thanks for clicking. That felt good.</p>
            <a href="#" rel="modal:close">Close</a>
    </div>



    <div class="entry-header-wrap">
        <?php

        do_action( \'wpsp_before_title\', $settings );
        echo wp_show_posts_profile_picture();
        echo \'<div class="profile-head"\' . $settings[ \'inner_wrapper_style\' ] . \'>\';
        $before_title = sprintf(
        \'<%1$s class="wp-show-posts-entry-title" itemprop="headline"><a href="%2$s" rel="bookmark">\',
            $settings[ \'title_element\' ],
            esc_url( get_permalink() )
        );

        $after_title = \'</a></\' . $settings[ \'title_element\' ] . \'>\';

        if ( apply_filters( \'wpsp_disable_title_link\', false, $settings ) ) {
        $before_title = \'<\' . $settings[ \'title_element\' ] . \' class="wp-show-posts-entry-title" itemprop="headline">\';
        $after_title = \'</\' . $settings[ \'title_element\' ] . \'>\';
        }

        if ( $settings[ \'include_title\' ] ) {
        the_title( $before_title, $after_title );
        }

        do_action( \'wpsp_after_title\', $settings );

        echo wp_show_posts_standort();

        ?>
        </div>
            </header><!-- .entry-header -->

之后，我添加了链接，以在另一节中打开下面的实际模态内容（请参见打开模态链接）：

if ( \'excerpt\' == $settings[ \'content_type\' ] && $settings[ \'excerpt_length\' ] && ! $more_tag && \'none\' !== $settings[ \'content_type\' ] ) : ?>
    <div class="wp-show-posts-entry-summary" itemprop="text">
    <div class="profilinhalt">
    <?php echo wp_show_posts_merkmal(); ?>

    <p><a href="#ex1" rel="modal:open">Open Modal</a></p>

        <?php wpsp_excerpt( $settings[ \'excerpt_length\' ] ); ?>
    </div><!-- .entry-summary -->
<?php elseif ( ( \'full\' == $settings[ \'content_type\' ] || $more_tag ) && \'none\' !== $settings[ \'content_type\' ] ) : ?>
    <div class="wp-show-posts-entry-content" itemprop="text">
        <?php the_content( false, false ); ?>
        </div>

    </div>

我现在面临的问题是，它不起作用。css加载。就我所知，jquery文件也是如此，但我测试了又测试，似乎遗漏了一些我无法识别的简单错误。我在这里寻找输入，以找到拼图中缺失的部分。也许Wordpress需要一些特殊的输入来加载文件，我不确定了。

我很感激能得到的任何帮助或指点。

function my_custom_enqueue_scripts() {

    wp_deregister_script( \'jquery\' );
    wp_register_script( \'jquery\', \'https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js\', array(), \'3.1.1\', true );
    wp_register_script( \'mymodal\', get_template_directory_uri() . \'/js/jquery.modal.min.js\', array( \'jquery\' ), \'\', true );
    wp_register_style( \'mymodal\', get_template_directory_uri() . \'/jquery.modal.min.css\' );
    if ( is_page( \'kundenprofile\' ) ) {
        wp_enqueue_script( \'mymodal\' );
        wp_enqueue_style( \'mymodal\' );
    }
}

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

add_action( \'wp_enqueue_scripts\', \'my_custom_enqueue_scripts\', 1 );