Spectra (formerly Ultimate Addons for Gutenberg) has a block called Icon List. You use it for making lists that have icons (or images, or nothing) instead of the typical bullets or numbers.
Below are some examples of its use. The first uses a Spectra Container block, which Spectra seems to think is best to employ before adding any other block to your page or post. The Icon List is then added “inside” that Container.
The second example just uses a “naked” Icon List without benefit of Container.
Table of Contents
Spectra Icon List in Container
Spectra Icon List Sans Container
You might be able to see, if you look closely, that the first list is slightly indented compared to the second one. That’s the effect of the Container block. I don’t see that it’s necessary. It does allow more flexibility, if you need it though.
Icon List with Images
Here’s something just a bit fancier. I don’t have the greatest pictures to use as list icons, but that’s what you’re seeing below. The icons are automatically downsized from full-sized images. I didn’t have to do anything to them to make them “work”.
Now, I probably would never add extra margin space on just one item like that. (You can change the padding too.) But I just did it here to highlight the possibility.
You get 3 list items by default when adding a Spectra Icon List. Adding more is a little wonky and took me some time to figure out.
Adding an item between the first and second or the second and third is easy enough. You just hover between them in the center (left to right) and look for the ubiquitous plus sign to pop up.
It’s adding one after the third item that’s a little trickier. To accomplish this (at least, as far as I can tell), you must click the popup menu item to switch from a specific List Item to the Item List as a whole. When you do, a plus sign will appear at the lower right corner of the third List Item. When you hover over that sign, you get popup text that suggests you’re about to add a List Item.
If there’s another way to do this, let me know.