How to reduce the number of DOM elements

Anonymous

#266877

Hi,

we use the Search & Filter Pro on our website to filter a custom posttype (sneakers) with 5 taxonomies (brand, model, color, target audience, age). We created a custom archive for each of these 5 taxonomies.
We only created one “search form”.

In the archive for a specific model for example we call the Search & Filter Pro filters using :

$sf_current_query = $searchandfilter->get(7183946)->current_query();

We get a nice list of sneakers that match the current model. But what it also shows if we call the filter using a shortcode (<?php echo do_shortcode( ‘[searchandfilter id=”7183946″]’ ); ?>) – so we can filter on color, target audience and age, the brand and model also are there. From a user experience we find this obsolete so we have hidden it using css override in the archive page :

<style>
select[name=”_sft_brand[]”] {
display : none;
}
select[name=”_sft_model[]”] {
display : none;
}
</style>

Unfortunately this results in our page having a lot of (irrelevant) DOM elements which we would like to exclude. This is because all brands and models are still available in the filter (while hidden using CSS). Please note we have a lot of brands and models and we want to keep the page as clean as possible.

How can we achieve this? Is there a way we can eliminate the DOM elements of brand and model on this particular taxonomy archive? For example on the model taxonomy we want to filter out the brand and model and on the brand page we want to disable the brand.

Mark

PS. Please check https://www.solezilla.nl/model/nike-air-max-90/ for an example

Trevor

#266970

You can use this filter to edit the form fields:

https://searchandfilter.com/documentation/action-filter-reference/#filter-input-object

Anonymous

#266981

Hi Trevor,

nice to hear this is possible and thanks for pointing me out in a direction. I looked at the code on https://gist.github.com/rmorse/7b59b45a14b1ca179868

Three questions remain :
– Do I need to setup the hook to the filter on the archive template of the taxonomy? (where the query is run and shortcode is posted)?
– Will this effect the way the filter is used on other pages?
– How would the code look like when we want to filter out the brand selection when we are on a specific archive of the brand taxonomy (_sft_brand)?

Would it be possible for you to share an example code how this can work?

Would be great if you where able to do so for us.

Thanks a bunch!

Mark

Trevor

#266986

Hi

The code goes in the child theme functions.php file.

There you can check which page you are on before making changes. Tis forum search will provide other snippets, but you need to experiment with the code and see what you wrote does:

https://support.searchandfilter.com/forums/search/sf_input_object_pre+function/

Anonymous

#267025

Mmm.. I have giving this some additional thoughts.

To rule out the values that are not relevant is already happening in the filter.

It can be set by selecting “Hide empty terms?” in the Search Form UI for each taxonomy that is added. But unfortunately the default “hidden” option offered by Search & Filter Pro is by hiding the select options by using CSS. On larger scale websites, such as ours, this results in these hidden options in the source code of the website. This is obsolete code which makes this plug-in a culprit from a SEO perspective. Not only is the HTML overhead pretty heavy on this, it also make the source code less relevant to the topic / subject. Especially if you are using taxonomy archives.

To cut it short. I hope you can help to get this function in a next release and support this idea.

Meanwhile I will check if I can make this work using the code and pages suggested. I already explored them and did not find the exact solution but I think I need to go for a count somewhere or do a rule out on parsing any options that are not “sf-option-active”.

Anonymous

#267028

I got it figured out for a bit. The only thing that is not working now is filtering the childs of the models. The code now rules out every choice. Any ideas about that?

function remove_obsolete_dom_elements_from_filter($input_object, $sfid) {

/* check what taxonomy page we are on */

$taxonomy = get_query_var('taxonomy');

// Business rules :
//
// On brand taxonomy page (data-current-taxonomy-archive=brand) 
// - remove brands
// - remove non-selected brand related models (count?)  
//
// On model taxonomy page  
// - remove brands
// - remove all parent models - NOT WORKING YET - removes every thing - want to show current parent and underlying childs
// 	

//make sure we affect the '_sft_brand' field only, and only in form ID 44286

	if ($taxonomy == "brand") {
		if(($input_object['name']!='_sft_brand')||($input_object['type']!='select')) {
 		return $input_object;
		}
  
		if(!isset($input_object['options'])) {
		return $input_object;
		}
		
		if( $sfid == 44286 && $input_object['name']=='_sft_brand' )	{
		unset($input_object['options']);
		return $input_object;
		}
	}
	
	elseif ($taxonomy == "model") {
		
		if(($input_object['name']!='_sft_model')||($input_object['type']!='select')) {
 		return $input_object;
		}
  
		if(!isset($input_object['options'])) {
		return $input_object;
		}
		/*
		if( $sfid == 44286 && $input_object['name']=='_sft_brand' )	{
		unset($input_object['options']);
		return $input_object;
		} */
		if( $sfid == 44286 && $input_object['name']=='_sft_model' )	{
		unset($input_object['options']); // only unset not selected "parents" - how to do that?
		return $input_object;
		}
	}
	
	else {
		return $input_object;
	}
}

add_filter('sf_input_object_pre', 'remove_obsolete_dom_elements_from_filter', 10, 2);

Anonymous

#267030

Sorry.. This was a hurray to early. When I filter the available filters (target audience, color, etc) it looses the selected choices.. this is harder than I imagined.

Trevor

#267119

I have referred this question to the plugin developer, Ross, for his input.

Anonymous

#267128

Thanks!

Ross Moderator

#267181

Hi Mark

So our plugin, with auto count enabled, and hide empty set on your fields, should work fine for hiding non relevant options.

However, I think the issue you are running into is the fact that search form will still display a field, even if there are no options?

Right now, thats the way it works – that filter won’t quite achieve what you want…

All I can say is, we’re adding this to v3 (an option, “if there are no options, hide the field ( + heading ) completely” )

That will be a couple of months away.

Thanks

[Author]

Posts