Bootstrap Carousel滑块-CSS和JS无法正常工作

时间:2019-03-16 作者:Smnc

我认为css或js文件没有加载,我如何解决它。Screenshoot

功能。php在此处。

function pp_scripts() {
// Registering Bootstrap style
wp_enqueue_style( \'bootstrap_min\', get_stylesheet_directory_uri().\'/css/bootstrap.min.css\' );

wp_enqueue_script(\'jquery\');
//Registering Bootstrap Script
wp_enqueue_script( \'bootstrap_min\', get_template_directory_uri() . \'/js/bootstrap.min.js\', array(), \'\', true );
}
add_action( \'wp_enqueue_scripts\', \'pp_scripts\' );

add_action( \'init\', \'custom_bootstrap_slider\' );
/**
 * Register a Custom post type for.
 */
function custom_bootstrap_slider() {
    $labels = array(
        \'name\'               => _x( \'Slider\', \'post type general name\'),
        \'singular_name\'      => _x( \'Slide\', \'post type singular name\'),
        \'menu_name\'          => _x( \'Bootstrap Slider\', \'admin menu\'),
        \'name_admin_bar\'     => _x( \'Slide\', \'add new on admin bar\'),
        \'add_new\'            => _x( \'Add New\', \'Slide\'),
        \'add_new_item\'       => __( \'Name\'),
        \'new_item\'           => __( \'New Slide\'),
        \'edit_item\'          => __( \'Edit Slide\'),
        \'view_item\'          => __( \'View Slide\'),
        \'all_items\'          => __( \'All Slide\'),
        \'featured_image\'     => __( \'Featured Image\', \'text_domain\' ),
        \'search_items\'       => __( \'Search Slide\'),
        \'parent_item_colon\'  => __( \'Parent Slide:\'),
        \'not_found\'          => __( \'No Slide found.\'),
        \'not_found_in_trash\' => __( \'No Slide found in Trash.\'),
    );

    $args = array(
        \'labels\'             => $labels,
        \'menu_icon\'      => \'dashicons-star-half\',
                \'description\'        => __( \'Description.\'),
        \'public\'             => true,
        \'publicly_queryable\' => true,
        \'show_ui\'            => true,
        \'show_in_menu\'       => true,
        \'query_var\'          => true,
        \'rewrite\'            => true,
        \'capability_type\'    => \'post\',
        \'has_archive\'        => true,
        \'hierarchical\'       => true,
        \'menu_position\'      => null,
        \'supports\'           => array(\'title\',\'editor\',\'thumbnail\')
    );

    register_post_type( \'slider\', $args );
}
对于模板文件

<?php  $slider = get_posts(array(\'post_type\' => \'slider\', \'posts_per_page\'   => 5)); ?>

<?php div id="carousel-example-generic" class="carousel slide" data-ride="carousel">
  <!-- Indicators -->
  <ol class="carousel-indicators">
    <li data-target="#carousel-example-generic" data-slide-to="0" class="active"></li>
    <li data-target="#carousel-example-generic" data-slide-to="1"></li>
    <li data-target="#carousel-example-generic" data-slide-to="2"></li>
  </ol>

  <!-- Wrapper for slides -->
  <div class="carousel-inner" role="listbox">
    <?php $slider = get_posts(array(\'post_type\' => \'slider\', \'posts_per_page\' => 5)); ?>
      <?php $count = 0; ?>
      <?php foreach($slider as $slide): ?>
      <div class="item <?php echo ($count == 0) ? \'active\' : \'\'; ?>">
        <img src="<?php echo wp_get_attachment_url( get_post_thumbnail_id($slide->ID)) ?>" class="img-responsive"/>
      </div>
      <?php $count++; ?>
    <?php endforeach; ?>
  </div>

  <!-- Controls -->
  <a class="left carousel-control" href="#carousel-example-generic" role="button" data-slide="prev">
    <span class="glyphicon glyphicon-chevron-left" aria-hidden="true"></span>
    <span class="sr-only">Previous</span>
  </a>
  <a class="right carousel-control" href="#carousel-example-generic" role="button" data-slide="next">
    <span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span>
    <span class="sr-only">Next</span>
  </a>
</div>?>

1 个回复
SO网友:jsmod

尝试更改此选项:

// Registering Bootstrap style
wp_enqueue_style( \'bootstrap_min\', get_stylesheet_directory_uri().\'/css/bootstrap.min.css\' );
为此:

// Registering Bootstrap style
wp_enqueue_style( \'bootstrap_min\', get_template_directory_uri() .\'/css/bootstrap.min.css\' );