SOLVED: Header & Footer Attribute

Feature Requests / Improvements
1

Hello @thomas @timmse ,
Is there any chance to add custom attribute to header and footer tag?

This will be really helpful especially for Schema.

Bricks Header:

image
image819Ă—38 4.26 KB

Blocksy Header with Schema WPHeader:

image
image877Ă—121 10.8 KB

2 Likes
2

Great question. I prefer not to start providing a specific setting for this. As its best to overhaul the header & footer templates itself. Allowing you to construct the header and footer tags as you wish. That way you’ll be able to add any HTML attribute yourself. I do not have an ETA nor target version if/when we will implement this.

2 Likes
3

Wow that cool. So no more header and footer by default. No problem, you already answered it well, I appreciate it.

Waiting 1.5 stable version to continue my workflow. The first builder that fulfills many of my needs.

4

Header attributes can be added like this:

// Add attributes to header using bricks/render_header filter.
add_filter( 'bricks/render_header', function( $header_html ) {
	return str_replace( '<header', '<header itemscope itemtype="https://schema.org/WPHeader"', $header_html );
});

CleanShot 2022-07-24 at 09.52.37@2x
CleanShot 2022-07-24 at 09.52.37@2x1114Ă—120 62.3 KB

3 Likes
5

If I want to add a class to main? What code should I use?

6

Thanks, that really helpful.

7

Don’t see a filter for that.

You’ll have to copy the template files from Bricks to the child theme and add in those.

8

Thank you! Let me check.

9

Modifying the header attributes as @Sridhar showed using the bricks/render_header filter is currently to best way.

We’ll make sure to provide two new filters in 1.5-stable to allow modifying the header & footer attributes like this:

add_filter( 'bricks/header/attributes', function( $attributes ) {
	// Add custom class to header
	if ( is_array( $attributes['class'] ) ) { 
		$attributes['class'][] = 'my-header-class';
	}

	// Add 'data-is-header' HTML attribute to header with value 'y'
	$attributes['data-is-header'] = 'y';

	return $attributes;
} );

add_filter( 'bricks/footer/attributes', function( $attributes ) {
	// Add 'data-is-footer' HTML attribute to footer with value 'y'
	$attributes['data-is-footer'] = 'y';

	return $attributes;
} );
6 Likes
10

Hi @thomas, good to hear that.

Is there an estimate when 1.5 will be released?

11

I don’t mean to be rude, but you have asked this question numerous times now and always get the same answer - when its ready.

12

That fine, but FYI just twice :smiley:
I mean, maybe we have some estimate when it’s release like previously I hear about BETA version.

13

Thanks, @thomas

I also want to have these codes for the <main> tag. Will you please provide the filter for the main tag as well?

2 Likes
14

Thomas just posting on Facebook about release 1.5 RC next week. So 1.5 Stable atleast around Aug.

I got my answer.

15

I’ve checked the main tag right away, of course :sunglasses:

It’s a bit more involved as it occurs in various parts of the WordPress templating engine. I’ll see if I can squeeze it in 1.5. But more likely in 1.5.1.

@iqbalmauludy We’ll do a 1.5-rc (release candidate) next week. That one will include the new filters already.

@alanj Yep, “it’s ready when it’s ready” is unfortunately the standard answer in software development. But it’s also true. As every day we are working on solving problems we haven’t solved before.

5 Likes
16

That awesome @thomas, thank you.

17

Yay, this is incuded too in 1.5 :heart_eyes:

18

@jornes Included the new filter for the main tag in 1.5 RC as well:

3 Likes
19

Thanks a lot for the new filer! @thomas

That’s awesome.
I am updating 1.5Beta to RC to my staging site, and nothing seems to break(just need to set something for the DIV element, as you suggested).

Appreciate your hard work and your teammates @timmse @luistinygod as well.

1 Like
20

Really happy can jump to this forum. Never doing that before :rofl: