I Tried Building a Layout With the WordPress Block Editor & It Didn't Go Well

Рет қаралды 5,560

7 ай бұрын

I aimed to record myself trying to build "Feature Section Victor" from the Frames library. If the Block Editor is “for everyone,” then a front-end developer with tens of thousands of hours of experience should be able to use it without issue, right?
You’d think so. But it didn’t go so well.
Read the full write-up: geary.co/wordpress-block-edit...
** MY TOOLS **
🔥 AutomaticCSS (ACSS) - automaticcss.com
🔥 Frames - getframes.io
See all my recommended tools here: geary.co/tools/
** INNER CIRCLE **
Step your design/dev game up, make more money, and get the full scoop on scaling your digital agency! When it comes to the Inner Circle, I don't hold back.
⭕ In-depth design & dev trainings
⭕ Business, sales, & marketing trainings
⭕ Agency resources & downloadables
⭕ Vibrant, quality community with zero toxicity
⭕ ...and much more!
Learn more and join here: geary.co/inner-circle/
** SOCIAL **
👉 FB - / marketingkev
👉 LinkedIn - / kevingeary
** CHAPTERS **

Пікірлер: 139

@Gearyco 6 ай бұрын

Note: Some "where the heck is this setting" stuff got cut out just to drop the overall length. The total time was 90 minutes to build this single section (gasp, I know). I also accidentally cut a small part of applying the hover style to the focus style (oops) -- Gutenberg broke my brain all the way into the editing room. I think the main point got across, though. Cheers!

@websiltd 6 ай бұрын

I'm soooo happy you made this video, I've read and seen so many "Block editor will kill all page builders" type posts, and you have PROVEN that the block editor is still a load of rubbish. I think Wix newbie users might like it. You seemed to write more CSS for that section than i've ever written for a whole website. Thank you for putting my mind at ease. I'll stick with Bricks, Acss and Frames!

@filiuslaurentius 6 ай бұрын

be great to see gutenberg response on building this example

@Gearyco 6 ай бұрын

I'd like to see that, too!@@filiuslaurentius

@ingoFX 6 ай бұрын

Yes, thanks so much. Until now I was starting to think I was maybe losing my mind. With so many people talking about non -block editors becoming a thing of the past - I thought maybe I was missing something when I kept finding Gutenberg harder to get things done. Too many hoops to jump through and hacks required.

@AlexGraphicD 6 ай бұрын

I cringe so hard every time I see this guy Matt claiming WP can be used for professional web design and at the same time it is free but that is such a BS. Core WP might come for free but if you want to do a professional work you will have to buy premium addons, plugins, themes etc.

@nick90000 6 ай бұрын

I think this will make people who have had to make websites in the block editor feel good to see someone like Kevin struggle too, I'm not alone struggling with it 😆

@Sonya_Makepeace 5 ай бұрын

Same here. It's a badge of honour.

@pana_____ 6 ай бұрын

Kevin Geary, you are pure gold for the internet, after constantly watching a few youtubers who offer tutorials and tips for creating websites on the wordpress platform, I feel the need to start over, I have learned everything wrong in terms of best practices and creating an easy to maintain and scalable website. Currently 80% - 90% of my time spent on youtube is to watch and rewatch your material. Thank you for your quality courses!

@Gearyco 6 ай бұрын

🙌

@JoeFletcher 6 ай бұрын

I hope Matt takes this as constructive criticism as to why the Block Editor is not even close to being the tool it needs to be. Gutenberg has been wishful thinking for 5 years now.

@mr.matt.eastwood 6 ай бұрын

Yeah it would be awesome if some WP higher-ups saw this and took note. There is no shitting on GB here, just honestly trying to get work done that we all do as real-life web designers / developers.

@Gearyco 6 ай бұрын

Please share it up! Only way they'll take notice...

@webgeneral 6 ай бұрын

Well, you can make your Blocklife way easier by using Generate Blocks or Kadence. This native Builder doesn't really seem to move forward...

@tudorcelstan 6 ай бұрын

