DescriptionDescription
This filter is called before to display a facet on render or refresh.
It allows to modify the output of facets.
ArgumentsArguments
Argument | Type | Description |
$html | string | Facet HTML markup |
$facet_id | integer | 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 );