Are you using the best free WordPress Gutenberg Block yet?
ฝัง
- เผยแพร่เมื่อ 5 ก.ค. 2024
- Are you using the best free WordPress Gutenberg Block? In this video I'll show you my number one favourite Gutenberg Block - the Cover Block.
Sign up for my newsletter www.pootlepress.com/sign-up-t...
Contact me at: jamie@pootlepress.com 📧
See our lovely Gutenberg WordPress plugins 🔥 www.pootlepress.com/wordpress... 🔥
Timeline:
0:00 - Intro
0:22 - What we are going to build
1:28 - The Cover Block settings
4:48 - Full Screen Banner with Glassmorphism
7:00 - Video Backgrounds with Gutenberg
7:40 - Gutenberg Boxes and Cards with CTA's
10:00 - Masonry Grid Cards with Gutenberg
12:05 - Parallax Images with Gutenberg
13:00 - The window effect with Gutenberg
14:40 - Why does the Cover block crop my background image?
15:29 - Cats cameo - ภาพยนตร์และแอนิเมชัน
![ความรักไม่ได้น่ากลัวขนาดนั้น (TRUST ME) - LYKN [ OFFICIAL MV ]](http://i.ytimg.com/vi/9np-lAtCRpQ/mqdefault.jpg)
I am so inspired by these juicy demos! Thank You so much!
thanks Inez :)
very very cool - thanks for speedy tutorials to boast my creativity - everyone thinks I am SO smart
That's great to hear Scott - I'm sure you are smart 😀
Jamie, I have been stalled redesigning my website for 4 years trying to figure out the best way to do exactly what you've done in this tutorial. I LOVE this! I was trying to learn Ulta by Themify and it was SO much harder to understand and do. So grateful to you. Thank you!
Love seeing all the creative ways to use this and the end one you accidentally stumbled upon is so cool 😎
thanks :)
You have some of the best tutorial videos out there! Thank you so much for your time in creating them.
Thank you so much Gina 🙏
You embody the KISS principle. You masterfully teach in simple terms what a newbie would find incomprehensible. Thank you.
thanks Eddy - that's so great to hear 👍
Great. Thanks for sharing your knowledge.
thanks Martin, glad it was useful 👍
Dope jingle bro :-)
Cheers, my daughter Meg made it 😉
@@jamiewp well composed Meg! Good skillz!
@@jamiewp Yes, what a cool jingle.
Bit of a find you are! Great vids!
This is great! Thanks Jamie - I was looking for something just like this.
Great 👍
Wonderful. You got my subscription!
So many great hacks there. much appreciated Jamie...
tks Kirk 👍
Great Video Jamie. Always learn something from your content. Nicely done!
Thanks Andy
I havent watched the whole video yet but I am sure by now this is the one I have been looking for few months now.
Great to hear 😀
I was looking everywhere for current info (Gutenberg 5.9) on the cover block. Your video describing how to use it blew me away. Very useful. Thank you.
Fab, great to hear James 👍
Great Jamie: Awesome 👍🏻So intuitive and so much value. I'm so grateful I found your video-channel and i love how well you structured all your videos: SOOO high quality. xxx Wowzers ♥
Hats off to you, dear Jamie - your work really inspires me!! 😳♥♥
Thank you so much Martin - comments like make all the effort worthwhile 😀
thank you Jamie. Your tutorial are tremendously inspiring. I have been interested in developing my WordPress skills for a while by now but I haven't been so encouraged till I have come across your channel. You really make the job looks very achievable yet very professional. Thank you again and keep going.
Thanks Emad - that's one of the nicest and most inspiring comments I've ever had 😀
Thank you. Very useful vídeo!
Thanks Mario 😀
This video will save me so much time in the future. Thanks for this and all your other videos which are always so helpful and presented in a simple to understand manner..Great channel.
Thank you Philip :)
I liked for your cats to get a treat and because your videos are so helpful! :D
thanks Rachel :)
perfect!
All your tutorials have been excellent! I am building a site for which a "click-to-enlarge images" function is essential. I was planning to use the WP Featherlight plugin but was advised it may not work with 5.9. Is there another plugin that would enable the click-to-enlarge function? Thank you
Absolutely blowout..thanks a lot.
Tks 👍
@@jamiewp I tried glass morpism. Cannot find overlay slider in column - background color. WP 5.9 & Kaence theme. What I am missing? Gutenberg plugin ? on top of 5.9? Confused.
@@aviationandbeyond yup you need the gutenberg plugin atm - it will be rolled into core though in next release 😉
@@jamiewp I thought Gutenberg was rolled in with 5.9 thanks for clarifying.
@@aviationandbeyond it is rolled in, but the plugin is always a few steps ahead of whats included in core Wordpress.
loving the cover block! i also started using the html-anchor function to label parts of my posts, and it was working for a while, but all of the labels have disappeared in the list view now. i tried switching themes and disabling plugins to see if the labels come back but they don't...any idea what went wrong?
Can u also mention best image sizes for the different blocks?
Thanks Gina, But I find it is unable to edit the product blocks independently for mobile or tablet version. is there any solution for it. Thanks so much again.
Another great video! What I particularly dislike about the Cover block is that I cannot choose a focal point when I click on 'Fixed Background'. And so, some of the images look disproportionate :(
Thanks James 👍I might try to dive into that issue.
Really enjoying your videos Jamie! I'm having an issue with my cover block not showing on my main posts page. I'm trying to add a cover block that shows on my blog posts page where my articles are displayed. I even tried adding a featured image as a test and it doesn't show either. Again, this problem is on my main blog page, not the individual post page. Any ideas? I have an Astra theme.
Hi Chris, I think it's because the main blog page is a dynamic page that just shows your posts automatically. One option is to create a custom blog page - here's a video that shows one way to do it th-cam.com/video/SuW_gzqBexs/w-d-xo.html
@@jamiewp This is exactly what I’m needing!! Thanks for the super fast reply and help 😊
thanks for yrs Gutenbergs videos but question for newbis how to insert lorem ipsum paragraph :):):)
I use a free chrome add on chrome.google.com/webstore/detail/lorem-ipsum-generator-def/mcdcbjjoakogbcopinefncmkcamnfkdb?hl=en
A good explanation from Jamie! I'm trying the 9-block grid, but I only get big gaps between the pictures. I'm using the column block as in Jamie's explanation. Full-width. Anyone have an idea what I'm doing wrong here? I use 2023. Thanks in advance!
Do you have a link you can share ??
@@jamiewp Unfortunately I can't send a link because I'm still testing it on MAMP. But by now I know that the 9 box grid works well with WP 2021 and 2022, but not with 2023. It took me a while to understand. It is not properly distributed in WP 2023 due to the intervening space. So I am now incorporating your fantastic tip for the layout grid into WP 2022. This works great! Thanks for your concern. I learned a lot from you! Aad Hendriks
This block is excellent. Bad thing is that if I make the cover fixed it looks good on desktop, but does not look good on mobile. The image shows only a part. If I remove the 'fixed' option and make it wide width, it is better, but I can't make it fixed on desktop. I use the new twenty twenty two theme. Is there a possibility to make this work also on mobile?
Hi, this is a little difficult to explain, but the background image will always look like it crops on different screen sizes. Imagine you had an image of landscape proportions and you wanted to show the whole background image regardless of the device it was being viewed on. That's ok on a desktop of a fixed size but on a mobile if you kept the proportions of the image, it would be tiny (because it would keep the landscape ratio) and the text would likely drop below the image. Lemme know if that makes sense. With the Cover block the text takes priority over the background image.
can we use the cover block to build a header...
Yup
Thank you! I will name my first son after you! (Do you have a middle name???) Love this video!
😉
thank you - i do have a middle name but it's a bit of a secret ...hint: i was born on Christmas Day
I created an image with an animated title in Canva and saved it as an mp4. I used the Cover block to add this image, but it's dark. How do I get it to show the true color? I can't figure it out. Thank you
The cover block has an overlay applied - you can remove in the block settings panel in the right
It is acting like a section block in UAG which you can add blocks in it.
Yup exactly, but it's a core block 😀
@@jamiewp Absolutely :)
Strange, my color picker does not have the opacity slider in color panel.
Are you using the latest version of the Gutenberg plugin?
@@jamiewp ohhh its only in the plugin? I just figured WP built in Gutenberg was the same.
Why not just using the new FSE who is doing the same things ?
sorry not sure i understand what fse has to do with this?
@@jamiewp I mean the beta editor
I don't see padding feature any more
What theme are you using ? Not all themes turn it on
@@jamiewp Bricks, I didn’t think about it. Thanks
Easy, simple, quick.....NOT!