/facet/html

DescriptionDescription

This filter is called before to display a facet on render or refresh.

It allows to modify the output of facets.

ArgumentsArguments

ArgumentTypeDescription
$html stringFacet HTML markup
$facet_idinteger Facet id

ExamplesExamples

Replace facet contentReplace facet content

The following example demonstrates how to replace content in a facet.

PHP
functions.php
function replace_facet_content( $html, $facet_id ) {

	// If it matches facet id 1, we replace content in facet HTML.
	if ( 1 === $facet_id ) {
		$html = str_replace( 'Facet string', 'Another string', $html );
	}

	return $html;

}
add_filter( 'wp_grid_builder/facet/html', 'replace_facet_content', 10, 2 );

Add facet iconsAdd facet icons

The following example demonstrates how to add an image label of a button facet.

PHP
functions.php
function add_facet_icons( $html, $facet_id ) {

	// If it does not match facet id 1.
	if ( 1 !== $facet_id ) {
		return $html;
	}

	// Define images associated with the facet labels.
	$facet_labels = [
		'Category 1' => '<img src="mywebsite.com/img-1.jpg" alt="">',
		'Category 2' => '<img src="mywebsite.com/img-2.jpg" alt="">',
		'Category 3' => '<img src="mywebsite.com/img-3.jpg" alt="">',
		'Category 4' => '<img src="mywebsite.com/img-4.jpg" alt="">',
		'Category 5' => '<img src="mywebsite.com/img-5.jpg" alt="">',
	];

	foreach ( $facet_labels as $facet_label => $image ) {
		$html = str_replace( '>' . $facet_label, '>' . $image . $facet_label, $html );
	}

	return $html;

}
add_filter( 'wp_grid_builder/facet/html', 'add_facet_icons', 10, 2 );

Hide facet conditionallyHide facet conditionally

The following example demonstrates how to hide a facet conditionally depending on the values selected in anther facet.

PHP
functions.php
function hide_facet_conditionally( $html, $facet_id ) {

	$facet_to_compare = 'facet_slug';  // You have to change "facet_slug" with the facet slug to compare with.
	$value_to_compare = 'facet_value'; // You have to change "facet_value" with the value to compare with (value added to the URL).
	$facet_to_hide    = 1234;          // You have to change "1234" with the id of the facet to hide.

	if ( $facet_to_hide !== $facet_id ) {
		return $html;
	}

	// Get selected facet values to compare with.
	$selected_values = wpgb_get_selected_facet_values( $facet_to_compare );

	// If the value to compare exists in one of the selected values of the facet to compare with.
	if ( in_array( $value_to_compare, $selected_values, true ) ) {
		$html = '';
	}

	return $html;

}
add_filter( 'wp_grid_builder/facet/html', 'hide_facet_conditionally', 10, 2 );