I feel like Automattic don't understand how random of an experience Gutenberg is for both professionals AND amateurs. In their pursuit of democratising publishing they've actually made the entire builder feel like it randomly hides or disables features when changing blocks or settings.

@titusscurf 6 ай бұрын

Thank you Kevin - I had a creeping suspicion that this was going to be painful to watch... I was hoping that you might show us something that I'd missed, but alas not. Thank you so much for taking the time to produce this video - I hope that Matt and the team take some time to reflect on this... I'm grateful for everything Wordpress, but Gutenberg is just not a design tool (in it's current format anyway) - it's like trying to do desktop publishing with Microsoft Word!🙃

@vaughanprint 6 ай бұрын

You have the patience of a saint. Anytime I go to retest the block editor I get to about 22 minutes throw hands in the air and say feck this for a game of cowboys. Which is why I just about use it for basic content layout, one thing after another in a post. Watched 33 minutes. Will watch the rest tomorrow… I swear I will.

@Gearyco 6 ай бұрын

I wanted to tap out after about 20 minutes.

@luckycatcreative 6 ай бұрын

Many thanks, Kevin, as always, for putting yourself through this; for doing the diligence thing rather than just yacking and complaining like many people in this space do. I never fail to pick up something useful from you no matter what subject you tackle. Happy Holidaze!

@Gearyco 6 ай бұрын

Glad to hear you found this valuable! I wasn’t sure what people would think.

@luckycatcreative 6 ай бұрын

@@Gearyco Forgot to mention that the labels you added in the Block Editor, like when you renamed Group to "Section", won't affect the resolved HTML; I gather they are just for helping you while editing. With GenerateBlocks' Container block, which is meant to replace the Group block with something far more useful, you can choose what its HTML tag will be: div, article, section, header, footer, or aside. (Container block is one of six special blocks in the free GB plugin, which works with any theme.) Much better, right? Cheers.

@ReubenHochstetler 6 ай бұрын

I can’t imagine building websites with Gutenberg. Thanks Kevin for your sacrifice and taking the time to see what would be like to build with it. If it’s Matt’s vision that page builders like Bricks go away, I’ll leave too… I wouldn’t build websites with the current WP editor.

@iamMarkBallard 6 ай бұрын

Just 5 minutes of Gutenturd will have you writing html from scratch. I sure can't wait till Matt rolls out the next version built on Macromedia Flash.

@Gearyco 6 ай бұрын

😂

@VascoDanielBaiao 6 ай бұрын

🤣🤣🤣🤣🤣 that would be 'memorable'

@nexTabDE 5 ай бұрын

🤣🤣🤣

@nexTabDE 5 ай бұрын

Haha, I'm currently redesigning my own website (lord knows it's about time... usually I just never find the time as I'm too busy working on client sites) and it's the exact same. I've completely given up trying to accomplish anything on Gutenberg without CSS classes. I am using them everywhere to do padding that can't be set in the respective blocks or their child elements, max-width controls, etc... Love this video, it's basically my daily life when I'm livestreaming WordPress. 😆

@MoxetKhanPK 6 ай бұрын

This is super productive and to the point review with lots of concern we had. If expert like Kevin spent an hour building a section what will an entry level developer do.

@kristapsvilcans 6 ай бұрын

This is going to be fun

@mr.matt.eastwood 6 ай бұрын

I've been looking forward to this ever since you first mentioned it a few streams ago.

@derekshort 6 ай бұрын

An entertaining video. Thanks 😁👍🏻

@Jim.Hummel 6 ай бұрын

Thank you, Kevin, for abusing yourself on our behalf. I come away from this fully impressed with your knowledge and talent but in the end, I can only think, "What a Charlie Foxtrot!" P.S. Merry Christmas to the Geary Clan!

@Gearyco 6 ай бұрын

Haha! I see what you did there. Merry Christmas!🎄

@damiansaunders2074 6 ай бұрын

That was difficult to watch, thank you for 'taking one for the team'. I was once a staunch advocate for using the Gutenberg editor, Generate Press and Blocks, and others went a long way to addressing these issues but still come up short. Life's too short to deal with this...

@carlo3368 6 ай бұрын

Gutenberg seems to be Elementor's evil twin

@sumerianbrother 6 ай бұрын

lol, entertainment at it's best. can't say this was a productive hour, but nonetheless loved it. :)))

