Categories
Gutenberg

WordPress 5.4 Enables Fullscreen Mode in Block Editor by Default

Future of Gutenberg Block Editor will be a full-site editing canvas — not just only for post/page content. We’ll be able to manage all site elements with blocks. Primary site’s elements like header, main menu, footer/sidebar widgets area will be accessible within blocks.

An experimental full-site editing within blocks demonstrated by @epiqueras1, which was conducted by Gutenberg Times a couple of days ago. If you’re curious, you may want to check it in this link.

Categories
Gutenberg

First Version of Block Directory in WordPress Admin Area

Block directory has been planned to be included in WordPress 5.5 and it would be released on August 2020. Check the link below that will show you how it will look on its first version; and perhaps you would like to share your own thoughts in the discussion section.

Categories
Gutenberg

Add New Custom Style to the Gutenberg’s Image Block

I wanted to do a little style changes on the Gutenberg’s image block. By default a tiny caption is located below the image and it looks absolutely plain. I might need an image with more appealing look for certain purpose of website in the future. It would be better to use existing block and add extra style option, instead of creating a new one which would be waste of time.

Common way to accomplish it is to add a couple lines of CSS code into Customizer. However it against user friendliness principle of Gutenberg. Users should not add any code as it might not easy for beginners.

Categories
Gutenberg

Building Beautiful Landing Pages with Gutenberg

I am big fan of Gutenberg. It allows me to compose beautiful post’s content. I tried to dive deeper and explore its possibility to help building a landing page. At this time, Gutenberg alone is not enough. I need to use extra extensions available on the plugins directory. I tried many of them. They offer great richer block variations with special features. Finally I chose Stackable.

Stackable has more cutting edge options on each block/element. Its UI/UX is really impressive. Here is a screenshot of landing page I made with it.

Visit this link to view the live demo of it.

I also made other three landing pages, which you can check directly from gtnbrg.risbl.co. I am going to plan to build other more; and make it available to everyone to use (perhaps for free).

Categories
Gutenberg

TestGutenberg.com, an Instant Tester for Gutenberg

The new default editor of WordPress currently available in a form of plugin, as it is still in development — not yet 100% ready at all. However its major user interface/experience and native blocks are nearly complete.

Instead of installing directly in your site to test it out, testgutenberg.com will bring you to an instant playground. Because it almost be able to do the same as it’s integrated in your own WordPress site. The only limitation is media upload due to disk space consideration. It also doesn’t allow to save the post in order to make database cleaner. To preview final editing, what you need to do is toggling the hamburger menu at the top left near the logo.

This tool was made by Tom J Nowell. He wrote a post about how it was developed in his blog. I’d say thanks for the brilliant work. I am sure it will extremely help better understand the mechanism of composing a post on new editor. I also feel that it’s signaling us we’re getting closer to WordPress 5.0, where Gutenberg will be merged into core.

Categories
Gutenberg

Gutenberg Could Really Be A Big Win For Storytelling

Since it’s first beta release, Gutenberg has become the central of attention by many who are in the circle of WordPress community. It’ll really change the old paradigm of content creation which makes a site more live. I agree that editor is the heart of a website. The initiation of Gutenberg would really be a game-changer in the plugin and theme landscapes, as editor is metaphore of a house for any content to live in. Residents have to follow host’s rules. Developers have to pay deep attention for every piece of changes of content entry process and extensive possibilities could be made in the future. Basically it isn’t something new. We can look back at some current content builder systems. As we’ve already known how — big names like Divi, Elementor and SiteOrigin — they’ve reached massive adoption. Thus the abstractions of Gutenberg is likely more predictable. Both developer and user will be able to clearly understand how the path will go.

