Change to function.js in update

Hello

I have a child theme of the sydney pro parent theme. I have an archive page where i am using the sydney gallery filter buttons to filter pictures like in the demo. After a recent update to the theme i lost the functionality of those filter buttons. I looked at the console for errors. it points to something in the function.js. Is there a way to resolve this for me so it works in my child theme again? what code should i change?

Hello,

First thanks for using our Sydney Pro theme!

Sorry but we couldn’t reproduce the issue here. Could you please share with us your website link/URL? So we can do a inspection, do some tests and send the best solution for you.

Kind Regards,

Rodrigo.

aThemes Support

Thanks for the support

https://mediastudies.ugis.berkeley.edu/people/

I have not updated the Sydney theme on this site - so the filtering functionality works (as example)
https://as.ugis.berkeley.edu/people/

Hello,

Thanks for the link!

Please try following the steps below:

  1. Install and activate the TC Custom JavaScript plugin
  2. Go To Appearance > Custom JavaScript
  3. Paste the following code into the provided box

    (function($){
        if ( $('body').hasClass('post-type-archive-people') && $('.project-wrap').length ) {

    	    $('.project-wrap').each(function() {

    	        var self       = $(this);
    	        var filterNav  = self.find('.project-filter').find('a');

    	        var projectIsotope = function($selector){

    	          $selector.isotope({
    	            filter: '*',
    	            itemSelector: '.project-item',
    	            percentPosition: true,
    	            animationOptions: {
    	                duration: 750,
    	                easing: 'liniar',
    	                queue: false,
    	            }
    	          });

    	        }

    	        self.children().find('.isotope-container').imagesLoaded( function() {
    	          projectIsotope(self.children().find('.isotope-container'));
    	        });

    	        filterNav.click(function(){
    	            var selector = $(this).attr('data-filter');
    	            filterNav.removeClass('active');
    	            $(this).addClass('active');

    	            self.find('.isotope-container').isotope({
    	                filter: selector,
    	                animationOptions: {
    	                    duration: 750,
    	                    easing: 'liniar',
    	                    queue: false,
    	                }
    	            });

    	            return false;

    	        });

    	    });

        }
    })(jQuery);

We hope this helps!

Please try that and let us know if you need further assistance.

Kind Regards,

Rodrigo.

aThemes Support

1 Like

This worked!! Thanks for the great support and the JS code.

1 Like