The Organic Blocks Bundle is a growing collection of blocks for the Gutenberg editor created by Organic Themes.
Organic Themes was among the first companies to release a free block within the WordPress plugin directory — the Profile Block. Additionally, we were the first to publish a tutorial on How To Create A Custom Block For Gutenberg. An article that was copied by many.
As partners of Automattic and WooCommerce, we’ve kept a watchful eye on Gutenberg since its inception. We have witnessed new blocks introduced into WordPress, Jetpack, and WooCommerce over the past year. Since Gutenberg is rapidly evolving software, it was important that we didn’t duplicate any of those existing blocks within our collection.
So, we created a suite of blocks designed to compliment the existing blocks in the Automattic arsenal. The result is the Organic Blocks Bundle. A useful collection of 9 purposeful blocks.
Many Organic Blocks are designed to display existing WordPress content. Additionally, we chose to develop these blocks using the ES5 Javascript syntax. As a result, Organic Blocks can be edited on a web server without the need to compile changes. That’s a big deal. It means our blocks are customizable — even for amateur WordPress developers.
The Blocks Bundle
The Organic Blocks Bundle currently includes 9 premium WordPress blocks. However, more blocks will be added in the future. Now, let’s introduce the existing blocks! They’re pretty awesome.
Content Slideshow Block
The Content Slideshow Block is the easiest way to create content sliders using the WordPress Gutenberg editor. The block displays a featured image, title, excerpt, and a “Read More” link from any post type. Additionally, several options are available for modifying the style, colors, display, and more.
Posts Block
The Posts Block displays any post type within a blog style layout. Block options allow for the change of colors, style, layout, and more. It’s an excellent tool for showcasing relevant blog articles, products, or other post types on any page using the Gutenberg editor.
Portfolio Block
The Portfolio Block is perfect for showcasing any post type within a portfolio. Each portfolio item displays the title when hovering over the image. Additionally, a Pinterest pin button displays. As a result, users may pin individual portfolio items to their Pinterest account. The block includes several options for modifying the portfolio style and layout.
Profile Block
The Profile Block displays personal profiles. It’s an excellent tool to display author biographies, team members, or employees throughout your website.
Organic Themes released a free version of the block in the WordPress plugin directory. However, the Profile Block included in the Organic Blocks Bundle features several more options. Additionally, unlimited social media icons may be added to the block.
Testimonials Block
The Testimonials Block displays a selected post type within a testimonials slideshow. Display multiple testimonials per slide, and change the colors, layout, and style within the block options. It’s perfect for showcasing client and customer testimonials throughout your website.
Pages Block
When building a custom home page or landing page, it’s common practice to direct visitors to other pages throughout your website. The Pages Block serves this purpose. Simply add the block within the Gutenberg editor. Then, select the pages you wish to display. Additionally, several block options are provided to modify the colors, style, and layout.
Header Block
A header is arguably the most important element of any website. Typically, it displays your website branding and navigation. The Header Block provides full control over your header logo, layout, information, and navigation. It’s an essential tool as WordPress themes and the Gutenberg editor transition into a full-fledged site building experience.
Footer Block
The footer is the bookend of your website. Typically, it contains important website information, and secondary navigation. The Footer Block places the control of the footer design and information within your hands. Display copyright information, branding, social media links, and more. Additionally, the block provides options to change the style, layout, and colors.
Widget Area Block
There are hundreds of traditional WordPress widgets. Typically, widgets display within “widgetized” areas of a WordPress theme — like sidebars and footers. However, some widgets may be useful within specific page or post content. That’s why we developed the Widget Area Block for Gutenberg.
The Widget Area Block creates widgetized areas anywhere you like within the Gutenberg editor. As a result, traditional widgets can be added anywhere on your site.
This block is useful for displaying advertising widgets throughout your content, or an event calendar widget within a related article, or countless other examples. It’s a particularly powerful block when combined with the Builder Widgets plugin. As a result, the power of Gutenberg and Builder Widgets can be utilized together.
Additional Organic Blocks Bundle Features
ES5 Development
What the heck is ES5 Development, and why use it? Well, I’ll get to that. But first, if you’re not a WordPress developer, designer, or power user — you can skip ahead. This probably doesn’t concern you.
WordPress is open source software. As a result, a community of contributors, comprised of volunteers, individuals, and small businesses developed the platform, and a majority of the supporting products. Most contributors are self-taught developers, including myself.
React.js is the coding language of Gutenberg. At first, this outraged much of the WordPress community. Prior to Gutenberg, WordPress was primarily developed in the PHP coding language. Most self-taught developers have spent the last 10 years learning PHP development for WordPress. Now with the release of Gutenberg, WordPress is moving to an entirely new code foundation.
It’s like you’ve been perfecting the German language for 10 years, and then the country of Germany suddenly changes their official language to Japanese.
The biggest hurdle for React.js development is the need to compile your code for the web after making changes. Meaning, you can’t simply edit the code of a React.js plugin on your server, and expect it to work properly. As a result, it makes the work of freelance WordPress designers, developers, and power users much more difficult. In some cases, it’s an impossible hurdle.
ES5 to the rescue!
ES5 Javascript, or ECMAScript 5, doesn’t require compiling for the web. Meaning, you can edit ES5 code directly on your web server. So, you don’t have to be a Javascript genius to make a minor edit to Organic Blocks.
That is why all Organic Blocks are developed using ES5. So, even amateur developers can edit the code for Organic Blocks. Plus, they’re a great asset for learning how to build Gutenberg blocks in the ES5 syntax.
Server-Side Rendering
The blocks included with WordPress and Jetpack are excellent tools for building content from scratch. However, they are not particularly useful for displaying existing content. That’s where we come in.
Many of the blocks included in the Organic Blocks Bundle utilize server-side rendering. Meaning, they display data that already exists on your web server. For instance, perhaps you have a website with hundreds of published posts and pages. Organic Blocks allow you to display that content on other pages. Plus, the content renders in the editor exactly as it appears on the site.
No Unnecessary Blocks
Some block collections contain blocks that already exist in the Automattic arsenal from WordPress, Jetpack, or WooCommerce. Additionally, some collections include blocks that can be recreated using a simple combination of core blocks. We consider such blocks as unnecessary clutter.
With the Organic Blocks Bundle, there are no duplicate or unnecessary blocks. We believe in quality over quantity. As a result, we didn’t include yet another Spacer or Columns block in our bundle. Each block serves a real purpose.
Simple Usage
A good product should be so easy to use that documentation is unnecessary. Blocks are already simple. Once you understand how to use one block, you should know how to use any block. Since Organic Themes follows WordPress standards, this rings true for Organic Blocks. The purpose and options for each block is self explanatory.
We’re confident the Organic Blocks Bundle will help you create beautiful custom WordPress pages with ease. It’s one more step towards the Gutenberg editor becoming a full fledged website building solution.
This is the new latest WordPress block and their features very help full and informative post. Thank you, David! for sharing bundle collections of Gutenberg Block.
Very help full and informative post. Thank you, David!
WordPress is a great way to build a site! These blocks could improve a website’s appearance and make it more user friendly. Thanks for the informative article and the option to purchase in the future. I think this can truly be helpful to a site owner.
I have enjoyed reading the post, This post is really nice and pretty well maintained, thanks for it and keep updating. Bis
Kerala Matrimony
Very help full and informative blog. Thank you.
Thanks to author for sharing informative blog.
I liked it – Posts Block was the best fit for the newly created blog;)) It’s my beginnings with wordpress, but it works fine.
Hello, I liked your post but do you know about digital marketing because I have the best team for digital marketing. We are providing the best digital marketing services with affordable SEO packages. If you want the online business for your site then go quickly to our website and join our SEO package.
Very interesting. Thanks for sharing.
This is really very informative and helpful post for those who don’t about this topic and I am one of them. Thanks.
Your Organic Themes are so cool. I recommended it to all my friends.
This is Really Nice Information about WordPress Gutenberg editor.
WordPress I love it !!! You have great tutorials !!! Thank you, David !!!
Yay! I really want to try this one.
Hmm. I wanna read more reviews about this before trying this out
Such a nice blog, thanks to the author for sharing with us such Useful information.
You can get some more information in the way of Dr Cohen. Visit the link please.
Good article, very helpfull.
Thanks for this important information.
wordpress is more popular because of their friendly seo plugins
Realy good information, thank You!
thanks for sharing!
This is an extraordinary blog. Thanks
Hostinger Promo Code 2021, hostinger coupon code india 2021, hostinger coupon code for first time user, hostinger coupon code for hosting, hostinger coupon code today
Thanks to author for sharing informative article.
This is really very informative and helpful. thanks for sharing.
Baju Drenanr that was amazing blog post. Love it and hats off for writer