Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Upgrade Gutenberg 12.7 + do_blocks() for template part = display:flex CSS property not loaded anymore #39217

Closed
base-creme opened this issue Mar 4, 2022 · 3 comments
Closed

Upgrade Gutenberg 12.7 + do_blocks() for template part = display:flex CSS property not loaded anymore #39217

base-creme opened this issue Mar 4, 2022 · 3 comments
Labels
Global Styles Anything related to the broader Global Styles efforts, including Styles Engine and theme.json [Status] Duplicate Used to indicate that a current issue matches an existing one and can be closed

Comments

@base-creme
Copy link

Description

Hi everybody,

I'm running into an issue since I upgraded Gutenberg from 12.6.1 to 12.7.
The whole site displays properly but one not : the one based on a custom template part.

Here is the code I use for my template part :

<!doctype html>
<html <?php language_attributes(); ?>>
<head>
<meta charset="<?php bloginfo( 'charset' ); ?>">
<meta name="viewport" content="width=device-width, initial-scale=1" />
<?php wp_head(); ?>
</head>
<body <?php body_class(); ?>>
<?php wp_body_open(); ?>
<div class="wp-site-blocks">
<?php
echo do_blocks( '<!-- wp:template-part {"slug":"header","theme »:"my-theme","tagName":"header","className":"","layout":{"inherit":true}} /-->' );

// Start the loop.
while ( have_posts() ) : the_post();

// Include the single post content template.
get_template_part( 'template-parts/my-template-part', 'single' );

// End of the loop.
endwhile;

echo do_blocks('<!-- wp:template-part {"slug":"footer","theme »: »my-theme","tagName":"footer","className":"site-footer","layout":{"inherit":true}} /-->');

?>
</div>
<?php wp_footer(); ?>
</body>
</html>

I noticed that every block in it using display:flex are not displayed properly in header and footer.
In fact, the CSS property display:flex isn't loaded !
Seems that the issue comes from the « row » Gutenberg block.

Here are some screenshots, for one of the buggy elements:

Code from a page that runs properly :
Capture d’eěcran 2022-03-03 aĚ 21 02 58

Code from the page with bugs :
Capture d’eěcran 2022-03-03 aĚ 21 00 29

Do you have any idea of how to resolve this ?

Running WP 5.9.1
Gutenberg 12.7.0

Thank you very much for your help !

Step-by-step reproduction instructions

  1. Using the custom template part with the do_blocks() function (source: https://fullsiteediting.com/lessons/how-to-use-php-templates-in-block-themes/)
  2. Use some "row" Gutenberg elements
  3. Upgrade from Gutenberg 12.6.1 to 12.7

Screenshots, screen recording, code snippet

No response

Environment info

Running WP 5.9.1
Gutenberg 12.7.0

Please confirm that you have searched existing issues in the repo.

Yes

Please confirm that you have tested with all plugins deactivated except Gutenberg.

Yes
@Mamaduka
Copy link
Member

Mamaduka commented Mar 4, 2022

Thanks for contributing, @base-creme.

I think this issue is similar to what @carolinan reported in #39207.

@base-creme
Copy link
Author

Indeed. Thank you !

@Mamaduka
Copy link
Member

Mamaduka commented Mar 4, 2022

I will close this as a duplicate and link it into the original issue if that's okay with you.

@Mamaduka Mamaduka added [Status] Duplicate Used to indicate that a current issue matches an existing one and can be closed Global Styles Anything related to the broader Global Styles efforts, including Styles Engine and theme.json labels Mar 4, 2022
@Mamaduka Mamaduka closed this as completed Mar 4, 2022
@Mamaduka Mamaduka mentioned this issue Mar 4, 2022
Closed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
Global Styles Anything related to the broader Global Styles efforts, including Styles Engine and theme.json [Status] Duplicate Used to indicate that a current issue matches an existing one and can be closed
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
2 participants
@Mamaduka @base-creme