Remove "all" category from Project portfolio

Hello,

I am currently showing a portfolio with 2 categories plus the additional “all” category that automatically generates. Is it possible to eliminate the “all” category? Thanks!

Yes, it’s possible. Add the below CSS code to Appearance > Customize > Additional CSS from your site dashboard.


.dslc-post-filter[data-filter-id="show-all"] {
  display: none;
}

Regards,
Kharis

Great, this worked!

How do I set a particular category as the default one shown? I have two categories, “in memory” and “in service”. Currently the “in memory” is the default, but I’d like it to be “in service”.

Thanks a bunch!

Awesome!

I am sorry, it isn’t an easy task to accomplish. It require deep inspection in the Live Composer core code which take much time. It also would involve some code modifications/additions. Since it’s considered as an advanced task and goes beyond our support policy, it prevents to suggest you with the working code solution. However, I can point you to find a coder on upwork.com or codeable.io.

Thank you for your understanding.

Regards,
Kharis

Do the categories show up alphabetically? Seems that could be the case. Maybe I can modify the category names to get the one I want to show up as the default.

Hello there,

Edit your projects element through live composer, to arrange the category name, find the “Order By” dropdown.

Regards,
Kharis

Hi Kharis!

Just want to confirm before I close this thread out…

The code you gave me removed the ‘all’ category from being shown on the page, however, the page still still defaults to showing all the projects (we just don’t see the ‘all’ button anymore). Here’s the current situation:

‘all’ - button not shown but is default category and all projects show up on page.
‘in memory’ - category and button
’in service’ - category and button

Now that the ‘all’ button is hidden, I would like to have the ‘in service’ category be the default (whereas the ‘all’ category is currently the default).

Possible/not possible? Thanks!

Hello there,

It isn’t possible, I am afraid. Live Composer doesn’t have such that feature yet. And also there’s no custom code we can apply.

Regards,
Kharis

Hi Kharis.

Two years later… another solution?
I faced the same problem: My customer got much portfolio-items and didn’t want to show them all on one site.
So we want to disable ‘All items’ and define another default category.
CSS made it with the menuitem, but how to change to another default-category?

You can take a look here https://lichtfilmkonzepte.de/#pg-12-3
The first category “Alle” comes automatic as default, the second “Alle” should be the one, we wanna see as first and default.

Maybe it could be resolved by an JS wich ‘clicks’ the wanted category after the site is shown?
I’m not able to built the needed JS but open for a hint…:wink:

Thanks for your support,
Jörg

Hello there,

I saw you’re running Sydney Pro theme. To change the default active project category, try doing the below steps:

  1. Install and activate the TC Custom JavaScript plugin
  2. Go To Appearance > Custom JavaScript
  3. Paste the following code into the provided box
    jQuery(function($) {

      if ( $('.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: '.image-showroom', // Default 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'));
          });

          $(window).load(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;

          });

        });

      }

    });
  1. Update

Regards,
Kharis

Hi Kharis.

Thanks for your support, that works.
But I didn’t really like an two years old Plugin and want to integrate it in my functions.php.
Also I only want the script in the needed page (HOME) and not in other pages like ‘Impressum’…

Can you ‘see’ why the following code in the functions.php of my child-theme didn’t work?
No matter if I use is_single or is_home…

function ple_hook_javascript() {
  //if ( is_single ('12') ) { 
  if ( is_home() ) {
  ?>
  
<script type="text/javascript">
jQuery(document).ready(function( $ ){
  if ( $('.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: '.alle-showroom', // Default 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'));
	  });
	  $(window).load(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;
	  });
	});
  }
});
</script>

<?php
  }
}
add_action( 'wp_footer', 'ple_hook_javascript' );

Hello there,

is_home() tag checks whether the query is only for posts index page or blog page. For static front page, use is_front_page().

Regards,
Kharis

Hi Kharis.

Thanks for your support…
Now the script comes only into the footer of the frontpage.
But it’s not working :frowning:

I Think it starts to early, because I can see a short ‘change’ in the shown projects but no filtering when I take a look at the portfolio-area while pageloading…

Instead of

jQuery(document).ready(function( $ ) {

I tried also

jQuery(window).load(function( $ ) {

and

(function($) {
 ...
})(jQuery);

But nothing does the job as the Plugin, where the same code worked well?

Hello there,

This line of code defines which default category to show at initial page load.

  filter: '.alle-showroom', // Default filter

It looks like .alle-showroom is attributed to All Categories. Try specific category like .werbung-showroom

  filter: '.werbung-showroom', // Default filter

See if it works.

Regards,
Kharis

Hi Kharis.

It doesn’t. :.(

For testing I inserted an alert(":)"); right after the jQuery(document)-Line
expecting, that the alert will come when the site was loaded, but it comes immediately.
So I think the script didn’ wait for the page loaded…

For test I changed the default category to .produkt-showroom
but again I can see a short twitch but not more…

Any other ideas?

Regards,
Jörg