[Resolved] Custom CSS Classes and generate_do_element_classes()

[Stephane Bergeron]

Hi,

The new generate_do_element_classes() has been added in GP 2.2. I never used the previous functions this replaces so I don’t know where to start looking for them to see how I might use the new one.

What I’m trying to do is add an additional CSS class to the main element in WooCommerce shop pages (it’s for FacetWP). In Genesis, I would use this:

add_filter( 'genesis_attr_content', 'zw3_main_content_add_class' );
function zw3_main_content_add_class( $attributes ) {

	// add original plus extra CSS classes
	if( is_shop() ) {
		$attributes['class'] .= ' facetwp-template';
	}

	// return the attributes
	return $attributes;

}

This is a specific filter to target the specific element but you get the idea. How can I achieve the same in GP with generate_do_element_classes?

Thanks!

[Tom]

Hi there,

In GP, you would do this:

add_filter( 'generate_main_class', function( $classes ) {
    if ( function_exists( 'is_shop' ) && is_shop() ) {
        $classes[] = 'facetwp-template';
    }

    return $classes;
} );

Let me know 🙂

[Stephane Bergeron]

Thanks Tom! Works great of course 🙂

But I see that, like Genesis, it seems to be a specifically named filter. Is there a list of them in the docs somewhere. Of course, if they are all named as obviously as this one, I can infer pretty much any other 😉

[Tom]

Each element has an ID, which is the parameter in the generate_do_element_classes() function.

You can find them by looking at the code itself: https://github.com/tomusborne/generatepress/search?q=generate_do_element_classes&unscoped_q=generate_do_element_classes

The filter name always has the ID in the middle: generate_{$id}_class

We need a list of these added in the docs 🙂

[Stephane Bergeron]

Can never have too many details in the docs 🙂

Thank you very much!!

[Tom]

You’re welcome 🙂

[Author]

Posts