Hello There,
Thanks for writing in! By default the Slider loop is set to infinite. If you want to set it to false, we need to modify the slider and override the loop. Because what you are trying to accomplish requires a template customization, we would highly to suggest that you use a child theme. This allows you to make code changes that won’t be overwritten when an X update is released. After your child theme is setup, please review how we recommend making template changes in Customization Best Practices.
After the child theme is set up, please add the following code in your child theme’s functions.php file
// Custom Slider element
// =============================================================================
function custom_x_shortcode_slider( $atts, $content = null ) {
extract( shortcode_atts( array(
'id' => '',
'class' => '',
'style' => '',
'animation' => '',
'slide_time' => '',
'slide_speed' => '',
'slideshow' => '',
'random' => '',
'control_nav' => '',
'prev_next_nav' => '',
'no_container' => '',
'touch' => '',
'pause_on_hover' => '',
'infinite' => true,
), $atts, 'x_slider' ) );
static $count = 0; $count++;
$id = ( $id != '' ) ? 'id="' . esc_attr( $id ) . '"' : '';
$class = ( $class != '' ) ? "x-flexslider-shortcode-container " . esc_attr( $class ) : "x-flexslider-shortcode-container";
$style = ( $style != '' ) ? 'style="' . $style . '"' : '';
$no_container = ( $no_container == 'true' ) ? '' : ' with-container';
$js_params = array(
'animation' => ( $animation == 'fade' ) ? 'fade' : 'slide',
'infinite' => false,
'slideTime' => ( $slide_time != '' ) ? $slide_time : '7000',
'slideSpeed' => ( $slide_speed != '' ) ? $slide_speed : '600',
'controlNav' => ( $control_nav == 'true' ),
'prevNextNav' => ( $prev_next_nav == 'true' ),
'slideshow' => ( $slideshow == 'true' ),
'random' => ( $random == 'true' ),
'touch' => ( $touch != 'false' ),
'pauseOnHover' => ( $pause_on_hover == 'true' )
);
$data = cs_generate_data_attributes( 'slider', $js_params );
$output = "<div class=\"{$class}{$no_container}\">"
. "<div {$id} class=\"x-flexslider x-flexslider-shortcode x-flexslider-shortcode-{$count}\" {$data} {$style}>"
. '<ul class="x-slides">'
. do_shortcode( $content )
. '</ul>'
. '</div>'
. '</div>';
return $output;
}
add_action('wp_head', 'update_slider_element');
function update_slider_element() {
remove_shortcode( 'x_slider' );
add_shortcode( 'x_slider', 'custom_x_shortcode_slider' );
}
// =============================================================================
Please be very careful in copying and pasting of the codes above. Invalid quotes or other character may return a fatal error or a white blank screen.
We would loved to know if this has work for you. Thank you.