We need many more of these "rebuilt" tutorials. I can't thank you enough. Always impressed.

Glad to see Vivaldi in use!

0:20 big fan of the whiteboard overview of content. Very helpful to know if the content is what im looking to learn

Thank you for using our browser! 😊

I've been following him for a long time, and he is one of the outstanding and not stingy wordpress content creators. Thanks Sir. 🙏🙏🙏🍵

It is crazy this channel has only 14k subscribers. I love these "rebuilt" tutorials.

I've been a huge fan of TechCrunch's design aesthetic and have been trying to implement some of those ideas and spinning my wheels. You showed how easy it can be and revealed the more practical uses of Group which was mystery to me. Thank you sir.

By the way, Jamie, that multi-select technique you used to group multiple blocks? Genius! Until this very moment, I've always first added the Group block and then placed all the required child blocks within it. That multi-select approach is my go to method from here on. I also played around with the new Group block sticky positioning. In my case, the client site has a fixed header bar and, while I was happy to see the addition of the Group block position attribute (default or sticky), I was surprised that the setting doesn't also expose the position "top" setting. In lieu of that, top defaults to zero which works just fine in your TechCrunch site example since the left-hand sidebar will stick to the top of the page (top = 0) as needed in that example. If your page has a fixed header bar and you're using position sticky on some particular Group on the page, you need that Group to stick somewhere below that header bar. So, for example, if your header bar is 75px in height, you need to be able to set the position sticky top attribute to 75px plus, say, 25px as a gap between the Group block and the Header block. In css, you'd just set "top:100px;" for "position:sticky;". That's a curious omission to the position sticky block attribute (what you can do is create a css class like "sticky-top-position" and give it a non-zero top setting value and then add that class to the sticky Group to change the vertical stick point).

Thanks to you, sir, I've been able to finally grasp how the block editor works. This channel alone has provided the perfect content to allow me to finally be able to edit my WP websites without still relying on the old approach that required lots of plugins, and CSS hacks. Keep up the good work!

My favorite videos! They inspire me to play in the block editor and test out new designs and layouts. Great stuff!

Excellent, Jamie, excellent. TY

Well done Jamie! Excellent rebuild. 😀

Coming from a WP Pro: Awesome!

I'm learning more about how to build websites with Gutenberg with as little plugin as possible. Thanks for the videos!

*Thank you very much! Jamie with you there is always something new and valuable to learn!* *

Very useful! Thanks so much for sharing.

Hey Jamie, thank you so much for this rebuilt video and for the notice in the beginnning as it helps the watcher know what they will learn. The one question/thing I am a bit confused about is the way to work with templates as templates. In your beginner mistakes video, you mentioned that pages are not supposed to be built in templates. Yet, I didn't manage to find a video that shows the workflow of that. (correct me if I am wrong) Since most of the rebuilds are of the front page which is done in the way of putting the content in the template, and that makes it tempting to do the forbidden action of putting the content in the template..

Great tutorial Jamie, you never disappoint!👍

Thanks for knowledge sharing , If possible, please Brief how to add a feature video in a blog post. Thanks

Don't forget to create a blank theme with the "Create Block Theme" plugin and show us all how to create a complete theme from the ground up to a usable site.

Super helpful and fun to follow along. I was using Ollie so some of the little things were different but that was also helpful to learn Ollie.

Very good content! =D

An interesting thing I've found with setting column widths (as you discussed at around the 2:30 min mark in the video) is, if you have two columns, you need only specifically indicate the column width for the first one and leave the second column width blank (or blank it out if it has a value). Apparently, that second column will then just fill the remaining space (100% minus whatever width you set for the first column). This is handy if you're playing around with column widths for your two-columnar layout because you need only fiddle with just the first column width setting and the second (non width-specified) column will automatically play along. I presume that you could do this vice versa (set the second column width and let the first column width float) but it probably makes more sense to set the first. Haven't tried this lazy technique on a more-than-two-columnar layout but I'm guessing more than one blank column width is equivalent to saying "split these non width-specified columns evenly," e.g., if you have three columns and you set the first to 20% width but don't specify the width for the other two, they'll default to 40% each.

Encouraging

Great demo Jamie... Just goes to show what you can achieve with WordPress out of the box now. I also think your iteration of Tech Crunch looks cleaner compared to the "real" one (even though that's also made in WordPress)

I always learn new things here...

Wow... This was really helpful... Subscribed !!!.. I wonder why I don't have all those useful block styling settings available in my wp 😞

I love this series!

Love these Jamie, I've learned so much from these

Thanks for the video, nice job and tut. Gutenberg is getting better all of the time, but it is the little details that drive me crazy... and the lack of simple controls when needed. I appreciate your video, especially the loop feature. Soon I will give this one a try. Cheers!

As a plugin developer, this video now has me looking differently at Gutenberg.

Thanks for this tutorial. My Question is about the header that was created. It means every individual pages will require that you add the header into them manually and whenever you want to update them, you have to do it manually???

I watched this on 2x speed, and you did it in 15mins.

This was an amazing video, I really didn't like the Site Editor but now I (almost) swear by it. Now that Twenty Twenty Four is out, could you rebuild The Verge ? Asking for a friend 😬

Jamie Marsland in few words: The Legendary Gutenberg Man

@jamiewp : Loved the video. We have replicated it on our website to the extent you showed in the video. But, can't figure out how to insert the excerpt, which you mentioned doing in the last 2 minutes. Also, how do we replicate the layout throughout the website, like on individual pages and posts? Do we need to repeat the process? Or is there a simple way? Please share pointers. :)

When you add padding etc, this is being added as a block CSS style, right? Because it’s a global template? I’ve seen other site builders that add way too much inline CSS but I hope this FSE does not do that.

Thanks jamie. At 5:40 where do the patterns come from?

Amazing

ok i'm impressed. impressive for native gutenberg. so, why use a page builder?

Vivaldi, eh? That's what I use on my non-chromebook / android devices instead of Chrome. I only use Chrome on Chrome-native devices.

WordCrunch?

Still a long way to go. In terms of fine-tuning and responsive controls. Intrinsic design is no match for proper responsive controls.