@visualmodo 6 ай бұрын

Very good content!!!

@TobiasGronbach 6 ай бұрын

Phew, this felt like torture! Hope you got a good therapy session afterwards! ;)

@Gearyco 6 ай бұрын

Big glass of wine that night.

@calebmatteis9155 5 ай бұрын

Great content! I enjoy your videos. To be fair it seems like you haven't built a lot with the block editor. I would say it takes a couple of days to get your head around it. The theme.json file is a powerful tool when it comes to developing your sites. I watched your Brics video and it was great. Brics seems like an amazing tool, but I could tell that your comfortablity with Brics is what made building the layout a breeze. Gutenberg is pretty great. If someone wants to make more advanced layouts I would recommend the green shift plugin. I think a WP shoot off would be a good idea to test how capable Gutenberg is vs other page builders. I would get a developer who is proficient at Gutenberg vs anyone who is proficient with their builder of choice. Great content as usual!!

@Gearyco 5 ай бұрын

This was less about familiarity and more about actual physical limitations of the environment

@grfxninja 6 ай бұрын

And this is why I hate Gutenberg. My brain was hurting in less than 5 minutes, but I managed to stick it out till the end (somehow). How they think that the FSE/Block experience is 'for everybody' is absolutely beyond me…

@markjszymanski 7 ай бұрын

Welcome to Block Land, boys

@mr.matt.eastwood 6 ай бұрын

It's just like Super Mario Land, except you keep banging your head against the blocks and you get nothing out of them!

@TheBeeOBee 6 ай бұрын

All men in this comment section hmmmmm

@jawabumusic1260 5 ай бұрын

I am Nothing in the world of web design but I gotta say something. The fact that a mad pro had the same frustrations that I had when creating stuff on Gutenberg is crazy to watch but I can't deny that a lot of the frustrations have to do with not being accustomed to using the platform. Intuition doesn't get you far in Gutenberg, it really does require learning The more I gave up on Gutenberg and kept coming back the better I got, and once I finally understood how to adjust the widths it was absolutely refreshing. I still feel like dying every time I think of Day 1...💀

@Gearyco 4 ай бұрын

It’s because the UX is terrible…

@RobCooper 5 ай бұрын

Ghost spacing drives me crazy. You've convinced me to move to Bricks

@RobCooper 5 ай бұрын

Will join your membership program too

@derek-hanson 5 ай бұрын

Gutenberg is full of keyboard shortcuts. To build with any block you type / and start typing the block you want, for instance /columns.

@WPMinute 6 ай бұрын

When I purposefully made a 10 minute video highlighting the editor’s challenges, comments said “I needed to prepare more” and “I should have figured it out” You did it for an hour and your audience rejoiced. I hate KZfaq 🤣😂😂🥵

@Gearyco 6 ай бұрын

😂😂😂

@VascoDanielBaiao 6 ай бұрын

KZfaq rejoices on watching others suffering

@excelovita 6 ай бұрын

Someone asked me ... "what do you mean by people?... people mean ... Kevin is not alone... there are whole bunch of people who does not want to learn Gutenberg but want to just criticise... WHY ? I mean WHY ? Stop misleadig ... stop cribbing... start learning.

@charlie-hebert 6 ай бұрын

Thanks for taking the time to really dive deep on the comparison between Bricks and Gutenberg. I've completely switched up my workflow to Bricks after seeing how much more efficient it is to work with.

@Gearyco 6 ай бұрын

Glad I could help!

@derek-hanson 5 ай бұрын

Width settings are on the group block. So the template already supports wide and full, you just change the alignment of your Group. Wide or Full.

@Gearyco 5 ай бұрын

That’s not enough control

@elevateyourcreativeness 6 ай бұрын

