I am trying to integrate FlexSlider into my theme to use as a post slider and I have followed this tutorial to try to do so and have done everything the way they have specified:
http://return-true.com/2012/04/insta...rdpress-theme/
I have this in my page-home.php
Code:
<div class="flex-container"> <div class="flexslider"> <ul class="slides"> <?php query_posts(array('category_name' => 'food', 'posts_per_page' => 3)); if(have_posts()) : while(have_posts()) : the_post(); ?> <li> <?php the_post_thumbnail(); ?> <p class="flex-caption"><?php the_excerpt(); ?></p> </li> <?php endwhile; endif; wp_reset_query(); ?> </ul> </div> </div>
Code:
function my_add_scripts() { wp_enqueue_script('flexslider', get_bloginfo('stylesheet_directory').'js/jquery.flexslider-min.js', array('jquery')); wp_enqueue_script('flexslider-init', get_bloginfo('stylesheet_directory').'js/flexslider-init.js', array('jquery', 'flexslider')); } add_action('wp_enqueue_scripts', 'my_add_scripts'); function my_add_styles() { wp_enqueue_style('flexslider', get_bloginfo('stylesheet_directory').'js/flexslider.css'); } add_action('wp_enqueue_scripts', 'my_add_styles');
Code:
<?php $bfa_ata_version = "3.7.3"; // Load translation file above load_theme_textdomain('atahualpa'); // To disable some default WP filters, remove the '#' character #remove_filter('the_content', 'wptexturize'); #remove_filter('the_excerpt', 'wptexturize'); #remove_filter('comment_text', 'wptexturize'); #remove_filter('the_title', 'wptexturize'); add_filter('widget_text', 'do_shortcode'); function my_add_scripts() { wp_enqueue_script('flexslider', get_bloginfo('stylesheet_directory').'js/jquery.flexslider-min.js', array('jquery')); wp_enqueue_script('flexslider-init', get_bloginfo('stylesheet_directory').'js/flexslider-init.js', array('jquery', 'flexslider')); } add_action('wp_enqueue_scripts', 'my_add_scripts'); function my_add_styles() { wp_enqueue_style('flexslider', get_bloginfo('stylesheet_directory').'js/flexslider.css'); } add_action('wp_enqueue_scripts', 'my_add_styles'); // get default theme options include_once (TEMPLATEPATH . '/functions/bfa_theme_options.php'); // Load options include_once (TEMPLATEPATH . '/functions/bfa_get_options.php'); list($bfa_ata, $cols, $left_col, $left_col2, $right_col, $right_col2, $bfa_ata['h_blogtitle'], $bfa_ata['h_posttitle']) = bfa_get_options();
Code:
(function($) { $(window).load(function() { $('.flexslider').flexslider({ animation: 'slide', controlsContainer: '.flex-container' }); }); })(jQuery)
So far all I have managed to achieve is getting the page to put out the first three posts with their excerpts, and the post titles are underneath the posts.
It obviously works for lots of other people so I'm no sure why its not working on mine.
Help?
Dani