Block Attributes out of order in Gutenberg

I’m in the process of building out an about section block for the front page of a WordPress site and when the block attributes are showing up in the Gutenberg editor they seem out of order, not only to the order they were created but also to the document flow.

If you look at the images I’ve attached, I would think that the “About Social Icon 1” and the “About Socal Link 1” would be listed together in the editor but unfortunately, they’re totally separated, with the links being listed in the “Block Properties” section and the images being pushed up to the top.

Am I formatting this incorrectly or is this a bug of some kind? Hopefully, this isn’t how it’s supposed to work as it’ll be really confusing to the end user.

Thanks in advance for any help!


For this kind of layout, I think this documentation will help you:

1 Like

Thanks @Emmanuel, that did the trick! I actually had that doc page already open and tried it previously but I must have done something incorrectly the first time as it didn’t work properly.

Now I just need to dig through my dev tools in the browser to figure out why in the editor it’s floating the icons to the right but showing them correctly to the original layout (floated to the left) in the front end. LOL!

Thanks again :raised_hands: :raised_hands:

2 Likes