I can’t say that I’ve found any suitable block builder tools that allow me to expedite my builds over any of the major players in the page builder world and using some framework tools. I still struggle with why WP didn’t focus on the entire backend and tidy it up, particularly the media gallery and being able to create folders for media and to natively offer convert to WebP upon upload, which I feel should be fairly straightforward. My brain just works better in my fav page builders.

@Gearyco 6 ай бұрын

100%. The current state of the media library after more than 2 decades of development is downright embarrassing.

@elevateyourcreativeness 6 ай бұрын

@@Gearyco What is even more of a tragedy is the fact that WP is trying to position itself against some of the major players. However, in my opinion, I feel they are focusing upon all the wrong areas. Let's face it, I don't see "Blocks" as being a major contender in comparison to some of the stronger page builders, nor what other platforms are offering right out of the box.

@OscarObians 6 ай бұрын

TBH I feel they should just scrap any ideas of trying to somehow panel beat GB into some kind of page builder. Focus on making WordPress a more efficient CMS. At this point GB is still only good enough for blog posts. Period.

@Sonya_Makepeace 5 ай бұрын

This was very amusing to watch, because you are highlighting all the problems I had, except you solved them faster. One major annoyance for me, is that when compiling a page, I cannot make the width different if I want a different width on a tablet, or mobile. You are stuck with the one setting, in CSS I can make different widths using media queries. Edit: If you get the Gutenverse plugin, you get a Section block you can use, plus some other tasty looking blocks.

@gavinfenton8821 6 ай бұрын

I always feel like the whole Gutenberg / native block / FSE thing when ut comes to MM and advocates is a bit of an 'Emperors new clothes' scenario. All high fives and no substance for something that is clearly not fit for purpose. Great video illustrating this exactly 👌

@ceesvanstam1963 6 ай бұрын

Kevin clearly shows that working in Gutenberg is a disaster. But all theme and plugin companies are doing good business as a result. Those are still trying to make it more manageable. Bricksbuilder then works so easily compared to the block editor.

@MarkCMoran 6 ай бұрын

