我是 WordPress 主题开发的新手，我遇到了以下问题。
我正在尝试基于这个 BootStrap 演示静态网站创建一个使用 BootStrap CSS 框架的 WordPress 主题(我有这个网站的全部源代码，因为它是一个可下载的教程):http://www.html.it/guide/img/bootstrap/demo/home.html
这是我的自定义 WP 主题:http://onofri.org/WP_BootStrap/
所以我创建了一个基本的 WP 主题，作为第一步，我想在我的 WP 主题的 header.php 文件中插入上一个演示页面的幻灯片，所以这是我的 header.php 代码:
DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" <?php language_attributes(); ?>
<head profile="http://gmpg.org/xfn/11">
<meta http-equiv="Content-Type" content="<?php bloginfo('html_type'); ?>; charset=<?php bloginfo('charset'); ?>" />
<title><?php bloginfo('name'); ?> <?php if ( is_single() ) { ?> » Blog Archive <?php } ?> <?php wp_title(); ?></title>
<meta name="generator" content="WordPress <?php bloginfo('version'); ?>" />
<!-- leave this for stats -->
<link rel="pingback" href="<?php bloginfo('pingback_url'); ?>" />
<?php wp_head(); ?>
</head>
<body>
<!-- Sezione slider con Flexslider -->
<div class="row">
<div class="col-sm-12">
<div id="main-slider" class="flexslider">
<ul class="slides">
<li>
<img src="<?php bloginfo('template_url'); ?>/assets/img/flexslider/flex-1.jpg"/>
<div class="flex-caption">
<p class="flex-caption-text">
<span>Lorem ipsum</span><br>
<span>sit dolor</span><br>
<span>adipiscing elitur</span>
</p>
</div>
</li>
<li>
<img src="<?php bloginfo('template_url'); ?>/assets/img/flexslider/flex-2.jpg"/>
<div class="flex-caption">
<p class="flex-caption-text">
<span>Lorem ipsum</span><br>
<span>sit dolor</span><br>
<span>adipiscing elitur</span>
</p>
</div>
</li>
<li>
<img src="<?php bloginfo('template_url'); ?>/assets/img/flexslider/flex-3.jpg"/>
<div class="flex-caption">
<p class="flex-caption-text">
<span>Lorem ipsum</span><br>
<span>sit dolor</span><br>
<span>adipiscing elitur</span>
</p>
</div>
</li>
</ul>
</div><!-- /.flexslider -->
</div><!-- /.col-sm-12 -->
</div><!-- /.row -->
<center>
<div id="page">
<div id="header">
<h1><a href="<?php echo get_settings('home'); ?>"><?php bloginfo('name'); ?></a></h1>
<div class="description"><?php bloginfo('description'); ?></div>
</div>
<hr />
如您所见，我只是简单地获取了静态演示网站的 block ，并将其放在我的 header.php 文件的开头。
为了加载我的jquery.flexslider.js，我按照用于加载 JavaScript 的 WordPress 标准将此代码用于 WordPress functions.php 文件:
/* Function automatically executed by the hook 'load_java_scripts':
* 1) Load all my JavaScripts
*/
function load_java_scripts() {
// Load JQuery:
wp_enqueue_script('jquery');
// Load bootstrap.min.js:
wp_enqueue_script('bootstrap.min-js', get_template_directory_uri() . '/assets/bootstrap/js/bootstrap.min.js', array('jquery'), 'v3.0.3', true);
// Load FlexSlider JavaScript
wp_enqueue_script('flexSlider-js', get_template_directory_uri() . '/assets/plugins/flexslider/jquery.flexslider.js', array('jquery'), 'v2.1', true);
// Load FancyBox:
wp_enqueue_script('fancy-js', get_template_directory_uri() . '/assets/plugins/fancybox/jquery.fancybox.pack.js', array('jquery'), 'v2.1.5', true);
// Load scripts.js:
wp_enqueue_script('fancy-js', get_template_directory_uri() . '/assets/js/scripts.js', array('jquery'), '1.0', true);
}
add_action('wp_enqueue_scripts', 'load_java_scripts');
如您所见，jquery.flexslider.js 应该加载到我的所有页面中，事实上(在 FireFox 中)查看页面源代码的末尾有:
<script type='text/javascript' src='http://localhost/wordpress/wp-content/themes/AsperTheme/assets/plugins/flexslider/jquery.flexslider.js?ver=v2.1'></script>
然后点击它可以看到jquery.flexslider.js
的源码好的，我的 WordPress 主题配置为使用 BootStrap CSS 和 flexslider.css 以及代表演示网站中的 style2.css 文件的 stili-custom.css(我的自定义 CSS 设置加载于最后覆盖定义的属性)
如您所见，问题是在我的主题开始时没有出现幻灯片放映，我不知道这个问题。
为什么？你能帮我解决这个问题吗？
谢谢
安德里亚
最佳答案
我看到你加载了 flexslider js，但你真的在调用 flexslider 来构建你的幻灯片吗？
类似于:
$(document).ready(function(){
$('.flexslider').flexslider({option1: value, option2: value});
});
关于php - 为什么 FlexySlider 幻灯片没有加载到这个 WordPress 主题中？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/21267210/