I have been reviewing blocks from different block collections and plugins (default blocks, JetPack, Advanced Gutenberg, Atomic Blocks, Kadence, Qodeblock, Stackable, and Ultimate Addons) and choosing the ones I like while deactivating the rest. It’s weird doing the reviews as normally you would say “Here’s block X and Y” and compare the visual features in the post as well as some of the back-end options.

Except that once I deactivate block X because I liked block Y better, block X disappears from the display. In WordPress, there is something called graceful degradation for plugins which is the idea that if I use a plugin to insert an image, for example, with custom styling and then later remove the plugin, the page should still load perfectly fine.

But blocks do NOT degrade gracefully; it is an on/off switch. Once I finish the review post and deactivate the ones I don’t like, the post won’t display properly except for the blocks I kept activated. However, I did want a post where I showed off the blocks I am keeping/using. But I’m not done my full review yet so this page will get updated as I work my way through them.

Update May 13 – Text blocks

The most basic of the three text blocks is the paragraph block and here it is! Although I added a blue background and Drop Cap to make it stand out.

A classic block doesn’t have the same background controls, but it gives me back all the styling options and plugins that the old classic editor had. So, for example, I use a NextGen Gallery image chooser that works in classic but doesn’t have a block option yet. If I use it in classic mode, I can insert an image from my NGG gallery, as I used to, and move on. Some people like it for inserting tables too. But, on the front end, there is nothing to look at that says “Hey that was done with a classic block rather than a paragraph block”.

So what’s the third text block? The heading block. Which I used above to designate “update May 13” at H2 level and coloured green.

Update May 16 – Media blocks

Stackable adds an option to include images as a Header style like what you do at the top of a webpage. If I wanted to, I could create a page and use my theme controls to remove my existing theme elements from just that page, and use this block to simulate a whole other look and feel. Almost like creating a theme for a single page. However, most people are likely to use it create large intros to pages. Since it is with Stackable, there are a lot of options to tweak the look and feel.

Now that I’ve shown individual images, let’s look at galleries. Since I use NextGen for my website, I use their block for my galleries. There aren’t any control options for the block, everything is done within the NextGen settings when you choose your gallery and specific layout options. I like the Pro Thumbnail layout with captions for my default gallery of choice, as it allows you to switch to LightBox when you click on it. One downside to the NGG galleries is that they aren’t WYSIWYG — you only see them when you click preview since they pull data from saved databases (i.e., they have to generate the gallery).

The next media block is the “media and text” block and what I really like it for is videos. It really acts almost like a container block — a media / image / video block to insert the file and then two-paragraph blocks for description. I added a green background to make it stand out. The media can go on the left or right, and I can adjust the vertical alignment of the text. Mostly I like it because while NextGen handles images, it doesn’t handle video. So when I do a gallery page, and I want to add video, I have to do that manually underneath and they look a little boring. But lots of people just use it for putting text next to individual images.

For videos, there is a separate video block, and it does the basics just fine. I can add a caption at the bottom, but most of the settings come from the either initial select options in the media library (such as adjusting size) or are limited in the block controls to player controls (auto-play, mute, etc). Unfortunately, the size options won’t let you go “bigger” than the original.

However, the real power in WordPress is a totally separate block simply called “embed”. None of my default options would let me add a TED talk. YouTube and Vimeo options are easy, but embedding a TED talk? There is something in their wrappers that various blocks just get confused by and throw in the towel. So instead of using such a block, I go to TED Talks, find a sample one, click on the SHARE button to get a link, and just paste it into a new empty block. WordPress automatically reads that I’ve inserted a link, launches the EMBED block, and bam, there’s your TED Talk. I don’t have any controls for that block but it’s there.

Update May 17 – Page dividers

I have three page dividers, courtesy of the Stackable collection, and you’ve already seen one of them. The red bar just above this update to separate it from the previous update? It’s a “divider block”. There are other tweaks I could make to it but that’s a basic thick bar almost full-width.

The next one is a spacer block. I could leave it white, but then you wouldn’t be able to see it. Instead, I threw in a gradient option from red to blue.

After that comes the basic separator block. I’ll style it so it is a “bottom wave” to go with this paragraph. The blue is the actual separator, but I added grey background past that so you could see the size of the full block. It’s wider than I would normally want, but I could always throw it into a container block to literally contain / limit it.

Update May 17 – File or Audio blocks

I mentioned in my update that I don’t need a file block as I use a plugin to manage my downloads. Here is what a link looks like to embed a download of my HR guide. [ddownload id=”9141″]

Equally, I don’t use the audio blocks either, as most of my playlists are going to come from Apple Music/iTunes. Instead, I paste the embed code directly from Apple Music and let WordPress figure out the display. I can use Apple Music’s widget tweaker to adjust what the block looks like, but for illustration, here is the default paste below.

Update May 17 – Feature blocks, product blocks, pricing blocks, etc.

This is Stackable’s blockquote plugin and I love the power of it. This is the most basic of settings, but you can tweak everything out the wazoo.

I already demonstrated their Header block above (the second photo of water with bull rushes).

For their Team Member block, I don’t have a lot of need for it.

I also am keeping their Feature block and Pricing block around for future projects.

Computer

$1.00

each

Button text

The pricing block has lots of options, most of which I will never use. But I do have some ideas on how to use it for giving people “choices” side by side.

Update May 18 – Group containers

I said in my post that I don’t want a group / container block. I think it encourages reusable blocks that should be more finely tuned or just general laziness in design. But here’s a reason to keep it around — limiting the width of a container that doesn’t have such an option. Like farther back in this post, I pasted / embedded a TED talk. But when I did that, I have ZERO options to control the video without dropping to code. Although even when I dropped to code to see it in HTML, the options to set the size were not there by default, I’d have to add them. Instead, I can embed it in a container below, put a gradient background of blue to grey so you can see the container and limit the content to 50% of the width. It automatically adjusts the blocks within it i.e., the video screen that didn’t have a width option before does now. Now, is this the best example? Nope. The container didn’t adjust the video for height, so it looks odd. But I can at least change it. I’m more likely to use it for things like price blocks or interesting “design” blocks that didn’t come with a width setting rather than trying to force an external video in. Besides, I have other ways to do that, so this was more just an example of what could be done when the default option wasn’t there.