In my ACF blocks, alignText classes are not applied to either the front end or in the block editor when using get_block_wrapper_attributes(). In my block.json I have declared block support for alignText:
{
"name": "acf/animated-text",
"title": "Animated Text",
"description": "Text animated with a typing effect.",
"style": [ "file:./animated-text.css" ],
"category": "custom",
"icon": " material-symbol keyboard",
"apiVersion": 2,
"acf": {
"mode": "preview",
"renderTemplate": "animated-text.php"
},
"supports": {
"align": [ "wide", "full" ],
"alignText": true,
"anchor": false,
"customClassName": true,
"multiple": true,
"inserter": true,
"color": {
"text": true,
"background": false,
"link": false,
"gradients": false
},
"fullHeight": false,
"spacing": {
"margin": [ "top", "bottom" ],
"padding": true,
"blockGap": false
},
"typography": {
"fontSize": true,
"lineHeight": true
},
"mode": false
},
"postTypes": ["post", "page"]
}
My block header using get_block_wrapper_attributes:
<?php
$block_slug = str_replace('acf/', '', $block['name']);
$anchor = $block_slug .'-'. $block['id']; ?>
<?php $attrs = $is_preview ? ' ' : get_block_wrapper_attributes(); ?>
<div id="<?php echo esc_attr( $anchor ); ?>" <?php echo $attrs; ?>>
The controls for text alignment appear in the components toolbar, but changing the text alignment has no effect and the classes are not added. There are no console errors.
Other features work as expected (like text color, spacing, padding, typography alignfull and alignwide) when changing them in the components toolbar. From what I can see, it’s just text alignment that is not working. Any idea on why this might be the case?
