Block party! Check out the new Container Block!
A new block has just landed in Atomic Blocks version 1.2.4! We’re excited to announce the highly-requested Container block. We now have eleven awesome blocks available for the Gutenberg editor. Let’s take a quick look at some features of the Container block.
What’s a Container block?
The Container block lets you gather several individual blocks into a parent container, which helps you create different sections of content on your posts and pages. For example, you might want to create a section with columns, images, and text and give it a specific padding and background color. Using the Container block, you can do just that!
The Container block includes settings for padding, margins, max-width, background image, background image opacity, and background color. These settings will help you create some really unique sections on your site!
A quick video demo
Because the Container block let’s you break away from just adding blocks to a page one on top of the other, this has been a frequently requested block. We’re excited to launch this and we’re looking forward to seeing what you can create with it!
Is it possible to create responsive columns with it? I mean that you have two columns on desktop view and one column on mobile view? Would be so helpful for authors which don’t want to work with page builders.
Hi Haeme,
Right now, this style would need to be provided by the theme. In my examples, I’m using the columns block included with Gutenberg, and it has minimal styles. In the future, we’ll have more dynamic columns and you’ll be able to control the columns on desktop and mobile.
Going to try this.
This video clarifies so much in terms of seeing how the Gutenberg project is worth the effort.
Sounds good, David! I even cheated a bit by pasting those blocks in instead of creating them on the fly. But it also demonstrates how good the copy/pasting of blocks works so far. The future is blocky!
Worked a treat. 🙂
The Atomic blocks are better than the standard Gutenberg blocks!
Can you use the container block on all posts/pages at once and edit it from a single centralized place?
Hi there,
We don’t have global containers available just yet. We’re waiting to see what kind of solutions the core team comes up with for global placement before creating our own solution.
Do your container blocks and Gutenberg work at the same time?
Hi Kathleen,
Yep! They are meant to work together. In fact, the blocks won’t work without Gutenberg.
I can’t find the container block: http://i.prntscr.com/IOpH5IC_Qg2k0-8qlSLbeg.png
And yes I have the current version 🙂
Hey Samuel,
We just released an update about 10 minutes ago that should fix that. You’ll be looking for version 1.2.6.
Yes, now it works. Great!
I would like to draw your attention to a bug. As soon as I activate your plugin, some functions of my website will be crashed. I wonder: what does the menu have to do with your plugin? Surely this is a Javascript error: https://generatepress.com/forums/topic/menu-can-no-longer-be-clicked-on/
Cool, actually the first block I developed was one just like this one 🙂
How do you edit the block after it’s inserted? It just disappears.
Hi David,
The container block is essentially an empty block for you to add other blocks into. It lets you collect blocks into a section that you can use for layout purposes. It might not look like there is anything there, but there should be block settings available in the sidebar when that block is added/modified.
This plugin does not play nice with popular genesis plugins by Bill Erickson
1. Display Posts Shortcode and
2. Columns Extension for Display Posts Shortcode
To recreate the problem that I have mentioned above
—————————————————
Short codes are embedded in between paragraphs in a page.
1. Paragraphs
2. [display-posts include_image=”true” image_size=”thumbnail” include_title=”true” include_link=”true” wrapper=”div” columns=”3″ posts_per_page=”6″ title=”Cat Name” category=”cat-name”]
3. Paragraphs
4. [display-posts include_image=”true” image_size=”thumbnail” include_title=”true” include_link=”true” wrapper=”div” columns=”3″ posts_per_page=”6″ title=”Cat Name” category=”cat-name”]
Atomic block’s posts grid block can actually replace the above mentioned plugins if only we get the option to choose desired thumbnail size rather than rectangle or square which is causing undesirable cropping.
Other than this, your plugin is better than other similar plugins.
Keep up the good work.
Hi there,
Thanks for the feedback here. One thing you can do to prevent the odd thumbnail sizes is to regenerate the thumbnails with the Regenerate Thumbnails plugin. Hope that helps!
Can max width be an optional setting? I’d like to to use my theme to set a max width on container content without having to use !important in the css. Currently because the max-width is inlined and has a default of 1600, then for every container I need to adjust the slider to be 1300 for example.