Reply To: Gallery and Flexslider

• mediawerk

• October 26, 2015 at 10:27 pm

i have a working flexslider with acf-gallery.

I dont know if it make a big difference,(because your code looks not that different than mine.) but i hope it works when you do it this way (like i do)

register scripts inside functions.php

<?php
add_action('wp_enqueue_scripts', 'register_content_scripts');   
function register_content_scripts(){
wp_register_style( 'flexslider-custom-css', get_stylesheet_directory_uri() . '/css/flexslider/flexslider.css' );
wp_register_script( 'acf-flexslider-scripts',  get_stylesheet_directory_uri() . '/js/jquery.flexslider-min.js',  array( 'jquery' ), 1, 1 );
wp_register_script( 'flexslider-init',  get_stylesheet_directory_uri() . '/js/flex-init.js',  array( 'jquery' ), 1, 1 );
}
?>

inside gallery-template enqueue them

<?php
$images = get_field('slider');
if( $images ):
wp_enqueue_style( 'flexslider-custom-css' );
wp_enqueue_script( 'acf-flexslider-scripts' );
wp_enqueue_script( 'flexslider-init' );
?>
<div id="slider" class="flexslider">
        <ul class="slides">
            <?php foreach( $images as $image ): ?>
                <li>
                    <img src="<?php echo $image['url']; ?>" alt="<?php echo $image['alt']; ?>" />
                    <p><?php echo $image['caption']; ?></p>
                </li>
            <?php endforeach; ?>
        </ul>
    </div>
<?php endif; 
?>

use this inside flex-init.js

jQuery(document).ready(function($) {
$(".flexslider").flexslider({
animation: "fade"
});
});

try it and say if it works