Home Forums Add-ons Gallery Field Multiple flexsliders on site Reply To: Multiple flexsliders on site

  • You need to be more specific. If the sliders are always a different size, you could add another ACF field for width and height and then use that field to set width and height in the template file.

    For example:

    <div class="flexcontainer">
        <div id="first-slider" class="flexslider" style:"width:<?php echo get_field("slider_width") ?>">
            <ul class="slides">

    If you have control over the javascript settings, just include the flexslider configuration inside the page (in a script tag) and again use ACF field for dimensions

    There is also a strict javascript approach (when you don’t know the dimensions of images inside the slider).

    var evenSliderHeight = function(slideContainer, slideItem) {
      var slider_height = 0;
      var $slider_slide = $(slideContainer).find(slideItem);
      $slider_slide.each(function() {
        var __height = $(this).outerHeight(true);
        if ( slider_height < __height ) {
           slider_height = __height;
      $slider_slide.css('min-height', slider_height);
    evenSliderHeight('.flexslider-container', '.slide');