Too confusing for beginners. Too powerful for non-designers. Too limiting for developers. Too Frankensteined for workflow. =(

@zac8670 6 ай бұрын

Block editor on its own is quite limited. However, there are several amazing addon systems which both makes it a decent way of building a site, and shows that WP built a system that can be iterated upon. Bricks for me though.

@Hi6sl 6 ай бұрын

I would already be happy, if I could add columns with CSS grid or Flexbox to Gutenberg content, so that looks and behaves (mobile responsiveness) exactly like any other columns I use in my Bricks templates/pages.

@Arisch24 6 ай бұрын

What page builder were you using before Bricks and Oxygen? Custom themes?

@Gearyco 6 ай бұрын

I started out just buying themes and customizing them. I cared more about the content and the marketing than design/dev. Then I went to Divi because I felt like nothing better existed (I never liked Elementor). Before WordPress it was custom coded sites, then trying out tools like Dreamweaver and Frontpage and such.

@Arisch24 6 ай бұрын

@@Gearyco that's such a great insight! Thanks for your response

@digwillhachi 6 ай бұрын

I honestly don't think they could make Gutenturd harder to understand and use if they tried. Its a marvel to design how completely awful and unuser friendly they have managed to make it.

@DougRider1 6 ай бұрын

I'm a Bricks user and feel the struggle when working with the WordPress core Block editor. Could you have done this easily with the Cwicly Block editor?

@Gearyco 6 ай бұрын

I can record myself building it in Cwicly as an example.

@stripedgoat8470 6 ай бұрын

@@GearycoCwicly is interesting. I am not entirely sold on the UI though, for some unexplainable reason. But the builder itself looks solid! I’d love watching you play with it.

@brendanoconnell2306 6 ай бұрын

in cwicly or bricks, this is a straight forward build, can be done in under 10mins, all done on a single page without hopping around in fse.

@haroonqraja 6 ай бұрын

@@Gearyco Please do...I'd love to watch how Cwicly could improve this sort of building workflow.

@llampp 6 ай бұрын

Or Spectra?

@fiqihalfarizy4843 6 ай бұрын

gutenberg developer strongly recommended to sacrifice their own idealism (intrinsic or whatever concept) and take lesson from ui friendly builder. famous ui friendly builder is capable to build site beautifully, have more freedom without confusing even for non-tech user.

@Gearyco 6 ай бұрын

Which tool?

@rebelinc 6 ай бұрын

Yeah Gutenberg blocks is still an utter mess working with. Settings are all over the place, no coherence whatsoever.

@geckografix8045 6 ай бұрын

Gutenburg the "Betamax" of builders

@Gearyco 6 ай бұрын

I call it Hindenburg.

@Hi6sl 6 ай бұрын

And now with Bricks

@AlexGraphicD 6 ай бұрын

It’s such a shame you are not the head of Wordpress in place of Matt. The guy likes to talk a lot about “democratizing” and “pleasing everyone” but there’s no substance at all or focus towards professionals and agencies.

@Gearyco 6 ай бұрын

I’m sure his job isn’t easy and he’s in a tough position in a lot of ways. There are a lot of politics at that level. I definitely think more transparency around why certain decisions are made is important.

@AlexGraphicD 6 ай бұрын

@@Gearyco come on, if it's that tough then he should step away and let professionals like you step in to help move things forward. But it's as you said 'Politics" and an elitist mentality that only we know what's best for the future of WordPress and we will not allow any other opinions and throwing cringy catchphrases such as 'democratizing', 'diversity', 'inclusivity; etc is more important than actually doing any changes with substance to WordPress.

@AlexGraphicD 6 ай бұрын

@@Gearyco kzfaq.info/get/bejne/mZ19Z9Bzu820Y40.html @ 3:56 "WordPress 6.4, which was run by a group of people from underrepresented genders". Sorry I can't take WP and Matt seriously anymore. They are a joke at this point.

@spacevertex 6 ай бұрын

You were too kind and gave a lot of leeway to Gutenturd. You shouldn’t have used custom CSS and just trashed the builder for lacking basic functionality. Don’t get politically correct and hold back, it helps no one. There must be someone who says the way things are, that’s your calling card, don’t dilute it.

@Gearyco 6 ай бұрын

PB101 philosophy is that you’re empowered to forge ahead no matter how shitty the builder is. I felt like I needed ti demonstrate that.

@spacevertex 6 ай бұрын

@@Gearyco You are missing the point. It’s a no-code world, and page-builders are no-code tools. A page builder should be able to achieve the functionality without using custom css. If it can achieve that functionality and produces outcomes like Bricks, then kudos to that, and if it can’t, like the Block editor, then it must be called out as a trash can. Writing custom CSS for a page-builder review helps no one.

@Gearyco 6 ай бұрын

I wouldn't say that page builders are "no code." They're "low code." I write CSS all day every day in Bricks.@@spacevertex

@spacevertex 6 ай бұрын

@@Gearyco People like you who write custom css are the exception, not the rule, thus a minority. Page-builders aren’t designed for the minority, but for the majority who can’t write code. Thus the bar to measure a page-builder is not with custom css but with inbuilt functionality. Can a person with no coding skills build your layout in bricks? Yes. Can a person with no coding skills build your layout in Gutenturd? No. Balls and Stripes.

@zuber7358 6 ай бұрын

This was probably the most difficult video to watch on your channel.. 😢

@Gearyco 6 ай бұрын

It was the most difficult to record, too.

@stripedgoat8470 6 ай бұрын

10:02 ☝🏼 If you hold down ALT, you can select text freely, even if it's clickable ;-) Just a lil' tip that can be useful here and there :D I swear, this thing literally feels like it's intentionally designed to be garbage 🤦🏼‍♂. It hurts to watch how awful of an experience it provides...They should just throw this all into the trashcan, and re-imagine the entire thing from scratch. The head person behind this must be someone who isn't willing to give up on an idea if a certain amount of work has been put into it - even if it clearly sucks.

@Gearyco 6 ай бұрын

They have to fix the vision first. This is exactly the kind of product you end up with when you try to build something "for everyone." Until they ditch that vision, it'll continue to be pretty bad for everyone.

@justingallant1560 6 ай бұрын

Everything about this process, from building, creating, designing and developing looks incredibly uninspiring. If this was the only tool available to build a website in wordpress, I absolutely would not move forward. And honestly, I am open minded. I am not fanatical or rabid about the tool, provided it gets the job done. This is not the way. It cant be. How could there be so many limitations as we approach 2024. Is this really this bad or is Bricks just so good...

@Gearyco 6 ай бұрын

It's precisely what happens when you pursue a "for everyone" vision with a design-by-committee approach.

@John.Rearden 6 ай бұрын

Good entertainment. It’s almost like the Government vs Private Sector debate. If you gotta write custom css, to achieve functionality, it’s a trash builder.

@Gearyco 6 ай бұрын

I don't mind custom CSS. I use it all the time. Hiding away all the CSS capability is the problem part. And hiding away the things that CSS attaches to is also insanely frustrating.

@John.Rearden 6 ай бұрын

@@Gearyco Exactly my point, perhaps I put it wrong. To write custom css, as you do or prefer, is a choice, however, in Bricks one can achieve the same functionality without writing custom css, while in Gutenberg one can’t, and one is forced to write custom css, hence Bricks is a great builder while Gutenberg is a poor excuse of a builder. Anyhow, cheers.

@farokhheidari2944 5 ай бұрын

Gutenberg = Pure headache

@loliradotopper 6 ай бұрын

Am I...the only one who just know about margin-top: auto; to make the card space evenly without the "space between" ? I usually wrap the part where I want them to stick together and "space between" again. And you cheat by coding too much by the way, we suppose to explore the tools. LOL.

@Gearyco 6 ай бұрын

None of those options exist in the tools 🤷🏼

@korova-moo 6 ай бұрын

Just a shame your face is covering up some of the sidebar action...I don't know ecamm so I guess you don't see yourself when recording the screen?

@korova-moo 6 ай бұрын

ahh you did move yourself!

@Gearyco 6 ай бұрын

It's that I'm not used to the controls being on the right so I didn't think about it fast enough.

@saschageier 5 ай бұрын

a pain to watch... coming from bricks

@excelovita 6 ай бұрын

God, help your followers. This layout can be done in Gutenberg in 2 minutes, except for that hover effect. And that too, without writing a single line of CSS. I am really pissed off looking at your overconfident video... how confidently you people prove that the builder is not capable, instead of showing your ignorance.

@stevebaker2896 6 ай бұрын

Can you post a video of you doing it in 2 mins please? Also what do you mean by 'you people'? There's one person in the video...

@Fourcro 6 ай бұрын

Everyone here would be thoroughly impressed if you managed to pull that off.

@Gearyco 6 ай бұрын

Every person who says this is all 👄 and no 🛠️. Please show us! And don’t forget to make it maintainable - id hate to see you fumble right before the goal line.

@Tom-pl4co 6 ай бұрын

This has nothing to do with followers. Trying to recreate a design from Figma or some other tool in native Gutenberg is pretty much impossible right now. The workflow and UI of Gutenberg is horrible for trying to achieve anything complex. If that is not the case can you point to some videos from others showing this?

@excelovita 6 ай бұрын

I knew this comment will come to challenge me... I think I should make a video allthough I am not a KZfaqr. I have used many builder including Divi, Elementor, Oxygen and many more for many years... but after using Gutenberg I have stopped using any other. I found not just 1 but many reasons to stop using other builders.... and of course among those reasons one biggest reason was maintainable and modern way to build website. Now enough talk let me make a video and share.

6 ай бұрын

i make websites for more then 20 years now. the block editor is the worst i came across sins then. that thing is so frustrating. illogic. i rather build interface for my clients then let them strucle with this thing. i realy don´t know what wordpress is trying to proof here. It is shitty for users and catastrophic for developers.