我在一个博客上做一些维护工作,几个月前我被雇来创建这个博客。他们想添加一个滑块,所以我开始实现FlexSlider。但我在滑块上遇到了问题。
我已将所需的依赖项添加到标题中:
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
<link rel="stylesheet" href="<?php echo get_bloginfo(\'template_directory\'); ?>/flexslider.css" type="text/css" media="screen" />
<script src="<?php echo get_bloginfo(\'template_directory\'); ?>/jquery.flexslider-min.js"></script>
在我的索引文件中,我有:
<div class="flex-container">
<div class="flexslider">
<ul class="slides">
<li>
<?php query_posts(array ( \'posts_per_page\' => 1, \'tag\'=> \'one\' )); ?>
<?php while (have_posts()) : the_post(); ?>
<?php $slider_image = get_post_meta($post->ID, \'slider_image\', true);?>
<img src="<?php echo $slider_image[0][\'image\']; ?>" />
<div class="info">
<h1><a href="<?php the_permalink(); ?>"> <?php the_title(); ?></a></h1>
<p><?php the_time(\'F jS, Y\') ?> by <?php the_author() ?></p>
<p><?php echo excerpt(55); ?></p>
<p class="read"><a href="<?php the_permalink(); ?>"> Read More ></a></p>
<?php endwhile; ?>
</div>
</li>
</ul>
</div>
</div>
我的问题是,当您查看滑块时,“幻灯片”似乎根本没有样式,jquery文件似乎根本没有功能。我一直看到一个错误:
Uncaught TypeError: Object #<Object> has no method \'slides\'
:1112/:22Uncaught TypeError: Object #<Object> has no method \'flexslider\'
你可以看到我在做什么
http://louisstephens.cc/blog (使用我自己的博客,以免弄乱客户的网站)。有没有人看到我在正常工作中遗漏的东西?
最合适的回答,由SO网友:Bouchaala Sabri 整理而成
在您的功能中。php添加此代码
function load_custom_script() {
wp_deregister_script(\'jquery\');
wp_register_script(\'jquery\', \'https://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js\', false, \'1.6.2\');
wp_enqueue_script(\'jquery\');
wp_register_script(\'jquery.flexslider\', get_bloginfo(\'template_directory\').\'/jquery.flexslider-min.js\', array(\'jquery\'));
wp_enqueue_script(\'jquery.flexslider\');
}
function load_custom_style() {
wp_register_style(\'flexslider\', get_bloginfo(\'template_url\').\'/flexslider.css\', array(), \'\');
wp_enqueue_style(\'flexslider\');
}
add_action(\'wp_print_scripts\', \'load_custom_script\');
add_action(\'wp_print_styles\', \'load_custom_style\');
不要忘记删除代码
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
<link rel="stylesheet" href="<?php echo get_bloginfo(\'template_directory\'); ?>/flexslider.css" type="text/css" media="screen" />
<script src="<?php echo get_bloginfo(\'template_directory\'); ?>/jquery.flexslider-min.js"></script>