🐞 fix: Migrate blocks to use helper function for wrapper classes

This commit is contained in:
Keith Solomon
2025-11-20 10:20:29 -06:00
parent 974cb70b5e
commit 38ec5f850d
11 changed files with 53 additions and 90 deletions

View File

@@ -31,6 +31,26 @@ function getFieldValue( $field_path ) {
return $field; return $field;
} }
/**
* Returns wrapper attributes for a block for both preview and front-end contexts.
*
* @param string $classes Space separated class list.
* @param bool $is_preview Whether the block is being previewed in the editor.
*
* @return string Wrapper attributes ready for output.
*/
function blockWrapperAttributes( $classes, $is_preview ) {
if ( $is_preview ) {
return 'class="' . $classes . '"';
}
return get_block_wrapper_attributes(
array(
'class' => $classes,
)
);
}
// Add Global Fields options page. // Add Global Fields options page.
if ( function_exists( 'acf_add_options_page' ) ) { if ( function_exists( 'acf_add_options_page' ) ) {
add_action( add_action(

View File

@@ -15,14 +15,7 @@ $accItems = get_field( 'accordion_items' );
if ( $accItems ) : if ( $accItems ) :
$classes = 'accordion'; $classes = 'accordion';
$wrapper = blockWrapperAttributes( $classes, $is_preview );
if ( ! $is_preview ) {
$wrapper = get_block_wrapper_attributes(
array( 'class' => $classes )
);
} else {
$wrapper = 'class="' . $classes . '"';
}
?> ?>
<section <?php echo wp_kses_post( $wrapper ); ?>> <section <?php echo wp_kses_post( $wrapper ); ?>>

View File

@@ -1,26 +1,26 @@
{ {
"name": "acf/boilerplate", "name": "acf/boilerplate",
"title": "Block Boilerplate", "title": "Block Boilerplate",
"description": "Boilerplate code to create ACF blocks.", "description": "Boilerplate code to create ACF blocks.",
"style": [ "style": [
"file:./boiilerplate.css" "file:./boilerplate.css"
], ],
"category": "vdi-block", "category": "vdi-block",
"icon": "block-default", "icon": "block-default",
"keywords": [ "keywords": [
"boilerplate" "boilerplate"
], ],
"acf": { "acf": {
"mode": "preview", "mode": "preview",
"renderTemplate": "boilerplate.php" "renderTemplate": "boilerplate.php"
}, },
"supports": { "supports": {
"align": false, "align": false,
"anchor": false, "anchor": false,
"color": false, "color": false,
"html": false, "html": false,
"jsx": false, "jsx": false,
"mode": false, "mode": true,
"multiple": false "multiple": false
} }
} }

View File

@@ -10,16 +10,7 @@
namespace BasicWP; namespace BasicWP;
$classes = 'boilerplate'; $classes = 'boilerplate';
$wrapper = blockWrapperAttributes( $classes, $is_preview );
if ( ! $is_preview ) {
$wrapper = get_block_wrapper_attributes(
array(
'class' => $classes,
)
);
} else {
$wrapper = 'class="' . $classes . '"';
}
?> ?>
<section <?php echo esc_attr( $wrapper ); ?>> <section <?php echo esc_attr( $wrapper ); ?>>

View File

@@ -12,14 +12,7 @@ namespace BasicWP;
$ibClasses = 'flex flex-wrap gap-4 w-full justify-center sm:justify-start'; $ibClasses = 'flex flex-wrap gap-4 w-full justify-center sm:justify-start';
$classes = 'align-with-content my-[1.2em]'; $classes = 'align-with-content my-[1.2em]';
$wrapper = blockWrapperAttributes( $classes, $is_preview );
if ( ! $is_preview ) {
$wrapper = get_block_wrapper_attributes(
array( 'class' => $classes )
);
} else {
$wrapper = 'class="' . $classes . '"';
}
?> ?>
<div id="<?php echo esc_attr( $block['id'] ); ?>" <?php echo esc_attr( $wrapper ); ?>> <div id="<?php echo esc_attr( $block['id'] ); ?>" <?php echo esc_attr( $wrapper ); ?>>

View File

@@ -10,16 +10,7 @@
namespace BasicWP; namespace BasicWP;
$classes = 'contact-info'; $classes = 'contact-info';
$wrapper = blockWrapperAttributes( $classes, $is_preview );
if ( ! $is_preview ) {
$wrapper = get_block_wrapper_attributes(
array(
'class' => $classes,
)
);
} else {
$wrapper = 'class="' . $classes . '"';
}
?> ?>
<section <?php echo esc_attr( $wrapper ); ?>> <section <?php echo esc_attr( $wrapper ); ?>>

View File

@@ -13,16 +13,7 @@ $intro = get_field( 'intro' );
$ctas = get_field( 'calls_to_action' ); $ctas = get_field( 'calls_to_action' );
$classes = 'homepage-hero mx-break-out bg-black bg-cover bg-no-repeat text-light py-12 lg:py-16 overflow-hidden'; $classes = 'homepage-hero mx-break-out bg-black bg-cover bg-no-repeat text-light py-12 lg:py-16 overflow-hidden';
$wrapper = blockWrapperAttributes( $classes, $is_preview );
if ( ! $is_preview ) {
$wrapper = get_block_wrapper_attributes(
array(
'class' => $classes,
)
);
} else {
$wrapper = 'class="' . $classes . '"';
}
?> ?>
<section <?php echo wp_kses_post( $wrapper ); ?>> <section <?php echo wp_kses_post( $wrapper ); ?>>

View File

@@ -30,11 +30,7 @@ if ( $isDark ) {
} }
// Set wrapper attributes // Set wrapper attributes
if ( ! $is_preview ) { $wrapper = blockWrapperAttributes( $classes, $is_preview );
$wrapper = get_block_wrapper_attributes( array( 'class' => $classes ) );
} else {
$wrapper = 'class="' . $classes . '"';
}
// if the video block contains an iframe, add the role="presentation" attribute // if the video block contains an iframe, add the role="presentation" attribute
if ( $vidBlock && strpos( $vidBlock, '<iframe' ) !== false ) { if ( $vidBlock && strpos( $vidBlock, '<iframe' ) !== false ) {

View File

@@ -34,11 +34,7 @@ if ( $isDark ) {
} }
// Set wrapper attributes // Set wrapper attributes
if ( ! $is_preview ) { $wrapper = blockWrapperAttributes( $classes, $is_preview );
$wrapper = get_block_wrapper_attributes( array( 'class' => $classes ) );
} else {
$wrapper = 'class="' . $classes . '"';
}
// if the video block contains an iframe, add the role="presentation" attribute // if the video block contains an iframe, add the role="presentation" attribute
if ( $vidBlock && strpos( $vidBlock, '<iframe' ) !== false ) { if ( $vidBlock && strpos( $vidBlock, '<iframe' ) !== false ) {

View File

@@ -31,11 +31,7 @@ $children = get_posts(
$classes = 'page-children container relative px-4 py-8 mx-auto sm:px-6 sm:py-12 lg:px-8'; $classes = 'page-children container relative px-4 py-8 mx-auto sm:px-6 sm:py-12 lg:px-8';
// Set wrapper attributes // Set wrapper attributes
if ( ! $is_preview ) { $wrapper = blockWrapperAttributes( $classes, $is_preview );
$wrapper = get_block_wrapper_attributes( array( 'class' => $classes ) );
} else {
$wrapper = 'class="' . $classes . '"';
}
?> ?>
<?php if ( ! empty( $children ) ) : ?> <?php if ( ! empty( $children ) ) : ?>

View File

@@ -64,11 +64,7 @@ if ( $ovlImage ) {
$overlayStyles .= " opacity: $ovlOpacity;"; $overlayStyles .= " opacity: $ovlOpacity;";
// Set wrapper attributes // Set wrapper attributes
if ( ! $is_preview ) { $wrapper = blockWrapperAttributes( $classes, $is_preview );
$wrapper = get_block_wrapper_attributes( array( 'class' => $classes ) );
} else {
$wrapper = 'class="' . $classes . '"';
}
?> ?>
<section <?php echo wp_kses_post( $wrapper ); ?> style="<?php echo esc_attr( $styles ); ?>"> <section <?php echo wp_kses_post( $wrapper ); ?> style="<?php echo esc_attr( $styles ); ?>">