Jamie, congratulations!!! The way you approach construction with the Block Editor is completely simple and intuitive. You make it seem like it's possible to create anything with the Block Editor and this gives us another point of view on how Gutenberg is frowned upon and maligned among admirers of Page Builders like Elementor, Beaver Builder and others. Keep up the informative and inspiring work!!! My like is guaranteed!
Great video Jamie, it goes to show what can actually be done with the Gutenberg block editor. It also shows that the big brands out there aren't really doing anything overly fancy to sell their products. Granted, Apple's website will probably have a hell of a lot more going on in the background in terms of the technology used, but for average users, small businesses, etc. then the results are perfectly acceptable for a website.
Love your tutorials. They are great!! One aspect of the Apple website that would be great to do is that the whole of each section is clickable. Is it possible to do this in Wordpress?
Hi Jamies, This was good. Makes it very simple. However, I see you didn't add the 'Search' functionality in the header for this site. Well the core Gutenberg Search block severely lacks any design customisation. And I am not finding any other viable Search block. Can you recommend good Search blocks from other developers which have just a magnifying glass icon like on the Apple website and opens a drop down search field like on the Apple site?
Fantastic video. I would LOVE a video where you take what you've created here and properly build out Apple's mega menu. IMO it really is the star of the page. It's beautifully minimalistic, with some elegant subtleties that I can't find anywhere else. e.g. dropdown speed is perfect and not jarring, text columns in mega menu populate top to bottom AND left to right, page (background) blurs as menu expands, and as you scroll, the header is not only a semi-transparent layer (os opposed to opaque) that also has a blur effect that keeps background text/objects from being too visible when scrolling through that plane.
I've been enjoying your videos on website development and am interested in creating a website using the free version of the Astra theme, with a focus on affiliate marketing. Could you recommend any beginner-friendly videos that guide through setting up a blog grid on the homepage and essential features for affiliate marketing with Astra? Your insights would be incredibly helpful for newcomers like me.
This was really useful. I recreated the site with you. In the apple site though you can click on the images and you will go to a page. Is this possible using cover images. Can you add a link to a cover image so that when clicked you will go to a new page? Thanks!
Really great job on this one, I still would like to see some tutorials on the mobile version if possible, there is any way you would be able to customize the breakpoints? How you manage that for your clients by custom code? Thanks 😊
Great! Inspiring and educational. It goes beyond the possible scope of these videos of course, but Apple's top menu is a really nice mega menu. Tricky to do with FSE, I think, and I would really appreciate a few tips there. Also, it seems Apple has managed to make that mega menu sort of accessible to screen readers, using some special magic.
You popped in a pre built navigation bar, so as we try to follow along, we do not have that prebuilt navigation, and that would seriously impact your 30 minute build. For us newbies, leaving out those details and flying around the menu options in WP does us no good. If you would speak a little more slowly and explain what you are doing instead "click here" these videos would be a lot more useful. It is not a race. If these videos are meant to be instructive, you need to not skip over the details. But if these are just to show your expertise and speed, and using pre built things we do not have, then sure, you're the best and fastest...
Great point, it's a difficult balance to strike for sure.. The main purpose of these recreation videos is to inspire people to see what's possible with Gutenberg, with little learning points along the way. They're not meant as step by step guides. I do quite a few step by step tutorials on the channel though 😀
@@jamiewp I understand it is not a step by step, but it is also not "inspirational". People are not inspired by what they cannot do. You can show me a guy losing 45 pounds and looking ripped, but it does not inspire me when I find out he was taking anavar and deca. You can say you built the Apple site in 30 minutes, but seeing the fast speed video and pre built iitems, and zero explanation is likewise not inspiring. You're just showing me that a beginner cannot do what you did. I tell tutors and instructors this all the time, the worst part of WP is opening a template and seeing a black and white template or other screen that looks nothing like the beautiful template you just purchased. THAT is the biggest obstacle to making or editing a good WP site - getting over that initial screen, going from template, to a usable interface where you can actually edit what you bought. So many instructors overlook that fundamental step in learning WP.
Honestly, I get lots and lots of people emailing me that this video series has inspired them to try gutenberg and block themes, and these videos get hundreds of likes and shares - so it's certainly working for some people. I've also just been commissioned to make one for Envato (1.8 million TH-cam subscribers) so they are working for many people :) Sorry you find them frustrating, but i have made over 100 videos on Gutenberg on my TH-cam channel that are step by step. I made this one last week which goes into great detail to try and explain things for beginners th-cam.com/video/hvd6h_RpFJM/w-d-xo.htmlsi=K3Lp4EhiGDheSy5X and these are a big focus going forward. fyi that prebuilt navigation bar, the only thing i did was to publish the pages first. Everything else i showed i think. @@newunderthesun7353
@@jamiewp I am certainly not questioning your skill or your good intentions, and I am a subscriber that appreciates your work. My critique is more from the standpoint of a frustrated designer and educator looking for resources and other teaching methods for my students, who just do not have an iota of an attention span. When you do your Envato series, just please speak more slowly and deliberately. If you watch your videos, AFTER your instructional portion you slow down your speech considerably. Same with your white board, you speak much more directly, but as soon as that mouse gets in your hand you hit the accelerator. Just observations, my friend, no worries. Wish you well.
Is there really any difference going from default to astra. Looking at redesigning my current website and trying to determine if astra is going to be more of a hindrance. Using Gutenberg blocks but do a lot in the raw html
If you create it as a template, then you always need to update the front page using the Appearance > Editor? How about for regular pages? Do you create them just regularly and edit them using Gutenberg (is that the same as block editor? I'm so confused) or do you create all of them with the editor and create them as templates??
Hi , great questions :) Yes with regular pages you create them in the normal way and edit using the Block Editor (which is also known as the Gutenberg Editor).
Thanks very much for the quick reply. Is there a reason you use the Appearance > Editor to make the front pages as a template instead of just editing them in the Pages section?
@@tomcha75 in this case it just makes for an easier demo and so i could show the navigation and the page being built together. Ideally you would want templates keep separate from content 👍
@@jamiewp Thanks. So I can just use the template section for building headers and footers, and use the Pages to build the rest of the pages. Having too many options are confusing. I guess I can use the template section to build templates for pages or posts if I don't like the theme's default templates?
Love these videos! Interesting that you build the page as a template? Seems to be the approach twenty twenty four took as well. I have been creating a page template with header, content and footer then go into the page to build it???
Thanks Douglas - your approach is great. For these quick videos i try to keep things as simple as possible. Thats always a balance thats quite hard to get right, but hopefully they inspire some people to give gutenberg and blocks themes a try .
Good question 👍@@kaeden2088 Because the vast majority of sites won't ever use a carousel - that's always my guide on whether something should go into core or not. But it's always a balance to strike for the gutenberg dev team for sure and I can see both sides of the argument.
@@jamiewp I'm sorry Jamie ii i wasn't very clear, I'm talking generally not about this theme, it's just i have this doubt when i'm developing my block theme i always wrap all my sections in a group, even if it ' is columns, rows, etc.. and i don't if it is a got practice. thanks for answering 🙏
Hey, just a quick note. I like your "this all only takes minutes" to create/recreate videos and watch most of the time, but I'm afraid they may give some people (potential clients who would be served well with a simple block theme) the wrong impression of the effort it takes to create even a simple website in WordPress from scratch (just think of the work that a navigation block needs to actually "work"). Think small business owners who see your videos and then think they're being ripped off with agency/freelancer quote for, say, 2 workdays for hosting setup/ installation, simple "design" and content curation for, say, a local barbershop page who's just got a logo and potentially a colorscheme in terms of design assets.
Thanks and i hear you - it's a complex issue for sure, especially with the advent of AI tools that are now doing this in a few clicks (i have a Kadence AI coming out soon where my daughters try to build a website in 10 minutes). In my latest recreation video i recreated the NASA home page in 30 minutes but gave more context to how complex the overall project was. I'll try to do more of this in the future as I think it helps set the context better. Here's a link if you want to take a look at the introduction th-cam.com/video/-afMM8ykemw/w-d-xo.htmlsi=BNr-esNYSNQcNLq1 . Let me know what you think.
@@jamiewp Hey thanks for the amazingly quick reply, you keep in style with your fast videos ;) I looked at the Nasa video, and yes, you're right that it helps set the context better, but it mainly does so with respect to the scale of the integration, something which has its own challenges. As you say, more context would help, as a similarly looking website can cost 300 USD or 3000, 30K, or even more, like Nasa's, or Apple's which may, including all work hours of everyone involved potentially have cost 7 figures, including hosting at scale. My point is more that a lot ot the stuff needed for even simple websites (responsiveness, editor curation, pattern creation, etc) isn't mentioned because it's not relevant to your videos. Which is fair enough. But as you apparently agree, the context matters - so yeah, would be great if you mentioned it from time to time. I'm mentioning this today because I recently had a conversation of about 20! minutes explaining a fairly intelligent friend the difference between a domain and webspace when she wanted to hire someone to create a simple website for a relative's small business.
@@tsxpneo Yup it's a really interesting space atm. Last week I covered Canva's website building which is almost completely frictionless for a complete beginner. You got me thinking :)
what im really confused by is that you're doing all of this on the template and not the page? You say in this video th-cam.com/video/RsFMHafzUz4/w-d-xo.html not to put content into your template!!! What the hell am i missing???
You are correct - i did this in the template for demo purposes so i could show the header design and page design in one video. But yes, ideally put content in pages.
Enjoy these rebuilds, bigly. Thanks Jamie.
Cool and thanks 🙏
Jamie, congratulations!!! The way you approach construction with the Block Editor is completely simple and intuitive. You make it seem like it's possible to create anything with the Block Editor and this gives us another point of view on how Gutenberg is frowned upon and maligned among admirers of Page Builders like Elementor, Beaver Builder and others. Keep up the informative and inspiring work!!! My like is guaranteed!
Thanks so much Denison, its great to hear that these are useful 👍
There is so much in this video that you can learn from it
thanks for watching 😀
Your demonstration was easy to follow. This looks a lot more fun than the previous versions. Thank you!
thanks Sandy
Thanks for this, Jamie.
I have a question : how can I reproduce the icon inside the button ?
There’s an option to add a inline image (in the floating toolbar)
Love the carousel block! Used it on several client websites.
Yup it's cool
HI! First of all thank you so much, no wasting of time, directly to the point. But how do I keep the sticky menu, when I open other page? Please :)
Hi, at the moment one way is to edit the other templates in the same way.
Thank you so much@@jamiewp . done!
Great video.
If we could get a link to the ressources in order to imitate you, it'll be amazing. Please think about it next time.
Great video Jamie, it goes to show what can actually be done with the Gutenberg block editor. It also shows that the big brands out there aren't really doing anything overly fancy to sell their products. Granted, Apple's website will probably have a hell of a lot more going on in the background in terms of the technology used, but for average users, small businesses, etc. then the results are perfectly acceptable for a website.
Great point, i think most of the success of a website will come down to great design and storytelling.
Love your tutorials. They are great!!
One aspect of the Apple website that would be great to do is that the whole of each section is clickable. Is it possible to do this in Wordpress?
Thanks Aaron - check out this video th-cam.com/video/yBA8x3qL32M/w-d-xo.html
@@jamiewp That is perfect. Thank you.
@@aaron2273 👍
I really enjoyed this video, that was a lot of fun. Nice work! I’ll be watching this one a few more times I think. 😊
Thanks Andrew :)
Hi Jamies,
This was good. Makes it very simple. However, I see you didn't add the 'Search' functionality in the header for this site. Well the core Gutenberg Search block severely lacks any design customisation. And I am not finding any other viable Search block. Can you recommend good Search blocks from other developers which have just a magnifying glass icon like on the Apple website and opens a drop down search field like on the Apple site?
Thanks - there is actually an option to just have an icon with the core Gutenberg search block
Fantastic video. I would LOVE a video where you take what you've created here and properly build out Apple's mega menu. IMO it really is the star of the page. It's beautifully minimalistic, with some elegant subtleties that I can't find anywhere else. e.g. dropdown speed is perfect and not jarring, text columns in mega menu populate top to bottom AND left to right, page (background) blurs as menu expands, and as you scroll, the header is not only a semi-transparent layer (os opposed to opaque) that also has a blur effect that keeps background text/objects from being too visible when scrolling through that plane.
Thank you and yes that's is on my list, but I'm waiting to be able to do this in WordPress core which is coming (but I'm not 100% clear on the eta)
@@jamiewp that's exciting to hear! *Subscribed*!
This is great! Thank you for this. I'm going to have my designer and dev use this as inspiration for our FSE transition this year.
Fab, tks for commenting :)
I've been enjoying your videos on website development and am interested in creating a website using the free version of the Astra theme, with a focus on affiliate marketing. Could you recommend any beginner-friendly videos that guide through setting up a blog grid on the homepage and essential features for affiliate marketing with Astra? Your insights would be incredibly helpful for newcomers like me.
This was really useful. I recreated the site with you. In the apple site though you can click on the images and you will go to a page. Is this possible using cover images. Can you add a link to a cover image so that when clicked you will go to a new page? Thanks!
Hi Lara - yes it is 👍 check out this video th-cam.com/video/yBA8x3qL32M/w-d-xo.htmlsi=83MAGG82vF6WsarV
Really great job on this one, I still would like to see some tutorials on the mobile version if possible, there is any way you would be able to customize the breakpoints? How you manage that for your clients by custom code? Thanks 😊
Love this type of video
Thanks Ralf ☺️
Another home run. Twenty Twenty Four is so much fun.
Wait til you see what is coming in WordPress 6.5 - it could be mega (menu). :)
@@jamiewp Custom fields?!?!
Font Library updates!@@jamiewp
Yup and maybe mega menus hopefully@@CarlMadsen
i was looking for something like this. thank you so much!!!
Great to hear 👍
Love this Jamie!
thank you
Great! Inspiring and educational. It goes beyond the possible scope of these videos of course, but Apple's top menu is a really nice mega menu. Tricky to do with FSE, I think, and I would really appreciate a few tips there. Also, it seems Apple has managed to make that mega menu sort of accessible to screen readers, using some special magic.
Thank you, there is hope that mega menus might be possible with WordPress 6.5 , but let's see :)
Thanks for your super Input. I love it.
Thanks Oliver
Nice video!
Can you please make a video/tutorial when you make a complete niche site/blog site?
Would be amazing to see!
Any ideas on what niche? or is there a famous one i could base it on (that would make an interesting story)
You popped in a pre built navigation bar, so as we try to follow along, we do not have that prebuilt navigation, and that would seriously impact your 30 minute build.
For us newbies, leaving out those details and flying around the menu options in WP does us no good. If you would speak a little more slowly and explain what you are doing instead "click here" these videos would be a lot more useful.
It is not a race. If these videos are meant to be instructive, you need to not skip over the details. But if these are just to show your expertise and speed, and using pre built things we do not have, then sure, you're the best and fastest...
Great point, it's a difficult balance to strike for sure.. The main purpose of these recreation videos is to inspire people to see what's possible with Gutenberg, with little learning points along the way. They're not meant as step by step guides. I do quite a few step by step tutorials on the channel though 😀
@@jamiewp I understand it is not a step by step, but it is also not "inspirational".
People are not inspired by what they cannot do. You can show me a guy losing 45 pounds and looking ripped, but it does not inspire me when I find out he was taking anavar and deca.
You can say you built the Apple site in 30 minutes, but seeing the fast speed video and pre built iitems, and zero explanation is likewise not inspiring. You're just showing me that a beginner cannot do what you did.
I tell tutors and instructors this all the time, the worst part of WP is opening a template and seeing a black and white template or other screen that looks nothing like the beautiful template you just purchased. THAT is the biggest obstacle to making or editing a good WP site - getting over that initial screen, going from template, to a usable interface where you can actually edit what you bought. So many instructors overlook that fundamental step in learning WP.
Honestly, I get lots and lots of people emailing me that this video series has inspired them to try gutenberg and block themes, and these videos get hundreds of likes and shares - so it's certainly working for some people.
I've also just been commissioned to make one for Envato (1.8 million TH-cam subscribers) so they are working for many people :)
Sorry you find them frustrating, but i have made over 100 videos on Gutenberg on my TH-cam channel that are step by step.
I made this one last week which goes into great detail to try and explain things for beginners th-cam.com/video/hvd6h_RpFJM/w-d-xo.htmlsi=K3Lp4EhiGDheSy5X and these are a big focus going forward.
fyi that prebuilt navigation bar, the only thing i did was to publish the pages first. Everything else i showed i think. @@newunderthesun7353
@@jamiewp I am certainly not questioning your skill or your good intentions, and I am a subscriber that appreciates your work.
My critique is more from the standpoint of a frustrated designer and educator looking for resources and other teaching methods for my students, who just do not have an iota of an attention span.
When you do your Envato series, just please speak more slowly and deliberately. If you watch your videos, AFTER your instructional portion you slow down your speech considerably. Same with your white board, you speak much more directly, but as soon as that mouse gets in your hand you hit the accelerator.
Just observations, my friend, no worries. Wish you well.
👍@@newunderthesun7353 thanks very much for the feedback
Another great video! Thank you!
Thanks Brad
Love this Jamie!
Thank you 🙏
Is there really any difference going from default to astra. Looking at redesigning my current website and trying to determine if astra is going to be more of a hindrance. Using Gutenberg blocks but do a lot in the raw html
It really depends on the project - if you are comfortable with a block theme then great.
Excellent content :))
Thank you!
THANK YOU!!! :)
You're welcome!
If you create it as a template, then you always need to update the front page using the Appearance > Editor? How about for regular pages? Do you create them just regularly and edit them using Gutenberg (is that the same as block editor? I'm so confused) or do you create all of them with the editor and create them as templates??
Hi , great questions :) Yes with regular pages you create them in the normal way and edit using the Block Editor (which is also known as the Gutenberg Editor).
Thanks very much for the quick reply. Is there a reason you use the Appearance > Editor to make the front pages as a template instead of just editing them in the Pages section?
@@tomcha75 in this case it just makes for an easier demo and so i could show the navigation and the page being built together. Ideally you would want templates keep separate from content 👍
@@jamiewp Thanks. So I can just use the template section for building headers and footers, and use the Pages to build the rest of the pages. Having too many options are confusing. I guess I can use the template section to build templates for pages or posts if I don't like the theme's default templates?
@@tomcha75 yes exactly right 👍
Love these videos! Interesting that you build the page as a template? Seems to be the approach twenty twenty four took as well. I have been creating a page template with header, content and footer then go into the page to build it???
Thanks Douglas - your approach is great. For these quick videos i try to keep things as simple as possible. Thats always a balance thats quite hard to get right, but hopefully they inspire some people to give gutenberg and blocks themes a try .
great job!
Thank you 🙏
Can you put in word to get a carousel naturally built into Gutenberg! Btw love the videos
thank you 😀 for me carousels feel like they should stay as plugins (i think)
@@jamiewp if you don’t mind, why?
Good question 👍@@kaeden2088 Because the vast majority of sites won't ever use a carousel - that's always my guide on whether something should go into core or not. But it's always a balance to strike for the gutenberg dev team for sure and I can see both sides of the argument.
Awesome 🥰
Thanks 🙏
Hi Jamie , I'm using a group on each of my sections in the page, do you think is unnecessary wrapping all of my section in a group, thanks in advance
So you are not using cover blocks?
@@jamiewp I'm sorry Jamie ii i wasn't very clear, I'm talking generally not about this theme, it's just i have this doubt when i'm developing my block theme i always wrap all my sections in a group, even if it ' is columns, rows, etc.. and i don't if it is a got practice. thanks for answering 🙏
Jusr commenting for the algo
Hey, just a quick note. I like your "this all only takes minutes" to create/recreate videos and watch most of the time, but I'm afraid they may give some people (potential clients who would be served well with a simple block theme) the wrong impression of the effort it takes to create even a simple website in WordPress from scratch (just think of the work that a navigation block needs to actually "work"). Think small business owners who see your videos and then think they're being ripped off with agency/freelancer quote for, say, 2 workdays for hosting setup/ installation, simple "design" and content curation for, say, a local barbershop page who's just got a logo and potentially a colorscheme in terms of design assets.
Thanks and i hear you - it's a complex issue for sure, especially with the advent of AI tools that are now doing this in a few clicks (i have a Kadence AI coming out soon where my daughters try to build a website in 10 minutes). In my latest recreation video i recreated the NASA home page in 30 minutes but gave more context to how complex the overall project was. I'll try to do more of this in the future as I think it helps set the context better. Here's a link if you want to take a look at the introduction th-cam.com/video/-afMM8ykemw/w-d-xo.htmlsi=BNr-esNYSNQcNLq1 . Let me know what you think.
@@jamiewp Hey thanks for the amazingly quick reply, you keep in style with your fast videos ;) I looked at the Nasa video, and yes, you're right that it helps set the context better, but it mainly does so with respect to the scale of the integration, something which has its own challenges. As you say, more context would help, as a similarly looking website can cost 300 USD or 3000, 30K, or even more, like Nasa's, or Apple's which may, including all work hours of everyone involved potentially have cost 7 figures, including hosting at scale. My point is more that a lot ot the stuff needed for even simple websites (responsiveness, editor curation, pattern creation, etc) isn't mentioned because it's not relevant to your videos. Which is fair enough. But as you apparently agree, the context matters - so yeah, would be great if you mentioned it from time to time. I'm mentioning this today because I recently had a conversation of about 20! minutes explaining a fairly intelligent friend the difference between a domain and webspace when she wanted to hire someone to create a simple website for a relative's small business.
@@tsxpneo Yup it's a really interesting space atm. Last week I covered Canva's website building which is almost completely frictionless for a complete beginner. You got me thinking :)
This Apple site design is pretty basic, key is the high quality photos and graphics, something some clients don't always realize for their own site
Yup great point
what im really confused by is that you're doing all of this on the template and not the page? You say in this video th-cam.com/video/RsFMHafzUz4/w-d-xo.html not to put content into your template!!! What the hell am i missing???
You are correct - i did this in the template for demo purposes so i could show the header design and page design in one video. But yes, ideally put content in pages.
🫡🫡
Thanks for watching
godaddy’s 365 is THE WORST.