Although we have to wait for months ahead because its solid version would be shipped in the next WordPress 5.0, beta version has already proved modern concept of content creation. Introduced block term is the key. It simplifies the complexity of rich web content creation. Imagine a group of content contains sliding images, a bit of paragraph, and some buttons — which has its specific purpose — we can pack them in a single block with unique name to remember. The benefits are felt real. Themer will surely take advantage of it to discover pre-defined content design variations of their own. It has been dreamed by many users for be able to exactly replicate the tasty demo.

From user perspective, it’s really a win for writer to storytell ideas. Storytelling is a method used to show dynamic relationships between story nodes through interaction. Zipes believes that storytelling can involve self-discovery[1]. The story that is presented in engaging visualization will stimulate a desire to read and response. Literature visualization often presented with a meaningful order. Image, video, and audio can be added to support the pieces of story told in a form of plain paragraph. They represent strong connection between pieces of each. By this way, communication goal will easily be achieved.

Ed Hanley seems likely storytell-ed his traveling journal very well on his Atavist post.

 

Below are some more examples of storytelling technique can be applied in a web content Gutenberg.

Cooking with Wine

Skokie International Vestival

Check out more examples in the links below:

The content layout as seen on the above storytellingy posts are just a few examples of Gutenberg block can do. There are some unknown possibilities as the Gutenberg system evolves. “Hidden fish” deep under the sea are still many to be discovered. It’s a challenge for both developer and content creator.

Let’s see how the future of publishing will look like. I feel like Gutenberg supporting the spirit of “making the web a better place”.

[1] Storytelling and Visualization: An Extended Survey

Categories
Gutenberg

Gutenberg, an Iceberg of Prominent Web Content

When I was in junior hight school — about 2002-ish back then — I saw an old typewriter still be used by school’s administration staffs. The typeface was very unique, which had only single type of font and couldn’t be replaced by any. Attaching an image was very limited, even impossible to do. Creative man always got some ways to tackle this problem. He used to leave some spaces and sticked a cut of image taken from other source, like newspaper or physical photo print out. I event didn’t know how tabular data could be inserted.

For the time being, computer were introduced to use in the office. Ms Office program were very popular at that time. This words processor program could produce richer content with multiple variations that visually appealing. At that time, WordArt took my interest. Were you too? 🙂 It was often be used for title of any kind of text. Table and other graphical data — for instance a chart — also can be easily inserted with MS Office. More rich the content, will be more interesting the document will be.

Nowadays, not just desktop application can be used to compose attractive document. Since web programming languages have being developed — become more advanced and advanced from day to day — many online web application can do so as well. Google Docs is one example of them. It really benefits us since our communication working culture mostly be done on the web. It offers flexibility of publication sharing and collaborating with others across continents.

As content creation evolves, web editor does as well. Few years ago, the resonance of Gutenberg heard. What is Gutenberg?

The Gutenberg editor uses blocks to create all types of content, replacing a half-dozen inconsistent ways of customizing WordPress, bringing it in line with modern coding standards, and aligning with open web initiatives. These content blocks transform how users, developers, and hosts interact with WordPress to make building rich web content easier and more intuitive, democratizing publishing — and work — for everyone, regardless of technical ability.
Source

 

Gutenberg is just like an iceberg. The long process and history behind the beauty of mountainous of ice above the sea level will grasp geologists attention. Geologists will discover from the most top to the most bottom of ice sediment, and also its influence to the environment. However there are just some who do so. Common people a.k.a tourists will only enjoy its beauty — no matter whats behind it will be set aside — and will make our eyes orgasm.

Gutenberg means a (visually light) tool for building rich web content without coding knowledge required. The magnificent ice of complexity under the water won’t be seen. Only developers will take effort — dive deeper — to prop the piece of peak appearance that regular users can see.

In the past, building interactive block of content consumes much time to discover and develop. But now they’re just available in a few of clicks with little expense — some of them are 100% free. Imagine that the beauty of web content door is opened widely for all.

As noted above Gutenberg will be the future of web content publishing as promised by the WordPress community.

Starting from now I’ll be exploring Gutenberg deeply and will be writing my findings here in the next posts.