Archived topic
Adding custom class to core GP sections via php in child template files
3 replies · Started by Matthew on October 29, 2021
Hi, thanks for everything, quick question. I am moving a site to GeneratePress that already has an all-encompassing custom stylesheet. It is built with Tailwind so the entire thing is <10kb and every class is referenced like this:
.bg-gray-50{--tw-bg-opacity:1;background-color:rgba(249,250,251,var(--tw-bg-opacity))}
.border-white{--tw-border-opacity:1;border-color:rgba(255,255,255,var(--tw-border-opacity))}
.text-gray-500{--tw-text-opacity:1;color:rgba(107,114,128,var(--tw-text-opacity))}The question is, how can I apply all of these classes to GP without having to replicate any code, or add hundreds of GP classes like "generate-columns" to the original stylesheet? I would like to be able to add these custom classes to core GP sections such as site-header, site-info, etc to avoid an abundance of inline code.
I thought that by copying /inc/structure/footer.php to the child theme and modifying it I would be able to make changes. However, maybe I am modifying it incorrectly, or maybe child themes do not detect files buried in this folder structure. Either way, nothing I do seems to make any changes. Originally I had hoped it would be as simple as something like modifying the code below, but obviously I was mistaken:
<footer <?php generate_do_attr( 'site-info','bg-gray-50' ); ?>>
Any suggestions or recommendations for the best course of action would be greatly appreciated, thank you!
Hi there,
That function comes with filters: generate_do_attr()
It's new in 3.1 so we don't have documentation on it yet, but it works like this:
1. Note the first parameter - site-info in your example.
2. Add the filter and reference that ID:
add_filter( 'generate_parse_attr', function( $attributes, $context ) {
if ( 'site-info' === $context ) {
$attributes['class'] .= ' my-custom-class';
}
if ( 'another-id' === $context ) {
$attributes['class'] .= ' another-custom-class';
}
return $attributes;
}, 10, 2 );This system works with any HTML attributes, so you can do things like: $attributes['id'] = 'custom-id'; or $attributes['data-something'] = 'else';
Hope this helps!
Tom, you are an absolute legend! That helps immensely, exactly what I was looking for.....thanks a million! :D
Glad I could help! :)
