This topic is: resolved

This topic contains 1 reply, has 2 voices, and was last updated by Profile photo of DeoSupport DeoSupport 1 month, 2 weeks ago.

Portfolio Filter

  • Profile photo of sam ip
    Post count: 7

    Now I am using the filter theme to design a homepage,
    the current problem I am facing which is the default setting will display “all” work items once the page onload,
    how could I make the page only display one specific category, when the page onloaded before clicking any button?
    please help, S

    Profile photo of DeoSupport
    Post count: 587

    Hello.

    It can be achieved with a bit of jQuery. Edit scripts.js, find isotope filter and replace it with this:

    
    // Isotope filter
      var $portfolioFilter = $('#portfolio-grid, #masonry-grid');
      var filterValue = $('.portfolio-filter a').attr('data-filter');
      
      $portfolioFilter.isotope({ filter: filterValue });
    
      $('.portfolio-filter').on( 'click', 'a', function(e) {
        e.preventDefault();
        var filterValue = $(this).attr('data-filter');
        $portfolioFilter.isotope({ filter: filterValue });
        $('.portfolio-filter a').removeClass('active');
        $(this).closest('a').addClass('active');
      });
    

    In HTML remove the all filter and add class active in the category that you want to be active on load.

    
    <a href="#" class="filter active" data-filter=".web-design">Web Design</a>
    

    Cheers.

Tagged: 

You must be logged in to reply to this topic.