ฝัง
- เผยแพร่เมื่อ 12 มิ.ย. 2021
- In the past, when you want dynamic content on Gutenberg blocks, you have to meddle with codes and it is not beginner friendly. Now, with the advancement of Gutenberg Blocks, we can finally use Dynamic Content straight from the Gutenberg Block Plugin.
In this video, I am going to show you two ways to use the Stackable's Dynamic Content Features to build beautiful templates for your website.
Currently, Appsumo is running a lifetime deal, feel free to check it out here (Not an affiliate link):
appsumo.com/products/marketpl...
In case the Appsumo deal has expired, you can check out their website directly (latest discounts included - affiliate link): jackcao.com/stackable
🔨 Themes, Plugins and Tools I use:
✅ Recommended Web Host
👉 Cheap & Fastest Web Host: jackcao.com/cloudways
✅ Recommended WordPress Theme
👉 Kadence WP: jackcao.com/kadence (10% OFF: JCSAVE10)
✅ Recommended Caching & Optimization Plugin
👉 Best WordPress Caching Plugin: jackcao.com/best-wp-caching
✅ Recommended WordPress Plugins
👉 Recommended WordPress Editor Blocks: jackcao.com/kadence-blocks
👉 Best Marketing Quiz Builder: jackcao.com/thrivethemes-quiz
👉 Spam Protection: wordpress.org/plugins/akismet/
👉 Link Management: wordpress.org/plugins/pretty-...
👉 Image Optimization: wordpress.org/plugins/imagify/
👉 Recommended Email Autoresponder
Best Email Autoresponder for Affiliates: jackcao.com/best-email-autore...
✅ Recommended Page Builder
👉 Bricks Builder: jackcao.com/bricks
🎓 More Helpful Videos:
✅ WordPress Gutenberg Playlist: • WordPress Tutorial for...
✅ Speed Optimization Tips & Case Studies: • How to Speed Up Your W...
✅ Switching from Page Builders to Gutenberg: • [Guide] How to Switch ...
__________________________________________________________________________
AFFILIATE DISCLOSURE: This video and description may contain affiliate links, which means that if you click on one of the product links, I’ll receive a small commission. I won't put anything here that I haven't verified and/or personally used myself. And, you will never pay anything more than what it cost if you buy the product directly from the source. From time to time, I may even provide you with some discount codes to help you save money.
__________________________________________________________________________
#dynamiccontent #gutenbergdynamiccontent #gutenberg #jackcao #gutenbergblocks #gutenbergcustomfields
Very well explained. Thank you!
Wow, nice feature. Thanks for sharing 🙏
Thanks for the helpful content!
You are most welcome!
If I recall right, you mentioned that Kadence's beta dynamic blocks is limited to text-based custom fields. Doing some digging around with beta myself, I found a few quirks that CAN allow using dynamic content for images!
Dynamic content is available within the Info Box. You can change the icon to an image instead, and there IS the option to now use dynamic content from an image field. If you only want a dynamic image, you have to essentially gut the Info Box to only the icon(now image) field and clean up all padding & margins. BUT it's workaround.
You can also use a dynamic image in row backgrounds (without any funky tweaks)!
Lastly, this all shows that the potential for adding dynamic content to the actual Image block (or hopefully the Video Popup block that I direly need ASAP) is already present in the code! It just needs finessed a bit more.
Absolutely! Kadence dynamic content now allows for dynamic images. I am creating a tutorial as we speak showing how to use those dynamic fields to create custom post layouts.
YES! That was what im waiting for!
Thx Jack!
after watching it, i have to say this seems very complicated.
i hope the WP update will give us a more intuitive option
@@faithnomore101 To put it simple, dynamic content will always have to draw information from somewhere. So, in this video, I created custom fields so that the dynamic content will draw informatio from those fields. I will look into the next WP and Stackable update. 😁
It’s not complicated. But Stackable is still implementing this. GeneratePress for example have had dynamic content since February and it’s very easy and more powerful to use.
Thanks for sharing 🙏
dont feel like this is dynamic conten entirely, if it was dynamic then, I should only build 1 page and the text would show deppending on the button I press, and I should have a panel where to load the different fields right?
Love it!
1:55 I am very lucky to find you in TH-cam. thanks for all the knowledge you share for free.
Hi Jack you are awesome!
Can you please prepare a video about SCHEMA?
I interest in Google Tag manager and creating dynamic variations for SCHEMA
Thanks
This is great
Did you know you can use shortcodes directly in core Gutenberg blocks? ex: Header Block - Welcome [my_shortcode], glad to se you back! It will render the shortcode.
I've create a few to react to cookies or URL query parameters and it will display the dynamic content.
Ive just seen that Gutenberd 5.8 is going to have dynamic content by default
And reusable blocks as well...
Hello, your tutorials are easy to watch, thanks for that.
Now I need a tutorial to add ACF fields in woocommerce products using Gutenberg.
Is that possible?
nice video. I am still waiting for creating my account, login and register pages with Gutenberg
THX JACK!
Can we pull data from the backend in this way?
For example, can we call the list of students attending our course with dynamic content?
Thank you @Jack Cao for 10% off :) I bought yearly access to Kadence and I just love it ! 95+/100 mobile speed on my affiliation sites ;) Was max 50 with elementor.
to get 90+ score with elementor, try a plugin called nitro pack
At last. Thanks. @jackcao, what can you say about Crocoblock plugins for Gutenberg? Are they worth looking into? Am about the site speed so if is not I will just forget about it just need someone who's been using Gutenberg with Crocoblock
Hi Jack, first congratulations on your work. Do you have any suggestions for a theme for your property listing? Let it be quick and preferably with Gutenberg.
Thanks!
I'm still experimenting with this though. So, I can't give you a straight answer unfortunately. I'll keep you posted. Is it urgent?
@@JackCao I'm starting to research, because I need to implement here for a real estate agency. Thank you very much if you can share after testing. Thank you very much!
could you please make video on yoast vs rank math- the difference between them and which one do you think is better..?
The quality of content on your channel is leaps and bounds ahead of any other youtube channel for making a website. Thank you for all the information out here! I need to decide on a theme for my (new) wordpress website. I read a blog post which said that Neve theme is a "mobile first" theme. Whereas other themes like kadence are "mobile responsive". And so Neve is better in that sense. Can you explain the difference between a mobile first and mobile responsive theme (specifically neve and kadence). How much of an advantage does this give to the Neve theme (If any at all)?...Kadence offers many more features in its free version than Neve. So i want to use Kadence (since i want a free theme). But i want to know whether "mobile first" approach of Neve makes any significant difference. I would be very grateful for your input on this.
Speed wise generatepress is best and kadence is second best. If you like go for kadence free version for a blog as it is free customizable and responsive. mobile responsive and mobile first is kind of same thing. Different companies use their own words to make their product look different.
Mobile first means the code is first made for mobile then they add code for computer version. Whereas mobile responsive means code is for computer then a part is for mobile which generally is too much code. I also recently found that Neve Theme gave me better Page Speed Insight!!! I have Neve Theme Pro and Kadence membership Pro to compare
Awesome Jack, Thanks! Quick question: Will this work with Jet Engine instead of ACF? Cheers...
I haven't tried Jet Engine. I will check them out soon.😊 Do you already own Jet Engine or are you considering buying it?
@@JackCao Thanks for responding. I already own it, hence my asking mate.
@@JackCao generatepress also have some features for dynamic content in it's pro version which you should definitely try. It works good with Gutenberg
Hi Jack,
Amazing stuff!
Very quick question...
Do you know if this can also work for custom fields in WooCommerce products for dynamic content in single product pages?
I can imagine creating accordions for product pages like you showed in your previous video and have the content of those accordions show dynamic content populated from custom fields in WooCommerce products. That would be amazing!
I haven’t tried Stackable on a product page but at least on a Woo category page. That worked just fine.
@@DanielNordmark Thanks! And I just found out that GeneratePress already offers dynamic content and Kadence will release theirs soon... :)
Right now I only use Gutenberg with Kadence Pro and have the lifetime with Kadence, would this work well with Kadence? meaning this would not slow down my website adding this plugin? still trying to figure out if I need this, the LTD looks like a great price, my website is just a woo commerce site with a blog, great video keep them coming, Thanks
Yes it works with Kadence 👍
Thanks. Which plugin do you use to add reusable blocks ?
You don't need extra plugins. Reusable blocks is imbedded in your standard WordPress editor.
@@JackCao ok thanks.
@jack Do you think that you could do a photographer website at least the home page and 1 gallery? I've asked you before about a gallery block and you talked about coblocks. Thanks -Scot
Do you happen to have an example or a website you always visit? I tried searching for "Best Photography Sites" and mostly are affiliate sites, nothing about showing cool photography skills.
@@JackCao I will try to find a few links for u in a few mins.
Hi thanks for the video. Don't really get the purpose of those stackable dynamic fields. Since you cannot add custom post types this make no sense to me. You could simply edit every subpage on your website and have the same results with less work. You need to add ACF as well so another plugin. (performance) Just use kadence + toolset it's almost the same price $69 and u have wayy better plugin + less work and better performance of your website
Toolset is amazing, especially with the Woocommerce plugin. But why Kadence?
I'm thinking of leaving WordPress because I don't think there is a solution for what I want to do in Gutenberg that is simple and straight forward. I have hundreds of my radio shows going back to 1988. The are hosted with the podcasting service castos. Webflow has a cm option where I an I port a .CSV file into fields. I don't know if the stackable plugin does this. If there is a Gutenberg solution, I would be interested. I just want simple and straightforward. Webflow's CMS seems to offer this unless I'm missing something in Gutenberg. Look for to advice and suggestions!!! 😀 Thanks!!!!!!!
Does your channel accept commercial cooperation?
Is KADENCE theme a "mobile first" theme? I read a blog post which said that kadence is not "mobile first" but it is "mobile responsive". Is it bad for seo if kadence is not "mobile first"?
In theory, a mobile first site should load quicker than a responsive site, because the CSS structure for mobile first is much smaller than responsive sites.
But in practical terms, for a normal website or blog that do not need a lot of dynamic mobile functionality, unlike a real estate listing site, there is little to no difference in terms of the performance on both page speed or SEO.
In fact, for a normal landing page, if you test the performance of a mobile first theme, like Neve, vs a responsive theme, like Kadence, you will notice that there isn't much difference in terms of performance. Check this out: th-cam.com/video/7ILIodysmzc/w-d-xo.html
Thank you for replying!
Even though Jack is correct there are more things that goes into the definition of a mobile first site. Mobile first is more important for how we developers and designers work..
Anyway, Google doesn’t care as long as a site works good using a mobile. Take a look in Google Search Console.
Hi Jack, dynamic content is only available in the paid version of stackable, not with the free version, right?
Yup, you are right. 😊
@@JackCao thanks Jack. I see a lot of people is talking about JetEngine. Now they have the Gutenberg version. I watched few videos. Looks powerful but I am not sure about this plugin speed optimisation. It must be combined with other Gutenberg blocks due to layout issue but it is not a big problem. Official compatibility is with Astra and Generatepress theme. I spoke to Crocoblocks and they can't guarantee compatibility with Kadence theme....Would really like to hear your opinion about JetEngine. thanks
First explain what is Dynamic Content, I watched all the video but it's not clear enough. Anyway I'll search on YT. Thks
It can be either a property from some other page / post but usually dynamic content is referred to custom properties that's added to a page/post/custom post type using either php, ACF or Metabox.
@@DanielNordmark Thank you for your reply, it's for advanced developers isn't it?
@@miketaiwanwalkcity6355 Not at all. For example the free version of ACF is easy to use. There are good guides here on TH-cam or on their website.
Are you using any particular theme? Are you using any page builder?
@@DanielNordmark I'm using Kadence Theme Pro with Kadence Blocks Pro recommended by Jack. But I found recently that Neve from ThemeIsle is faster in Page speed insight and has better CSS with YellowLab tools test. Thank you for your advice, I'll see ACF tutorials
@@miketaiwanwalkcity6355 And GeneratePress is even faster. 😉
Anyway, all three themes are good and way faster than all sites desperately holding on to Elementor or some other page builder.
I’ll take a look if I have any good videos for ACF..
Does it work with metabox?
Yes
After installing this plugin, the Google Page speed score drops by 8 points
I am trying to get away from Elementor Pro, but this is far too complicated for my clients- by far. Including those that already use WordPress.
If I showed them this video, they would be lost and I would end up constantly helping them.
Not so with Elementor Pro, even though it is slower to load.
It’s easy to make Gutenberg user friendly. All of my clients think it’s way easier to use..
Just make sure that only blocks and options they need are visible and hide the rest.
Is it anything in particular you or your clients think is complicated?
Hey there jack hope you remember me :)
Just a suggestion. you take little more time for introduction to the topics but i understand that's helpful for begginers. please consider reducing the time or adding chapters. :)