Atomic Blocks, August 2018 Version

I tested Atomic Blocks on this site before. New blocks have been added since, and I presume the earlier blocks have been updated, so I’m making a new post about them. (Also, last time I tested them was with the Twenty Seventeen theme. I’m now using the Atomic Blocks theme.)

Atomic Blocks Post Grid, Grid View

Welcome to the Gutenberg Editor

Of Mountains & Printing Presses The goal of this new editor is to make adding rich content to WordPress simple and enjoyable. This whole post is composed of pieces of content—somewhat similar to LEGO bricks—that you can move around and interact with. Move your cursor around and you’ll notice the different blocks light up with…

Continue Reading

Atomic Blocks Post Grid, List View

Welcome to the Gutenberg Editor

Of Mountains & Printing Presses The goal of this new editor is to make adding rich content to WordPress simple and enjoyable. This whole post is composed of pieces of content—somewhat similar to LEGO bricks—that you can move around and interact with. Move your cursor around and you’ll notice the different blocks light up with…

Continue Reading

Atomic Blocks Button

This is a button created with Atomic Blocks. It takes you to the Atomic Blocks website. You can modify shape, size, and text and background color.

Atomic Blocks Testimonial

I’m writing this testimonial because I think the Atomic Blocks plugin and theme are awesome! Except I really think testimonials should be a post type and not a block. I really do.

avatar

Sallie Goetsch

East Bay WordPress Meetup Organizer

Atomic Blocks Profile Box

Profiles also seem to be popular as custom blocks, but they seem like another thing that really ought to be a post type, at least if you have more than a few.

avatar

Sallie Goetsch

WP Fangirl

Sallie Goetsch (rhymes with ‘sketch’) started working with WordPress in 2005. We’ve come a long way, baby.

Atomic Blocks Notice

Notice! You can’t dismiss me.

I think I like the basic style better than the alert from CoBlocks. Would I use a notice block? Not often, except for things like “Hey, this post is old!” notices, and those are inserted programmatically.

Your choices are for dismissable and non-dismissable notices. I made this one non-dismissable, even though that’s terrible practice.

Atomic Blocks Drop Cap

I’m not at all sure why we need a custom drop cap box when drop caps are an option in the default paragraph blocks. It’s interesting to see how it handles the contraction. You can switch styles for your drop cap: just the letter, a dark square background, or a border.

Atomic Blocks Spacer

This is the sort of thing people seem to want, especially if they’re not handy with CSS: blocks to add horizontal or vertical space. This spacer block lets you determine height and whether there’s a divider. It’s like a customizable horizontal rule tag.


Atomic Blocks Accordion

Click Me to Open

Interestingly, the Atomic Blocks accordion has fewer style options than the CoBlocks accordion. Your choices are font size and whether the block is open by default.

Atomic Blocks Call to Action

This is pretty customizable: background color or image, title size, text size, text color, button color/size. Pretty much all you need in most CTAs.

Call to Action

Take some action, dang it!

Atomic Blocks Sharing Block

I like this better than the CoBlocks version, though I still think sharing buttons are not something you should have to manually insert. Of course, if we’re talking about building templates made from blocks, this would be a block you’d include in a template.

Atomic Blocks Container

Container blocks are an important concept if you want to be able to put blocks next to each other. The core team is working on doing this with column wrappers, but I’m not sure it’s working. (I’ll do a core blocks test after lunch.)

Container Heading

This is a full-width paragraph inside a container. You won’t know it’s full-width until I add some more words, though.

This is a paragraph inside a column. The old text column block seems to have gone away. So we now have a column container inside an Atomic Blocks container. We’re going to reach Inception pretty soon.

The columns block basically lets you create a single row with the number of columns you want, whereas the container block lets you include multiple rows for one block and move it around.

Ever expanding fibonacci spiral made from a daisy.

Here’s a nice little GIF to illustrate the recursion happening here.

Cover Image Inside Container

Leave a Reply

Your email address will not be published. Required fields are marked *