Use template directory in bird flight path pattern

[kjellr]

While trying out some child themes for Twenty Twenty-Two, I discovered that the flying bird header image used in the theme's header-large-dark.html template shows a 404 when its used in a child theme. It's being pulled from a pattern that references the image via get_stylesheet_directory_uri():

twentytwentytwo/inc/patterns/hidden-heading-and-bird.php

Line 19 in 843eae4

<figure class="wp-block-image alignfull size-full"><img src="' . esc_url( get_stylesheet_directory_uri() ) . '/assets/images/flight-path-on-transparent-c.png" alt="' . esc_attr__( 'Illustration of a bird flying.', 'twentytwentytwo' ) . '"/></figure>

If we switch to get_template_directory_uri(), it works again. This isn't usually necessary (all of the other patterns work fine), but I think this generally makes sense, since this pattern only exists so that it can be used in a template.

[jffng]

I know the other patterns don't break, but can you think of any other patterns where it would make sense to update the image path to use get_template_directory_uri?

Maybe it makes sense to update all of the dynamic URLs to use get_template_directory_uri, to be safe.

[kjellr]

Yeah, I'm not entirely sure. Twenty Twenty-Two uses stylesheet_directory_uri so I think that is technically a fine way to do it? I'd be interested in some insight from other theme devs too.

[justintadlock]

I would use get_theme_file_uri() for any image references. That way, child themes could actually overwrite the image while falling back to the template directory.

https://developer.wordpress.org/reference/functions/get_theme_file_uri/

[kjellr]

I like that suggestion, thanks @justintadlock. It doesn't seem to fix the template issue though. When I switch to that, I still see a broken header image for our templates.

Also, I took a closer look and we've been were inconsistent in the way we've been referencing images for patterns — I took a closer look and some were already using get_template_directory_uri(), while most were using get_stylesheet_directory_uri(). 😕 Might be worth switching everything except for these template-centric patterns to get_theme_file_uri() in a separate PR.

[kjellr]

Closing in favor of #283.