Callback function for slider

  • Resolved emj

    (@emj)


    4 years, 8 months ago

    Hi,

    I am loading your fagsfacf slider in my wordpress post archive. e.g. i have post title, link the post, and a slider of images related that that post.

    It looks great! However i am using the Ajax Load More (ALM) plugin to lazy load these posts on my archive page. The posts are lazy loading correctly, however the slider is not.

    I contacted the ALM developer and he suggested I could fix it by adding a Callback function:
    https://connekthq.com/plugins/ajax-load-more/docs/callback-functions/almcomplete/

    Are you able to help me write this function? Unfortunately i cant get it working.

    Can i email you my URL to preview what i mean? The archive page is live but behind a login.

    Thank you!

Viewing 6 replies - 1 through 6 (of 6 total)
  • Thread Starter emj

    (@emj)

    Also, plugin developer said:

    “You need to know the function to call to initiate the sliders”

    Thanks

    Hello,

    If you want to change js code as per your requirement then we have initialized js code in our plugin js file.
    Please check the below-listed path of js in our plugin.

    Go to wp-content -> plugins -> frontend-gallery-slider-for-advanced-custom-field -> assets -> js -> fagsfacf-public.js.

    Note:- If you update the plugin in the feature then your changed core plugin file change will be lost.

    Thanks,

    Thread Starter emj

    (@emj)

    Thank you for replying.

    Can you please tell me how to start the sliders in an Ajax call?

    Hello,

    You can reinitialize the slider by using this code.
    You cad add below custom code in you any custom js file
    Please try this code

    window.almComplete = function(alm){
   $( '.fagsfacf-slider' ).each(function( index ) {

		var sconf       = {};
		var slider_id   = $(this).attr('id');
		var slider_conf = $.parseJSON( $(this).parent('.fagsfacf-slider-wrap').find('.fagsfacf-slider-conf').text());
		
		jQuery('#'+slider_id+' .fagsfacf-gallery-slider').slick({
			dots			: (slider_conf.dots) == "true" ? true : false,
			infinite		: true,
			arrows			: (slider_conf.arrows) == "true" ? true : false,
			speed			: parseInt(slider_conf.speed),
			autoplay		: (slider_conf.autoplay) == "true" ? true : false,
			autoplaySpeed	: parseInt(slider_conf.autoplay_speed),			
			rtl             : (slider_conf.rtl) == "true" ? true : false,
			adaptiveHeight  : true,					
		});
	});
	
	$( '.fagsfacf-carousel' ).each(function( index ) {

		var sconf       = {};
		var slider_id   = $(this).attr('id');
		var slider_conf = $.parseJSON( $(this).parent('.fagsfacf-carousel-wrap').find('.fagsfacf-carousel-conf').text());
		
		jQuery('#'+slider_id+' .fagsfacf-gallery-carousel').slick({
			dots			: (slider_conf.dots) == "true" ? true : false,
			infinite		: true,
			arrows			: (slider_conf.arrows) == "true" ? true : false,
			speed			: parseInt(slider_conf.speed),
			autoplay		: (slider_conf.autoplay) == "true" ? true : false,
			autoplaySpeed	: parseInt(slider_conf.autoplay_speed),
			slidesToShow	: parseInt(slider_conf.slide_to_show),
			slidesToScroll	: parseInt(slider_conf.slide_to_scroll),
			rtl             : (slider_conf.rtl) == "true" ? true : false,
			adaptiveHeight  : true,
			mobileFirst    	: (Fagsfacf.is_mobile == 1) ? true : false,
			responsive: [{
				breakpoint: 1023,
				settings: {
					slidesToShow: 2,
					slidesToScroll: 1,
					infinite: true,
					dots: false
				}
			},{

				breakpoint: 767,	  			
				settings: {
					slidesToShow: 2,
					slidesToScroll: 1
				}
			},
			{
				breakpoint: 479,
				settings: {
					slidesToShow: 1,
					slidesToScroll: 1,
					dots: false
				}
			},
			{
				breakpoint: 319,
				settings: {
					slidesToShow: 1,
					slidesToScroll: 1,
					dots: false
				}	    		
			}]
		});
	});
};
    Thread Starter emj

    (@emj)

    Thank you. I tried and get this error:

    slick.min.js?ver=1.4:1 Uncaught TypeError: Cannot read property ‘add’ of null
    at Object.e.initADA (slick.min.js?ver=1.4:1)
    at Object.e.init (slick.min.js?ver=1.4:1)
    at new <anonymous> (slick.min.js?ver=1.4:1)
    at a.fn.init.i.fn.slick (slick.min.js?ver=1.4:1)
    at HTMLDivElement.<anonymous> ((index):1327)
    at Function.each (jquery.js?ver=1.12.4-wp:2)
    at a.fn.init.each (jquery.js?ver=1.12.4-wp:2)
    at window.almComplete ((index):1321)
    at a.<anonymous> (ajax-load-more.min.js?ver=5.2.0:1)
    at a.e.emitEvent (ajax-load-more.min.js?ver=5.2.0:19)

    Anything else i can try? Thank you ??

    Hello,

    Can you please share your page URL where you facing the issue.

    Thanks

Viewing 6 replies - 1 through 6 (of 6 total)
  • The topic ‘Callback function for slider’ is closed to new replies.