I found the cause of the problem, but I haven’t figured out how to fix it completely, yet.
In this article, it says that since WP v. 6.0, the block CSS is loaded in the head, so that if you “use do_blocks() after wp_head(), WordPress does not load the block CSS.”
I did a file comparison of my custom template page and another page, and discovered that there is a lot of styles missing from the head.
I moved the content up just before wp_head() is called like this:
<?php
$block_content = do_blocks( '
<!-- wp:group {"layout":{"type":"constrained"}} -->
<div class="wp-block-group">
<!-- wp:post-content /-->
</div>
<!-- /wp:group -->'
);
wp_head();
?>and confirmed that it added the additional CSS between the <head></head> tags:
<style id='wp-block-paragraph-inline-css'>
.is-small-text{font-size:.875em}.is-regular-text{font-size:1em}.is-large-text{font-size:2.25em}.is-larger-text{font-size:3em}.has-drop-cap:not(:focus):first-letter{float:left;font-size:8.4em;font-style:normal;font-weight:100;line-height:.68;margin:.05em .1em 0 0;text-transform:uppercase}body.rtl .has-drop-cap:not(:focus):first-letter{float:none;margin-left:.1em}p.has-drop-cap.has-background{overflow:hidden}p.has-background{padding:1.25em 2.375em}:where(p.has-text-color:not(.has-link-color)) a{color:inherit}
</style>
<style id='wp-block-post-content-inline-css'>
.wp-block-post-content a:where(:not(.wp-element-button)){color: var(--wp--preset--color--secondary);}
</style>
<style id='wp-block-group-inline-css'>
.wp-block-group{box-sizing:border-box}
</style>Now, I have to figure out how to get it to do the same for the header, footer, and comments…
I’m going to mark this as resolved, as I now know the problem is that the block CSS for the header and footer are not being loaded, and I think the issue is not limited to the Twenty Twenty Three theme, but to any block theme that I try to add a custom page template to.
I’m going to post a question in Developing WordPress if I can’t find the issue on my own.
